Merge pull request #422 from ielgnaw/vue2.5

feat: merge from 2.5.7 && bump to 2.4.15-beta.22
TencentBlueKing · Jul 26, 2023 · f45b394 · f45b394
2 parents a833bda + 3a2195b
commit f45b394
Show file tree

Hide file tree

Showing 102 changed files with 6,465 additions and 3,773 deletions.
diff --git a/build/markdown-it-github-link.js b/build/markdown-it-github-link.js
@@ -0,0 +1,113 @@
+/*
+ * Tencent is pleased to support the open source community by making
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) available.
+ *
+ * Copyright (C) 2021 THL A29 Limited, a Tencent company.  All rights reserved.
+ *
+ * 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition) is licensed under the MIT License.
+ *
+ * License for 蓝鲸智云PaaS平台社区版 (BlueKing PaaS Community Edition):
+ *
+ * ---------------------------------------------------
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated
+ * documentation files (the "Software"), to deal in the Software without restriction, including without limitation
+ * the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and
+ * to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all copies or substantial portions of
+ * the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO
+ * THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
+ * CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+*/
+
+/**
+ * @file markdown-it-github-link plugin
+ *
+ * Copyright © 2012-2019 Tencent BlueKing. All Rights Reserved. 蓝鲸智云 版权所有
+ */
+
+const exampleRouteConfig = require('../example/components.config')
+
+const kebabCase = string => string
+  .replace(/([a-z])([A-Z])/g, '$1-$2')
+  .replace(/[\s_]+/g, '-')
+  .toLowerCase()
+
+function getTokensText (tokens) {
+  return tokens
+    .filter(t => ['text', 'code_inline'].includes(t.type))
+    .map(t => t.content)
+    .join('')
+}
+
+function findRouter (name) {
+  let ret = null
+  const groupLen = exampleRouteConfig.groups.length
+  for (let i = 0; i < groupLen; i++) {
+    const group = exampleRouteConfig.groups[i]
+    const componentLen = group.components.length
+    for (let j = 0; j < componentLen; j++) {
+      const component = group.components[j]
+      if (component.name === name) {
+        ret = component
+        break
+      }
+    }
+  }
+  return ret
+}
+
+module.exports = function replace (md, opts) {
+  md.core.ruler.push('github-link', state => {
+    const tokens = state.tokens
+    for (let id = 0; id < tokens.length; id++) {
+      const token = tokens[id]
+      if (token.type !== 'heading_open') {
+        continue
+      }
+      if (token.tag !== 'h2') {
+        continue
+      }
+      const space = () => Object.assign(new state.Token('text', '', 0), { content: ' ' })
+      const content = getTokensText(tokens[id + 1].children)
+
+      const urlPrefix = 'https://github.com/TencentBlueKing/bkui-vue2/blob/staging/example/components'
+
+      const linkTokens = [
+        Object.assign(new state.Token('link_open', 'a', 1), {
+          attrs: [
+            ['href', `${urlPrefix}/${kebabCase(findRouter(content).id)}/readme.md`],
+            ['target', '_blank'],
+            ['style', 'color: #1f2f3d;']
+          ]
+        }),
+        Object.assign(new state.Token('svg_open', 'svg', 1), {
+          attrs: [
+            ['v-bk-tooltips.right', '"去 Github 编辑"'],
+            ['preserveAspectRatio', 'xMidYMid meet'],
+            ['class', 'github-link'],
+            ['viewBox', '0 0 24 24'],
+            ['width', ' 24px'],
+            ['height', '24px']
+          ]
+        }),
+        Object.assign(new state.Token('path_open', 'path', 1), {
+          attrs: [
+            ['fill', 'currentColor'],
+            ['d', 'M12 2C6.475 2 2 6.475 2 12a9.994 9.994 0 0 0 6.838 9.488c.5.087.687-.213.687-.476c0-.237-.013-1.024-.013-1.862c-2.512.463-3.162-.612-3.362-1.175c-.113-.288-.6-1.175-1.025-1.413c-.35-.187-.85-.65-.013-.662c.788-.013 1.35.725 1.538 1.025c.9 1.512 2.338 1.087 2.912.825c.088-.65.35-1.087.638-1.337c-2.225-.25-4.55-1.113-4.55-4.938c0-1.088.387-1.987 1.025-2.688c-.1-.25-.45-1.275.1-2.65c0 0 .837-.262 2.75 1.026a9.28 9.28 0 0 1 2.5-.338c.85 0 1.7.112 2.5.337c1.912-1.3 2.75-1.024 2.75-1.024c.55 1.375.2 2.4.1 2.65c.637.7 1.025 1.587 1.025 2.687c0 3.838-2.337 4.688-4.562 4.938c.362.312.675.912.675 1.85c0 1.337-.013 2.412-.013 2.75c0 .262.188.574.688.474A10.016 10.016 0 0 0 22 12c0-5.525-4.475-10-10-10z']
+          ]
+        }),
+        new state.Token('path_close', 'path', -1),
+        new state.Token('svg_close', 'svg', -1),
+        new state.Token('link_close', 'a', -1)
+      ]
+
+      linkTokens['push'](space())
+      state.tokens[id + 1].children['push'](...linkTokens)
+    }
+  })
+}
diff --git a/build/md-loader-option.js b/build/md-loader-option.js
@@ -43,6 +43,7 @@ const { slugify } = require('transliteration')
 const { strip } = require('./strip-tags')
 const { convert } = require('./util')
 const markdownItReplace = require('./markdown-it-replace')
