From 018f6f03be21995c57790d0276b2066e3aa37195 Mon Sep 17 00:00:00 2001
From: 07akioni <07akioni2@gmail.com>
Date: Wed, 11 Mar 2020 20:46:45 +0800
Subject: [PATCH] chore: small fixes & custom input renamed as dynamic input

---
 .../{customAdd => dynamicInput}/enUS/basic.md |  2 +-
 .../enUS/custom.md                            |  4 +-
 .../{customAdd => dynamicInput}/enUS/index.md |  2 +-
 .../{customAdd => dynamicInput}/enUS/pair.md  |  2 +-
 .../{customAdd => dynamicInput}/index.entry   |  0
 .../{customAdd => dynamicInput}/zhCN/basic.md |  2 +-
 .../zhCN/custom.md                            |  4 +-
 .../{customAdd => dynamicInput}/zhCN/index.md |  0
 .../{customAdd => dynamicInput}/zhCN/pair.md  |  2 +-
 .../components/form/enUS/customRule.md        |  6 +-
 .../components/form/zhCN/customRule.md        |  6 +-
 demo/init.js                                  |  4 +-
 demo/loaders/NaiveUIDocLoader.js              |  6 +-
 demo/menuOptions.js                           | 12 +--
 demo/utils/ComponentDemo.vue                  | 94 ++++++++++---------
 src/CustomAdd/index.js                        |  9 --
 src/DynamicInput/index.js                     |  9 ++
 src/{CustomAdd => DynamicInput}/src/input.vue | 16 ++--
 src/{CustomAdd => DynamicInput}/src/main.vue  | 22 ++---
 src/{CustomAdd => DynamicInput}/src/pair.vue  | 26 ++---
 src/index.js                                  |  4 +-
 styles/{CustomAdd.scss => DynamicInput.scss}  | 10 +-
 styles/index.scss                             |  3 +-
 styles/mixins/mixins.scss                     |  2 +-
 24 files changed, 126 insertions(+), 121 deletions(-)
 rename demo/documentation/components/{customAdd => dynamicInput}/enUS/basic.md (95%)
 rename demo/documentation/components/{customAdd => dynamicInput}/enUS/custom.md (95%)
 rename demo/documentation/components/{customAdd => dynamicInput}/enUS/index.md (98%)
 rename demo/documentation/components/{customAdd => dynamicInput}/enUS/pair.md (94%)
 rename demo/documentation/components/{customAdd => dynamicInput}/index.entry (100%)
 rename demo/documentation/components/{customAdd => dynamicInput}/zhCN/basic.md (95%)
 rename demo/documentation/components/{customAdd => dynamicInput}/zhCN/custom.md (95%)
 rename demo/documentation/components/{customAdd => dynamicInput}/zhCN/index.md (100%)
 rename demo/documentation/components/{customAdd => dynamicInput}/zhCN/pair.md (95%)
 delete mode 100644 src/CustomAdd/index.js
 create mode 100644 src/DynamicInput/index.js
 rename src/{CustomAdd => DynamicInput}/src/input.vue (65%)
 rename src/{CustomAdd => DynamicInput}/src/main.vue (88%)
 rename src/{CustomAdd => DynamicInput}/src/pair.vue (55%)
 rename styles/{CustomAdd.scss => DynamicInput.scss} (80%)

diff --git a/demo/documentation/components/customAdd/enUS/basic.md b/demo/documentation/components/dynamicInput/enUS/basic.md
similarity index 95%
rename from demo/documentation/components/customAdd/enUS/basic.md
rename to demo/documentation/components/dynamicInput/enUS/basic.md
index 0d76c5d4c..67c01ff10 100644
--- a/demo/documentation/components/customAdd/enUS/basic.md
+++ b/demo/documentation/components/dynamicInput/enUS/basic.md
@@ -1,6 +1,6 @@
 # Basic
 ```html
-<n-custom-add
+<n-dynamic-input
   v-model="test"
   placeholder-key="placeholder1"
   placeholder-value="placeholder2"
diff --git a/demo/documentation/components/customAdd/enUS/custom.md b/demo/documentation/components/dynamicInput/enUS/custom.md
similarity index 95%
rename from demo/documentation/components/customAdd/enUS/custom.md
rename to demo/documentation/components/dynamicInput/enUS/custom.md
index 767ac5836..c3df772c8 100644
--- a/demo/documentation/components/customAdd/enUS/custom.md
+++ b/demo/documentation/components/dynamicInput/enUS/custom.md
@@ -1,6 +1,6 @@
 # Custom
 ```html
