@opentiny/vue-docs 3.26.8 → 3.27.0

package/env/.env.saaspages

@@ -0,0 +1,9 @@
+# 1、声明一个变量
+VITE_CONTEXT=/tiny-vue-saas-web-doc/
+VITE_BUILD_TARGET='inner'
+VITE_TINY_THEME='saas'
+# 官网应用类型：pc / mobile / mobile-first
+VITE_APP_MODE='pc'
+
+VITE_APP_BUILD_BASE_URL='/tiny-vue-saas-web-doc/'
+VITE_PLAYGROUND_URL=/playground.html

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@opentiny/vue-docs",
   "type": "module",
-  "version": "3.26.8",
+  "version": "3.27.0",
   "license": "MIT",
   "dependencies": {
     "@docsearch/css": "^3.8.0",
@@ -27,24 +27,24 @@
     "vue-i18n": "~9.14.3",
     "vue-router": "4.1.5",
     "zod": "^3.24.4",
-    "@opentiny/utils": "~3.26.0",
-    "@opentiny/vue-common": "~3.26.0",
-    "@opentiny/vue": "~3.26.0",
-    "@opentiny/vue-design-aurora": "~3.26.0",
-    "@opentiny/vue-design-saas": "~3.26.0",
-    "@opentiny/vue-design-smb": "~3.26.0",
-    "@opentiny/vue-flowchart": "~3.26.0",
-    "@opentiny/vue-directive": "~3.26.0",
-    "@opentiny/vue-hooks": "~3.26.0",
-    "@opentiny/vue-icon": "~3.26.0",
-    "@opentiny/vue-huicharts": "~3.26.0",
-    "@opentiny/vue-icon-multicolor": "~3.26.0",
-    "@opentiny/vue-locale": "~3.26.0",
-    "@opentiny/vue-modal": "~3.26.0",
-    "@opentiny/vue-icon-saas": "~3.26.0",
-    "@opentiny/vue-renderless": "~3.26.0",
-    "@opentiny/vue-theme": "~3.26.0",
-    "@opentiny/vue-theme-saas": "~3.26.2"
+    "@opentiny/utils": "~3.27.0",
+    "@opentiny/vue-common": "~3.27.0",
+    "@opentiny/vue": "~3.27.0",
+    "@opentiny/vue-design-aurora": "~3.27.0",
+    "@opentiny/vue-design-saas": "~3.27.0",
+    "@opentiny/vue-design-smb": "~3.27.0",
+    "@opentiny/vue-directive": "~3.27.0",
+    "@opentiny/vue-flowchart": "~3.27.0",
+    "@opentiny/vue-hooks": "~3.27.0",
+    "@opentiny/vue-huicharts": "~3.27.0",
+    "@opentiny/vue-icon-multicolor": "~3.27.0",
+    "@opentiny/vue-locale": "~3.27.0",
+    "@opentiny/vue-icon-saas": "~3.27.0",
+    "@opentiny/vue-icon": "~3.27.0",
+    "@opentiny/vue-modal": "~3.27.0",
+    "@opentiny/vue-renderless": "~3.27.0",
+    "@opentiny/vue-theme": "~3.27.0",
+    "@opentiny/vue-theme-saas": "~3.27.0"
   },
   "devDependencies": {
     "@playwright/test": "~1.49.0",
@@ -99,6 +99,7 @@
     "build:saas:open": "vite build --mode saasopen",
     "build:saas:prod": "vite build --mode saasprod",
     "build": "vite build --mode pages && cp cp-component-md.sh ./dist",
+    "build:saas": "vite build --mode saaspages && cp cp-component-md.sh ./dist",
     "build:mobile:page": "vite build --mode mobilepages && cp cp-component-md.sh ./dist",
     "build:visualizer": "vite build --mode visualizer",
     "build:open": "vite build --mode open",

package/playground/App.vue

@@ -11,7 +11,7 @@ import logoUrl from './assets/opentiny-logo.svg?url'
 import GitHub from './icons/Github.vue'
 import Share from './icons/Share.vue'
 
-const VERSION = 'tiny-vue-version-3.26'
+const VERSION = 'tiny-vue-version-3.27'
 const NOTIFY_KEY = 'tiny-vue-playground-notify'
 const LAYOUT = 'playground-layout'
 const LAYOUT_REVERSE = 'playground-layout-reverse'
@@ -23,7 +23,7 @@ const isMobileFirst = tinyMode === 'mobile-first'
 const isSaas = tinyTheme === 'saas'
 const isPreview = searchObj.get('openMode') === 'preview' // 是否多端弹窗预览
 
-const versions = ['3.26', '3.25', '3.24']
+const versions = ['3.27', '3.26', '3.25']
 const getVersion = () => {
   if (isPreview) {
     return versions[0]

package/src/components/anchor.vue

@@ -1,17 +1,16 @@
 <template>
-  <div v-if="links.length" class="cmp-page-anchor catalog">
-    <tiny-anchor
-      id="anchor"
-      :tiny_mode="isSaas ? 'pc' : 'mobile-first'"
-      :offset-top="56"
-      :links="links"
-      :is-affix="props.anchorAffix"
-      :type="isSaas ? 'line' : 'dot'"
-      container-id="#doc-layout-scroller"
-      @link-click="handleAnchorClick"
-    >
-    </tiny-anchor>
-  </div>
+  <tiny-anchor
+    id="anchor"
+    v-if="links.length"
+    :tiny_mode="isSaas ? 'pc' : 'mobile-first'"
+    :offset-top="56"
+    :links="links"
+    :is-affix="props.anchorAffix"
+    :type="isSaas ? 'line' : 'dot'"
+    container-id="#doc-layout-scroller"
+    @link-click="handleAnchorClick"
+  >
+  </tiny-anchor>
 </template>
 
 <script setup lang="ts">
@@ -24,15 +23,15 @@ const props = defineProps({ anchorAffix: {}, currentJson: {}, activeTab: {}, lan
 const emit = defineEmits(['link-click'])
 
 // 实例锚点
-const demoAnchorLinks = computed(() => {
-  const links =
-    props.currentJson?.demos?.map((demo) => ({
+const demoAnchorLinks = computed(() =>
+  (props.currentJson?.demos || [])
+    .filter((demo) => (isSaas ? !demo.hideSaas : true))
+    .map((demo) => ({
       key: demo.demoId,
       title: demo.name[props.langKey],
       link: `#${demo.demoId}`
-    })) || []
-  return links
-})
+    }))
+)
 
 // 组件API锚点
 const apiAnchorLinks = computed(() => {
@@ -68,56 +67,4 @@ const handleAnchorClick = (...args) => {
 }
 </script>
 
-<style scoped lang="less">
-.cmp-page-anchor {
-  :deep(.tiny-anchor__affix) {
-    top: unset !important;
-    overflow-y: auto;
-    overflow-x: hidden;
-    max-height: calc(100vh - 300px);
-  }
-
-  :deep(.tiny-anchor-link) {
-    font-size: 12px;
-
-    a {
-      display: block;
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-    }
-  }
-}
-
-.catalog {
-  flex: none;
-  width: 200px;
-  height: calc(100vh - 280px);
-  padding-top: 16px;
-  overflow: hidden;
-
-  .tiny-anchor__dot {
-    max-height: calc(100vh - 300px);
-    width: 200px;
-
-    :deep(.tiny-anchor) {
-      --ti-anchor-width: auto;
-      background-color: transparent;
-    }
-  }
-}
-
-.catalog:hover {
-  overflow-y: auto;
-}
-
-.catalog::-webkit-scrollbar {
-  width: 10px;
-  background-color: #f5f5f5;
-}
-
-.catalog::-webkit-scrollbar-thumb {
-  border-radius: 10px;
-  background-color: #c1c1c1;
-}
-</style>
+<style scoped lang="less"></style>

package/src/views/components-doc/common.vue

@@ -75,16 +75,18 @@
         </div>
 
         <!-- demo与api目录锚点 -->
-        <aside-anchor
-          v-if="state.activeTab === 'demos' || state.activeTab === 'api'"
-          :active-tab="state.activeTab"
-          :current-json="state.currJson"
-          :anchor-affix="state.anchorAffix"
-          :api-types="state.currApiTypes"
-          :lang-key="state.langKey"
-          :key="anchorRefreshKey"
-          @link-click="handleAnchorClick"
-        ></aside-anchor>
+        <div class="cmp-page-anchor catalog">
+          <aside-anchor
+            v-if="state.activeTab === 'demos' || state.activeTab === 'api'"
+            :active-tab="state.activeTab"
+            :current-json="state.currJson"
+            :anchor-affix="state.anchorAffix"
+            :api-types="state.currApiTypes"
+            :lang-key="state.langKey"
+            :key="anchorRefreshKey"
+            @link-click="handleAnchorClick"
+          ></aside-anchor>
+        </div>
       </div>
 
       <div v-if="state.currJson.owner" class="ti-abs ti-right24 ti-top24" @click="copyText(state.currJson.owner)">
@@ -112,6 +114,7 @@ import DesignToken from '../../components/design-token.vue'
 import McpDocs from '../../components/mcp-docs.vue'
 import useTasksFinish from '../../composable/useTasksFinish'
 import list from '@opentiny/vue-theme/token'
+import { isSaas } from '../../const'
 import { getTinyVueMcpConfig } from '@opentiny/tiny-vue-mcp'
 import { camelize, capitalize } from '@vue/shared'
 
@@ -205,7 +208,7 @@ const parseApiData = () => {
     for (const apiType of Object.keys(apiGroup)) {
       if (Array.isArray(apiGroup[apiType]) && apiGroup[apiType].length) {
         const apiArr = apiGroup[apiType].map((i) => {
-          const { name, type, defaultValue, desc, demoId, typeAnchorName, linkTo, meta, versionTipOption } = i
+          const { name, type, defaultValue, desc, demoId, typeAnchorName, linkTo, meta, versionTipOption, hideSaas } = i
           const item = {
             name,
             type,
@@ -215,7 +218,8 @@ const parseApiData = () => {
             meta,
             versionTipOption,
             typeAnchorName: '',
-            linkTo
+            linkTo,
+            hideSaas
           }
           if (typeAnchorName) {
             item.typeAnchorName = `${typeAnchorName?.includes('#') ? '' : '#'}${typeAnchorName}`
@@ -231,6 +235,15 @@ const parseApiData = () => {
 
     tableData[apiGroup.name] = apiDisplay
   }
+
+  // 当环境变量为tiny-vue-saas时
+  if (isSaas) {
+    for (const group of Object.keys(tableData)) {
+      for (const apiType of Object.keys(tableData[group])) {
+        tableData[group][apiType] = tableData[group][apiType].filter((item) => !item.hideSaas)
+      }
+    }
+  }
   state.tableData = tableData
 }
 
@@ -526,6 +539,57 @@ defineExpose({ loadPage })
       overflow: visible;
     }
   }
+  .cmp-page-anchor {
+    :deep(.tiny-anchor__affix) {
+      top: unset !important;
+      overflow-y: auto;
+      overflow-x: hidden;
+      max-height: calc(100vh - 300px);
+    }
+
+    :deep(.tiny-anchor-link) {
+      font-size: 12px;
+
+      a {
+        display: block;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+    }
+  }
+
+  .catalog {
+    flex: none;
+    width: 200px;
+    height: calc(100vh - 280px);
+    padding-top: 16px;
+    overflow: hidden;
+
+    .tiny-anchor__dot {
+      max-height: calc(100vh - 300px);
+      width: 200px;
+
+      :deep(.tiny-anchor) {
+        --ti-anchor-width: auto;
+        background-color: transparent;
+      }
+    }
+  }
+
+  .catalog:hover {
+    overflow-y: auto;
+  }
+
+  .catalog::-webkit-scrollbar {
+    width: 10px;
+    background-color: #f5f5f5;
+  }
+
+  .catalog::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    background-color: #c1c1c1;
+  }
 }
 
 .one-demo-col2 {