+const markdownItGithubLink = require('./markdown-it-github-link')
 const markdownItHighlightjs = require('./md-highlight')
 
 const replaceLink = (link, env) => {
@@ -85,6 +86,7 @@ module.exports = {
   preventExtract: true,
   replaceLink,
   use: [
+    [markdownItGithubLink],
     [markdownItReplace, {
       replaceStr: 'bk-magic-vue'
     }],
@@ -166,10 +168,10 @@ module.exports = {
             ).replace(/(<[^>]*)=""(?=.*>)/g, '$1')
 
             return ``
-                            + `<code-block class="demo-box">`
-                            + `<div class="source" slot="source">${html}</div>`
-                            + descriptionHTML
-                            + `<div class="highlight" slot="highlight">`
+              + `<code-block class="demo-box">`
+              + `<div class="source" slot="source">${html}</div>`
+              + descriptionHTML
+              + `<div class="highlight" slot="highlight">`
           }
           return '</div></code-block>\n'
         }

diff --git a/example/App.vue b/example/App.vue
@@ -29,12 +29,12 @@
 <template>
   <div id="app">
     <app-header
-      :root-domain="'tencent.com'"
-      :login-url="'https://login.bk.tencent.com'"
-      :avatar-host="'https://q1.qlogo.cn'"
-      :less-code-url="'https://github.com/TencentBlueKing/bk-lesscode/blob/master/readme.md'"
-      :design-url="'https://bkdesign.bk.tencent.com/'"
-      :region="'tencent'">
+      root-domain="tencent.com"
+      login-url="https://login.bk.tencent.com"
+      avatar-host="https://q1.qlogo.cn"
+      less-code-url="https://github.com/TencentBlueKing/bk-lesscode/blob/master/readme.md"
+      design-url="https://bkdesign.bk.tencent.com"
+      region="tencent">
     </app-header>
     <div class="app-container">
       <div class="app-side-nav">

diff --git a/example/components.config.js b/example/components.config.js
@@ -30,7 +30,7 @@
  * Copyright © 2012-2019 Tencent BlueKing. All Rights Reserved. 蓝鲸智云 版权所有
  */
 
-export default {
+module.exports = {
   // 文档页面分组数据，groupId 为分组标题，components 为当前组内的组件
   groups: [
     {
@@ -62,7 +62,7 @@ export default {
         {
           id: 'bkui',
           name: '蓝鲸前端开发脚手架',
-          extraLink: 'https://bk.tencent.com/docs/document/5.1/19/583'
+          extraLink: 'https://bk.tencent.com/docs/document/7.0/250/46110'
         }
       ]
     },
@@ -91,7 +91,7 @@ export default {
         },
         {
           id: 'transition',
-          name: 'Transition 过度动画'
+          name: 'Transition 内置动画'
         }
       ]
     },
@@ -189,16 +189,16 @@ export default {
           name: 'TimePicker 时间选择器'
         },
         {
-          id: 'tag',
+          id: 'tagInput',
           name: 'TagInput 标签输入框'
         },
         {
           id: 'upload',
           name: 'Upload 文件上传'
         },
         {
-          'id': 'searchselect',
-          'name': 'SearchSelect 查询选择器'
+          id: 'searchSelect',
+          name: 'Search 查询搜索'
         },
         {
           id: 'slider',
@@ -213,7 +213,7 @@ export default {
           name: 'Rate 评分'
         },
         {
-          id: 'componseFormItem',
+          id: 'composeFormItem',
           name: 'ComposeFormItem 表单项组合'
         },
         {
@@ -247,7 +247,7 @@ export default {
         },
         {
           id: 'swiper',
-          name: 'Swiper 轮播'
+          name: 'Swiper 轮播图'
         },
         {
           id: 'pagination',
@@ -278,7 +278,7 @@ export default {
           name: 'Table 表格'
         },
         {
-          id: 'tags',
+          id: 'tag',
           name: 'Tag 标签'
         },
         {
@@ -324,7 +324,7 @@ export default {
         },
         {
           id: 'tooltips',
-          name: 'Tooltips 工具提示'
+          name: 'Tooltips 工具提示（指令）'
         },
         {
           id: 'popover',
@@ -339,7 +339,7 @@ export default {
           name: 'Dialog 对话框'
         },
         {
-          id: 'sideSlider',
+          id: 'sideslider',
           name: 'Sideslider 侧栏'
         },
         {

diff --git a/example/components/affix/readme.md b/example/components/affix/readme.md
@@ -1,20 +1,20 @@
 <script>
-    import { bkAffix, bkButton } from '@'
-
-    export default {
-        components: {
-            bkAffix,
-            bkButton
-        },
-        methods: {
-            change(status) {
-                this.$bkMessage({
-                    message: '当前状态' + status,
-                    offsetY: 80
-                })
-            }
-        }
+  import { bkAffix, bkButton } from '@'
+
+  export default {
+    components: {
+      bkAffix,
+      bkButton
+    },
+    methods: {
+      change(status) {
+        this.$bkMessage({
+          message: '当前状态' + status,
+          offsetY: 80
+        })
+      }
     }
+  }
 </script>
 <style>
     #affix-demo.scrollable-container {

diff --git a/example/components/button/example.vue b/example/components/button/example.vue
@@ -124,6 +124,37 @@
         user
       </bk-button>
     </div>
+    <div class="example-item">
+      <bk-button theme="default" title="loading 按钮" :loading="true" :outline="true">
+        loading 按钮
+      </bk-button>
+      <div style="height: 30px" />
+      <bk-button theme="primary" title="loading 按钮" :loading="true" :outline="true">
+        loading 按钮
+      </bk-button>
+      <div style="height: 30px" />
+      <bk-button theme="success" title="loading 按钮" :loading="true" :outline="true">
+        loading 按钮
+      </bk-button>
+      <div style="height: 30px" />
+      <bk-button theme="warning" title="loading 按钮" :loading="true" :outline="true">
+        loading 按钮
+      </bk-button>
+      <div style="height: 30px" />
+      <bk-button theme="danger" title="loading 按钮" :loading="true" :outline="true">
+        loading 按钮
+      </bk-button>
+      <div style="height: 30px" />
+      <bk-button theme="primary" title="loading 按钮" :hover-theme="'warning'" :loading="true">
+        111
+      </bk-button>
+      <bk-button theme="primary" title="loading 按钮" :loading="true">
+        222
+      </bk-button>
+      <bk-button theme="primary" title="loading 按钮">
+        333
+      </bk-button>
+    </div>
   </section>
 </template>
 

diff --git a/example/components/button/readme.md b/example/components/button/readme.md
@@ -315,6 +315,9 @@
     <bk-button theme="primary" title="反色按钮" :outline="true">
         反色按钮
     </bk-button>
+    <bk-button theme="primary" title="反色按钮" :outline="true" :loading="true">
+        反色按钮
+    </bk-button>
 </template>
 <script>
     import { bkButton } from '{{BASE_LIB_NAME}}'