-<n-custom-add
+<n-dynamic-input
   v-model="test"
   title="Add CheckBox"
   preset="custom"
@@ -22,7 +22,7 @@
       />
     </div>
   </template>
-</n-custom-add>
+</n-dynamic-input>
 <pre>
 {{  JSON.stringify(test,0,2) }}
 </pre>
diff --git a/demo/documentation/components/customAdd/enUS/index.md b/demo/documentation/components/dynamicInput/enUS/index.md
similarity index 98%
rename from demo/documentation/components/customAdd/enUS/index.md
rename to demo/documentation/components/dynamicInput/enUS/index.md
index e0e415744..0552ba9e1 100644
--- a/demo/documentation/components/customAdd/enUS/index.md
+++ b/demo/documentation/components/dynamicInput/enUS/index.md
@@ -1,4 +1,4 @@
-# Custom Add
+# Dynamic Input
 
 ## Demos
 ```demo
diff --git a/demo/documentation/components/customAdd/enUS/pair.md b/demo/documentation/components/dynamicInput/enUS/pair.md
similarity index 94%
rename from demo/documentation/components/customAdd/enUS/pair.md
rename to demo/documentation/components/dynamicInput/enUS/pair.md
index 84cd8cb90..a904a92b6 100644
--- a/demo/documentation/components/customAdd/enUS/pair.md
+++ b/demo/documentation/components/dynamicInput/enUS/pair.md
@@ -1,6 +1,6 @@
 # Pair
 ```html
-<n-custom-add
+<n-dynamic-input
   preset="pair"
   v-model="test"
   placeholder-key="placeholder1"
diff --git a/demo/documentation/components/customAdd/index.entry b/demo/documentation/components/dynamicInput/index.entry
similarity index 100%
rename from demo/documentation/components/customAdd/index.entry
rename to demo/documentation/components/dynamicInput/index.entry
diff --git a/demo/documentation/components/customAdd/zhCN/basic.md b/demo/documentation/components/dynamicInput/zhCN/basic.md
similarity index 95%
rename from demo/documentation/components/customAdd/zhCN/basic.md
rename to demo/documentation/components/dynamicInput/zhCN/basic.md
index 1f548efdf..d7f835bbf 100644
--- a/demo/documentation/components/customAdd/zhCN/basic.md
+++ b/demo/documentation/components/dynamicInput/zhCN/basic.md
@@ -1,6 +1,6 @@
 # 基础用法
 ```html
-<n-custom-add
+<n-dynamic-input
   v-model="test"
   placeholder-key="placeholder1"
   placeholder-value="placeholder2"
diff --git a/demo/documentation/components/customAdd/zhCN/custom.md b/demo/documentation/components/dynamicInput/zhCN/custom.md
similarity index 95%
rename from demo/documentation/components/customAdd/zhCN/custom.md
rename to demo/documentation/components/dynamicInput/zhCN/custom.md
index dfbfa0e71..b2195ad17 100644
--- a/demo/documentation/components/customAdd/zhCN/custom.md
+++ b/demo/documentation/components/dynamicInput/zhCN/custom.md
@@ -1,6 +1,6 @@
 # 自定义
 ```html
-<n-custom-add
+<n-dynamic-input
   v-model="test"
   title="Add CheckBox"
   preset="custom"
@@ -22,7 +22,7 @@
       />
     </div>
   </template>
-</n-custom-add>
+</n-dynamic-input>
 <pre>
 {{  JSON.stringify(test,0,2) }}
 </pre>
