@opentiny/vue-docs 3.18.0 → 3.18.2

package/demos/pc/app/link/basic-usage-composition-api.vue

@@ -1,12 +1,16 @@
 <template>
   <div>
-    <tiny-link>默认链接</tiny-link>
+    <tiny-link @click="handleClick">默认链接</tiny-link>
     <tiny-link value="默认链接2"></tiny-link>
   </div>
 </template>
 
 <script setup>
 import { Link as TinyLink } from '@opentiny/vue'
+
+function handleClick() {
+  console.log('clicked')
+}
 </script>
 
 <style scoped>

package/demos/pc/app/link/basic-usage.spec.ts

@@ -10,4 +10,15 @@ test('基础用法', async ({ page }) => {
   await expect(link.nth(1)).toHaveText('默认链接2')
   await link.first().hover()
   await expect(link.first()).toHaveCSS('color', 'rgb(82, 110, 204)')
+
+  // 测试点击
+  const values = [] as string[]
+  page.on('console', async (msg) => {
+    for (const arg of msg.args()) {
+      values.push(await arg.jsonValue())
+    }
+  })
+  await link.first().click()
+
+  expect(values[0]).toBe('clicked')
 })

package/demos/pc/app/link/basic-usage.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <tiny-link>默认链接</tiny-link>
+    <tiny-link @click="handleClick">默认链接</tiny-link>
     <tiny-link value="默认链接2"></tiny-link>
   </div>
 </template>
@@ -11,6 +11,11 @@ import { Link } from '@opentiny/vue'
 export default {
   components: {
     TinyLink: Link
+  },
+  methods: {
+    handleClick() {
+      console.log('clicked')
+    }
   }
 }
 </script>

package/demos/pc/app/link/webdoc/link.js

@@ -9,8 +9,14 @@ export default {
         'en-US': 'Basic Usage'
       },
       desc: {
-        'zh-CN': '<p>通过 <code>value</code> 或者默认插槽设置链接显示内容。</p>',
-        'en-US': '<p>Set the link to display content via <code>value</code> or the default slot. </p></p>'
+        'zh-CN': `
+          通过 <code>value</code> 或者默认插槽设置链接显示内容。<br>
+          绑定 <code>click</code> 事件监听点击。 当禁用或配置 <code>href</code> 属性时， 不会触发<code>click</code>事件！
+        `,
+        'en-US': `
+          Set the link to display content via <code>value</code> or the default slot. 
+          Bind the click event to listen for clicks.The click event is not triggered when the href attribute is disabled or configured!
+          `
       },
       codeFiles: ['basic-usage.vue']
     },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentiny/vue-docs",
-  "version": "3.18.0",
+  "version": "3.18.2",
   "license": "MIT",
   "dependencies": {
     "@opentiny/vue-repl": "^1.1.2",
@@ -16,18 +16,18 @@
     "vue": "^3.4.31",
     "vue-i18n": "^9.1.10",
     "vue-router": "4.1.5",
+    "@opentiny/vue-design-smb": "~3.18.0",
+    "@opentiny/vue-design-saas": "~3.18.0",
     "@opentiny/vue-common": "~3.18.0",
-    "@opentiny/vue-directive": "~3.18.0",
     "@opentiny/vue-design-aurora": "~3.18.0",
+    "@opentiny/vue-directive": "~3.18.0",
     "@opentiny/vue": "~3.18.0",
     "@opentiny/vue-icon": "~3.18.0",
-    "@opentiny/vue-design-smb": "~3.18.0",
-    "@opentiny/vue-theme": "~3.18.0",
     "@opentiny/vue-icon-saas": "~3.18.0",
-    "@opentiny/vue-design-saas": "~3.18.0",
-    "@opentiny/vue-vite-import": "~1.2.0",
+    "@opentiny/vue-theme": "~3.18.0",
+    "@opentiny/vue-theme-mobile": "~3.18.0",
     "@opentiny/vue-theme-saas": "~3.18.0",
-    "@opentiny/vue-theme-mobile": "~3.18.0"
+    "@opentiny/vue-vite-import": "~1.2.0"
   },
   "devDependencies": {
     "@playwright/test": "~1.42.0",

package/src/main.js

@@ -9,8 +9,8 @@ import 'uno.css'
 // highlight默认样式
 import 'highlight.js/styles/default.css'
 
-// markdown样式引用的是github-markdown.css
-import 'github-markdown-css/github-markdown.css'
+// 只使用markdown的亮色主题
+import 'github-markdown-css/github-markdown-light.css'
 import './assets/index.less'
 import './style.css'
 

package/src/views/components/float-settings.vue

@@ -88,7 +88,7 @@
 
 <script>
 import { defineComponent, reactive, toRefs, onMounted, onUnmounted, watch, nextTick, ref } from 'vue'
-import { Tooltip, Radio, RadioGroup, Popover } from '@opentiny/vue'
+import { Tooltip, Radio, RadioGroup, Popover, Notify } from '@opentiny/vue'
 import { iconUpWard } from '@opentiny/vue-icon'
 import debounce from '@opentiny/vue-renderless/common/deps/debounce'
 import { i18nByKey, useApiMode, useTemplateMode } from '@/tools'
@@ -129,6 +129,17 @@ export default defineComponent({
       initBottomVal: null, // 初始底部偏移
       isSettingsAside: false // 是否贴边
     })
+    let isShowTip = false
+    const showTip = () => {
+      Notify({
+        type: 'info',
+        title: '请注意',
+        message: '主题切换成功，如有部分主题样式不生效，请尝试手动刷新页面即可',
+        position: 'top-right',
+        duration: 3000
+      })
+      isShowTip = true
+    }
 
     if (isPlus) {
       state.styleSettings = state.styleSettings.filter((item) => item.name !== 'apiMode')
@@ -164,6 +175,10 @@ export default defineComponent({
       themeItemClick(node) {
         const val = node?.value || 'tiny-smb-theme'
         changeTheme(val)
+
+        if (!isShowTip) {
+          showTip()
+        }
       }
     }