diff --git a/demo/documentation/components/customAdd/zhCN/index.md b/demo/documentation/components/dynamicInput/zhCN/index.md
similarity index 100%
rename from demo/documentation/components/customAdd/zhCN/index.md
rename to demo/documentation/components/dynamicInput/zhCN/index.md
diff --git a/demo/documentation/components/customAdd/zhCN/pair.md b/demo/documentation/components/dynamicInput/zhCN/pair.md
similarity index 95%
rename from demo/documentation/components/customAdd/zhCN/pair.md
rename to demo/documentation/components/dynamicInput/zhCN/pair.md
index b2d4adfdb..0b897a136 100644
--- a/demo/documentation/components/customAdd/zhCN/pair.md
+++ b/demo/documentation/components/dynamicInput/zhCN/pair.md
@@ -1,6 +1,6 @@
 # 键值对
 ```html
-<n-custom-add
+<n-dynamic-input
   preset="pair"
   v-model="test"
   placeholder-key="placeholder1"
diff --git a/demo/documentation/components/form/enUS/customRule.md b/demo/documentation/components/form/enUS/customRule.md
index aa35463db..c4658f4b8 100644
--- a/demo/documentation/components/form/enUS/customRule.md
+++ b/demo/documentation/components/form/enUS/customRule.md
@@ -17,13 +17,13 @@ You can custom you valiation by setting custom trigger in rules.
     <n-input :disabled="!model.password" v-model="model.reenteredPassword" type="password"/>
   </n-form-item-row>
   <n-form-item-row label="Env" path="env" rule-path="null">
-    <n-custom-add
+    <n-dynamic-input
       v-model="model.env"
       preset="pair"
     />
   </n-form-item-row>
   <n-form-item-row label="group" path="group" rule-path="null">
-    <n-custom-add
+    <n-dynamic-input
       v-model="model.group"
       preset='custom'
     >
@@ -43,7 +43,7 @@ You can custom you valiation by setting custom trigger in rules.
           </n-form-item>
         </div>
       </template>
-    </n-custom-add>
+    </n-dynamic-input>
   </n-form-item-row>
   <n-row :gutter="[0, 24]">
     <n-col :span="24">
diff --git a/demo/documentation/components/form/zhCN/customRule.md b/demo/documentation/components/form/zhCN/customRule.md
index 1e8acda2c..24bd6306c 100644
--- a/demo/documentation/components/form/zhCN/customRule.md
+++ b/demo/documentation/components/form/zhCN/customRule.md
@@ -17,12 +17,12 @@
     <n-input :disabled="!model.password" v-model="model.reenteredPassword" type="password"/>
   </n-form-item-row>
    <n-form-item-row label="Env" path="env" rule-path="null">
-    <n-custom-add
+    <n-dynamic-input
       v-model="model.env"
     />
   </n-form-item-row>
   <n-form-item-row label="group" path="group" rule-path="null">
-    <n-custom-add
+    <n-dynamic-input
       v-model="model.group"
     >
       <template v-slot="slotProps">
@@ -41,7 +41,7 @@
           </n-form-item>
         </div>
       </template>
-    </n-custom-add>
+    </n-dynamic-input>
   </n-form-item-row>
   <n-row :gutter="[0, 24]">
     <n-col :span="24">
diff --git a/demo/init.js b/demo/init.js
index bf3a62db1..45c41e4ad 100644
--- a/demo/init.js
+++ b/demo/init.js
@@ -17,7 +17,7 @@ import nswitch from './documentation/components/switch'
 import input from './documentation/components/input'
 import select from './documentation/components/select'
 import cascader from './documentation/components/cascader'
-import customAdd from './documentation/components/customAdd'
+import dynamicInput from './documentation/components/dynamicInput'
 import modal from './documentation/components/modal'
 import message from './documentation/components/message'
 import tooltip from './documentation/components/tooltip'
@@ -165,7 +165,7 @@ const children = [
   { path: '/n-input', component: input },
   { path: '/n-select', component: select },
   { path: '/n-cascader', component: cascader },
-  { path: '/n-custom-add', component: customAdd },
+  { path: '/n-dynamic-input', component: dynamicInput },
   { path: '/n-modal', component: modal },
   { path: '/n-message', component: message },
   { path: '/n-tooltip', component: tooltip },
diff --git a/demo/loaders/NaiveUIDocLoader.js b/demo/loaders/NaiveUIDocLoader.js
index dcfa7bf6a..5870a1e44 100644
--- a/demo/loaders/NaiveUIDocLoader.js
+++ b/demo/loaders/NaiveUIDocLoader.js
@@ -1,7 +1,9 @@
 const convertMd2Doc = require('./convertMd2Doc')
+const path = require('path')
 
 module.exports = function (content) {
   const env = process.env.NODE_ENV
-  const url = this.resourcePath
-  return convertMd2Doc(content, env, url)
+  const projectPath = path.resolve(__dirname, '..', '..')
+  const relativeURL = this.resourcePath.replace(projectPath + '/', '')
+  return convertMd2Doc(content, env, relativeURL)
 }
diff --git a/demo/menuOptions.js b/demo/menuOptions.js
index 256e5cf1a..7d71de1af 100644
--- a/demo/menuOptions.js
+++ b/demo/menuOptions.js
@@ -196,10 +196,10 @@ export default function (locale, instance) {
             path: `/${instance.lang}/${instance.theme}/doc` + '/n-checkbox'
           },
           {
-            name: 'Custom Add',
-            title: '自定义增加',
-            titleExtra: 'Custom Add',
-            path: `/${instance.lang}/${instance.theme}/doc` + '/n-custom-add'
+            name: 'Dynamic Input',
+            title: '动态输入',
+            titleExtra: 'Dynamic Input',
+            path: `/${instance.lang}/${instance.theme}/doc` + '/n-dynamic-input'
           },
           {
             name: 'Date Picker',
@@ -674,8 +674,8 @@ export default function (locale, instance) {
             path: `/${instance.lang}/${instance.theme}/doc` + '/n-checkbox'
           },
           {
-            name: 'Custom Add',
-            path: `/${instance.lang}/${instance.theme}/doc` + '/n-custom-add'
+            name: 'Dynamic Input',
+            path: `/${instance.lang}/${instance.theme}/doc` + '/n-dynamic-input'
           },
           {
             name: 'Date Picker',
diff --git a/demo/utils/ComponentDemo.vue b/demo/utils/ComponentDemo.vue
index e6301bebe..c731f05cc 100644
--- a/demo/utils/ComponentDemo.vue
+++ b/demo/utils/ComponentDemo.vue
@@ -2,11 +2,13 @@
 {
   "zh-CN": {
     "show": "显示代码",
-    "hide": "收起代码"
+    "hide": "收起代码",
+    "editOnGithub": "在 Github 上编辑"
   },
   "en-US": {
     "show": "Show Code",
-    "hide": "Hide Code"
+    "hide": "Hide Code",
+    "editOnGithub": "Edit on Github"
   }
 }
 </i18n>
@@ -25,46 +27,47 @@
     </template>
 
     <template v-slot:header-extra>
-      <n-tooltip
-        :delay="300"
-        :placement="'top'"
-        :show-arrow="true"
-        :controller="controller"
-      >
-        <template v-slot:activator>
-          <a target="_blank" :href="gheUrl" style="margin-right:10px;">
+      <n-button-group size="tiny">
+        <n-tooltip
+          :delay="300"
+          :placement="'top'"
+          :show-arrow="true"
+        >
+          <template v-slot:activator>
             <n-button
-              size="tiny"
+              style="padding: 0 2px 0 8px"
               ghost
+              round
+              @click="handleEditOnGithubClick"
             >
               <template v-slot:icon>
-                <open-outline />
+                <create-outline />
               </template>
             </n-button>
-          </a>
-        </template>
-        {{ $t('ghe url') }}
-      </n-tooltip>
-      <n-tooltip
-        :delay="300"
-        :placement="'top'"
-        :show-arrow="true"
-        :controller="controller"
-      >
-        <template v-slot:activator>
-          <n-button
-            size="tiny"
-            ghost
-            circle
-            @click="toggleCodeDisplay"
-          >
-            <template v-slot:icon>
-              <md-code />
-            </template>
-          </n-button>
-        </template>
-        {{ !showCode ? $t('show') : $t('hide') }}
-      </n-tooltip>
+          </template>
+          {{ $t('editOnGithub') }}
+        </n-tooltip>
+        <n-tooltip
+          :delay="300"
+          :placement="'top'"
+          :show-arrow="true"
+          :controller="controller"
+        >
+          <template v-slot:activator>
+            <n-button
+              style="padding: 0 6px 0 4px"
+              ghost
+              round
+              @click="toggleCodeDisplay"
+            >
+              <template v-slot:icon>
+                <code-outline />
+              </template>
+            </n-button>
+          </template>
+          {{ !showCode ? $t('show') : $t('hide') }}
+        </n-tooltip>
+      </n-button-group>
     </template>
     <slot name="content" />
     <slot name="demo" />
@@ -77,14 +80,14 @@
 </template>
 
 <script>
-import mdCode from '../../src/_icons/md-code'
-import openOutline from '../../src/_icons/open-outline'
+import codeOutline from '../../src/_icons/code-outline'
+import createOutline from '../../src/_icons/create-outline'
 import { state } from '../store'
 
 export default {
   components: {
-    mdCode,
-    openOutline
+    codeOutline,
+    createOutline
   },
   inject: {
     NDocumentation: {
@@ -106,11 +109,9 @@ export default {
     mode () {
       return this.state.mode
     },
-    gheUrl () {
-      const resourcePath = this.NDocumentation.url
-      const reg = /demo.*/
-      const path = resourcePath.match(reg)
-      return 'https://***REMOVED***/tree/develop/' + path
+    url () {
+      const relativePath = this.NDocumentation.url
+      return 'https://***REMOVED***/tree/develop/' + relativePath
     }
   },
   watch: {
@@ -132,6 +133,9 @@ export default {
     this.init()
   },
   methods: {
+    handleEditOnGithubClick () {
+      window.open(this.url, '_blank')
+    },
     toggleCodeDisplay () {
       this.showCode = !this.showCode
     },
diff --git a/src/CustomAdd/index.js b/src/CustomAdd/index.js
deleted file mode 100644
index c07548594..000000000
--- a/src/CustomAdd/index.js
+++ /dev/null
@@ -1,9 +0,0 @@
-/* istanbul ignore file */
-import CustomAdd from './src/main.vue'
-
-CustomAdd.install = function (Vue) {
-  Vue.component(CustomAdd.name, CustomAdd)
-  Vue.component('NCustomAdd', CustomAdd)
-}
-
-export default CustomAdd
diff --git a/src/DynamicInput/index.js b/src/DynamicInput/index.js
new file mode 100644
index 000000000..763398e9b
--- /dev/null
+++ b/src/DynamicInput/index.js
@@ -0,0 +1,9 @@
+/* istanbul ignore file */
+import DynamicInput from './src/main.vue'
+
+DynamicInput.install = function (Vue) {
+  Vue.component(DynamicInput.name, DynamicInput)
+  Vue.component('NDynamicInput', DynamicInput)
+}
+
+export default DynamicInput
diff --git a/src/CustomAdd/src/input.vue b/src/DynamicInput/src/input.vue
similarity index 65%
rename from src/CustomAdd/src/input.vue
rename to src/DynamicInput/src/input.vue
index 64af3eb44..375e6fa19 100644
--- a/src/CustomAdd/src/input.vue
+++ b/src/DynamicInput/src/input.vue
@@ -1,19 +1,19 @@
 <template>
   <div
-    class="n-custom-add-pair"
+    class="n-dynamic-input-pair"
   >
-    <n-form-item v-if="NCustomAdd.NFormItem" :path="path" :rule-path="parentPath">
+    <n-form-item v-if="NDynamicInput.NFormItem" :path="path" :rule-path="parentPath">
       <n-input
         v-model="item"
-        class="n-custom-add-pair-input"
-        :placeholder="NCustomAdd.placeholder"
+        class="n-dynamic-input-pair-input"
+        :placeholder="NDynamicInput.placeholder"
       />
     </n-form-item>
     <n-input
       v-else
       v-model="item"
-      class="n-custom-add-pair-input"
-      :placeholder="NCustomAdd.placeholder"
+      class="n-dynamic-input-pair-input"
+      :placeholder="NDynamicInput.placeholder"
     />
   </div>
 </template>
@@ -21,9 +21,9 @@
 import asformitem from '../../_mixins/asformitem'
 
 export default {
-  name: 'NCustomAddInput',
+  name: 'NDynamicInputInput',
   inject: {
-    NCustomAdd: {
+    NDynamicInput: {
       default: []
     }
   },
diff --git a/src/CustomAdd/src/main.vue b/src/DynamicInput/src/main.vue
similarity index 88%
rename from src/CustomAdd/src/main.vue
rename to src/DynamicInput/src/main.vue
index 799e61ed9..699203f55 100644
--- a/src/CustomAdd/src/main.vue
+++ b/src/DynamicInput/src/main.vue
@@ -1,18 +1,18 @@
 <template>
-  <div class="n-custom-add">
+  <div class="n-dynamic-input">
     <div
       v-for="(item, index) in value"
       :key="index"
-      class="n-custom-add-item"
+      class="n-dynamic-input-item"
     >
-      <n-custom-add-input
+      <n-dynamic-input-input
         v-if="preset==='input'"
         :item="item"
         :index="index"
         :parent-path="NFormItem && NFormItem.path"
         :path="NFormItem && NFormItem.path + '[' + index + ']'"
       />
-      <n-custom-add-pair
+      <n-dynamic-input-pair
         v-else-if="preset==='pair'"
         :item="item"
         :index="index"
@@ -20,7 +20,7 @@
         :path="NFormItem && NFormItem.path + '[' + index + ']'"
       />
       <slot v-else :item="item" :index="index" />
-      <div class="n-custom-add-item__action">
+      <div class="n-dynamic-input-item__action">
         <n-button-group>
           <n-button
             circle
@@ -51,14 +51,14 @@ import NButtonGroup from '../../Button/src/ButtonGroup'
 import mdAdd from '../../_icons/md-add'
 import mdRemove from '../../_icons/md-remove'
 import asformitem from '../../_mixins/asformitem'
-import NCustomAddPair from './pair'
-import NCustomAddInput from './input'
+import NDynamicInputPair from './pair'
+import NDynamicInputInput from './input'
 
 export default {
-  name: 'NCustomAdd',
+  name: 'NDynamicInput',
   components: {
-    NCustomAddPair,
-    NCustomAddInput,
+    NDynamicInputPair,
+    NDynamicInputInput,
     NButtonGroup,
     NButton,
     mdAdd,
@@ -66,7 +66,7 @@ export default {
   },
   provide () {
     return {
-      NCustomAdd: this
+      NDynamicInput: this
     }
   },
   mixins: [asformitem({
diff --git a/src/CustomAdd/src/pair.vue b/src/DynamicInput/src/pair.vue
similarity index 55%
rename from src/CustomAdd/src/pair.vue
rename to src/DynamicInput/src/pair.vue
index 4a92182af..7ae3a92bc 100644
--- a/src/CustomAdd/src/pair.vue
+++ b/src/DynamicInput/src/pair.vue
@@ -1,32 +1,32 @@
 <template>
   <div
-    class="n-custom-add-pair"
+    class="n-dynamic-input-pair"
   >
-    <n-form-item v-if="NCustomAdd.NFormItem" :path="path + '.key'" :rule-path="parentPath + '.key'">
+    <n-form-item v-if="NDynamicInput.NFormItem" :path="path + '.key'" :rule-path="parentPath + '.key'">
       <n-input
         v-model="item.key"
-        class="n-custom-add-pair-input"
-        :placeholder="NCustomAdd.placeholderKey"
+        class="n-dynamic-input-pair-input"
+        :placeholder="NDynamicInput.placeholderKey"
       />
     </n-form-item>
     <n-input
       v-else
       v-model="item.key"
-      class="n-custom-add-pair-input"
-      :placeholder="NCustomAdd.placeholderKey"
+      class="n-dynamic-input-pair-input"
+      :placeholder="NDynamicInput.placeholderKey"
     />
-    <n-form-item v-if="NCustomAdd.NFormItem" :path="path +'.value'" :rule-path="parentPath + '.key'">
+    <n-form-item v-if="NDynamicInput.NFormItem" :path="path +'.value'" :rule-path="parentPath + '.key'">
       <n-input
         v-model="item.value"
-        class="n-custom-add-pair-input"
-        :placeholder="NCustomAdd.placeholderValue"
+        class="n-dynamic-input-pair-input"
+        :placeholder="NDynamicInput.placeholderValue"
       />
     </n-form-item>
     <n-input
       v-else
       v-model="item.value"
-      class="n-custom-add-pair-input"
-      :placeholder="NCustomAdd.placeholderValue"
+      class="n-dynamic-input-pair-input"
+      :placeholder="NDynamicInput.placeholderValue"
     />
   </div>
 </template>
@@ -34,9 +34,9 @@
 import asformitem from '../../_mixins/asformitem'
 
 export default {
-  name: 'NCustomAddPair',
+  name: 'NDynamicInputPair',
   inject: {
-    NCustomAdd: {
+    NDynamicInput: {
       default: []
     }
   },
diff --git a/src/index.js b/src/index.js
index 8546944af..9a145bac8 100644
--- a/src/index.js
+++ b/src/index.js
@@ -8,7 +8,7 @@ import RoundButton from './Button'
 import Switch from './Switch'
 import Select from './Select'
 import Cascader from './Cascader'
-import CustomAdd from './CustomAdd'
+import DynamicInput from './DynamicInput'
 import Modal from './Modal'
 import Input from './Input'
 import Message from './Message'
@@ -102,7 +102,7 @@ export default create({
     InputNumber,
     Radio,
     Cascader,
-    CustomAdd,
+    DynamicInput,
     Form,
     Tabs,
     TimePicker,
diff --git a/styles/CustomAdd.scss b/styles/DynamicInput.scss
similarity index 80%
rename from styles/CustomAdd.scss
rename to styles/DynamicInput.scss
index cee29962b..acaea8b8a 100644
--- a/styles/CustomAdd.scss
+++ b/styles/DynamicInput.scss
@@ -2,13 +2,13 @@
 
 @include themes-mixin {
   @include once {
-    @include b(custom-add) {
+    @include b(dynamic-input) {
       width: 100%;
       @include m(title) {
         display: block;
         margin: 0 0 8px;
       }
-      @include b(custom-add-item) {
+      @include b(dynamic-input-item) {
         margin-bottom: 10px;
         display: flex;
         @include e(content) {
@@ -28,10 +28,10 @@
           margin-bottom: 0;
         }
       }
-      @include b(custom-add-pair) {
+      @include b(dynamic-input-pair) {
         width: 100%;
         display: flex;
-        @include b(custom-add-item-input-container-input) {
+        @include b(dynamic-input-item-input-container-input) {
           display: inline-block;
           flex: 1;
         }
@@ -39,7 +39,7 @@
           padding-top: 0!important;
         }
       }
-      @include b(custom-add-pair-input){
+      @include b(dynamic-input-pair-input){
         &:first-child {
           margin-right: 13px;
         }
diff --git a/styles/index.scss b/styles/index.scss
index f1b684e9a..8eaed607a 100644
--- a/styles/index.scss
+++ b/styles/index.scss
@@ -9,7 +9,6 @@
 @import './BaseSelectMenu.scss';
 @import './BaseMenuMask.scss';
 @import './BaseTrackingRect.scss';
-
 @import "./Card.scss";
 @import "./Icon.scss";
 @import "./GradientText.scss";
@@ -20,7 +19,7 @@
 @import "./Input.scss";
 @import "./Select.scss";
 @import "./Cascader.scss";
-@import "./CustomAdd.scss";
+@import "./DynamicInput.scss";
 @import "./Message.scss";
 @import "./Tooltip.scss";
 @import "./Notification.scss";
diff --git a/styles/mixins/mixins.scss b/styles/mixins/mixins.scss
index ab48cce6e..eba02dfd8 100644
--- a/styles/mixins/mixins.scss
+++ b/styles/mixins/mixins.scss
@@ -86,7 +86,7 @@ $default-theme: 'light';
 
 @mixin themes-mixin() {
   $in-themes-mixin: true !global;
-  $theme: 'dark' !global;
+  $theme: 'light' !global;
   @include setup-light-theme();
   @content;
   $common-css-attrs-generated: true !global;