@opentiny/vue-docs 2.2.3 → 2.2.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/demos/pc/app/anchor/change.spec.ts +1 -2
  2. package/demos/pc/app/anchor/is-affix.spec.ts +4 -3
  3. package/demos/pc/app/anchor/set-container.spec.ts +7 -7
  4. package/demos/pc/app/anchor/webdoc/anchor.js +17 -16
  5. package/demos/pc/app/button/basic-usage-composition-api.vue +1 -1
  6. package/demos/pc/app/button/basic-usage.vue +1 -1
  7. package/demos/pc/app/button/dynamic-disabled-composition-api.vue +0 -1
  8. package/demos/pc/app/button/dynamic-disabled.spec.js +3 -0
  9. package/demos/pc/app/button/dynamic-disabled.vue +0 -1
  10. package/demos/pc/app/button/icon-composition-api.vue +2 -1
  11. package/demos/pc/app/button/icon.vue +2 -1
  12. package/demos/pc/app/grid/data-source/static-data-composition-api.vue +1 -1
  13. package/demos/pc/app/grid/expand/expand-config-composition-api.vue +1 -1
  14. package/demos/pc/app/grid/filter/simple-date-filter.spec.ts +2 -20
  15. package/demos/pc/app/grid/operation-column/selection-config-composition-api.vue +1 -1
  16. package/demos/pc/app/grid/operation-column/selection-config.vue +2 -3
  17. package/demos/pc/app/grid/slot/editor-slot-composition-api.vue +1 -1
  18. package/demos/pc/app/grid/slot/header-slot-composition-api.vue +4 -1
  19. package/demos/pc/app/grid/slot/header-slot.vue +2 -1
  20. package/demos/pc/app/icon/basic-usage.spec.js +8 -1
  21. package/demos/pc/app/icon/iconGroups.js +195 -195
  22. package/demos/pc/app/icon/list.spec.js +10 -5
  23. package/demos/pc/app/icon/show-title.spec.ts +8 -0
  24. package/demos/pc/app/layout/gutter-composition-api.vue +11 -0
  25. package/demos/pc/app/layout/gutter.spec.ts +3 -0
  26. package/demos/pc/app/layout/gutter.vue +11 -0
  27. package/demos/pc/app/layout/webdoc/layout.js +14 -3
  28. package/demos/pc/app/select/copy-multi.spec.ts +15 -6
  29. package/demos/pc/app/select/is-drop-inherit-width.spec.ts +2 -3
  30. package/demos/pc/app/select/nest-grid-composition-api.vue +3 -1
  31. package/demos/pc/app/select/optimization.spec.ts +1 -0
  32. package/demos/pc/app/tag/closable.spec.ts +1 -1
  33. package/demos/pc/app/tag/color3.spec.ts +1 -1
  34. package/demos/pc/app/tag/content.spec.ts +2 -2
  35. package/demos/pc/app/tag/create.spec.ts +3 -3
  36. package/demos/pc/app/tag/disabled.spec.ts +1 -1
  37. package/demos/pc/app/tag/effect.spec.ts +4 -3
  38. package/demos/pc/app/wizard/btn-events-composition-api.vue +5 -5
  39. package/demos/pc/app/wizard/btn-events.spec.ts +63 -0
  40. package/demos/pc/app/wizard/btn-events.vue +5 -5
  41. package/demos/pc/app/wizard/page-guide.spec.ts +6 -6
  42. package/demos/pc/app/wizard/slot-step-button.spec.ts +1 -1
  43. package/demos/pc/app/wizard/time-line-flow.spec.ts +5 -5
  44. package/demos/pc/menus.js +1 -1
  45. package/demos/pc/webdoc/changelog.md +522 -305
  46. package/demos/pc/webdoc/installation-en.md +11 -6
  47. package/demos/pc/webdoc/installation.md +14 -8
  48. package/package.json +7 -7
  49. package/playground/App.vue +2 -2
  50. package/src/App.vue +2 -0
  51. package/src/tools/useBulletin.jsx +43 -0
  52. package/src/views/components/components.vue +12 -10
package/demos/pc/webdoc/installation-en.md CHANGED
@@ -47,9 +47,14 @@ export default defineConfig({
47
47
  })
48
48
  ```
49
49
 
50
+ <div class="tip custom-block">
51
+ <br>
52
+ <p> To avoid the uncertainty associated with monthly (minor) upgrades of <code> @opentiny/vue </code>, it is recommended to use ~ before relying on the version number of the package in <code> package.json </code> in your project.
53
+ For example, <code>"@opentiny/vue": "~3.12.0</code>. </p>
54
+ </div>
50
55
  ### Import through CDN
51
56
 
52
- In order to experience TinyVue components faster, you can also import TinyVue directly into the HTML page through CDN.
57
+ In order to experience TinyVue components faster, you can also import TinyVue directly into the HTML page through CDN,you are advised to write two valid version numbers as follows.
53
58
 
54
59
  ```html
55
60
  <head>
@@ -57,11 +62,11 @@ In order to experience TinyVue components faster, you can also import TinyVue di
57
62
  <script type="importmap">
58
63
  {
59
64
  "imports": {
60
- "vue": "https://unpkg.com/vue@3.2.45/dist/vue.esm-browser.js",
61
- "@opentiny/vue": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue.mjs",
62
- "@opentiny/vue-common": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue-common.mjs",
63
- "@opentiny/vue-icon": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue-icon.mjs",
64
- "@opentiny/vue-locale": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue-locale.mjs"
65
+ "vue": "https://unpkg.com/vue@3.3/dist/vue.esm-browser.js",
66
+ "@opentiny/vue": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue.mjs",
67
+ "@opentiny/vue-common": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue-common.mjs",
68
+ "@opentiny/vue-icon": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue-icon.mjs",
69
+ "@opentiny/vue-locale": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue-locale.mjs"
65
70
  }
66
71
  }
67
72
  </script>
package/demos/pc/webdoc/installation.md CHANGED
@@ -9,9 +9,9 @@
9
9
  | Vue2.x | @opentiny/vue@2.x |
10
10
  | Vue3.x | @opentiny/vue@3.x |
11
11
 
12
- **Vue2工程说明**
12
+ **Vue2 工程说明**
13
13
 
14
- 长期以来，TinyVue 都是只支持 Vue 2.6.14 版本。 从 TinyVue 2.11.0 开始，也支持 Vue 2.7+的工程了，请确保你安装了正确的Vue 2.x的依赖。
14
+ 长期以来，TinyVue 都是只支持 Vue 2.6.14 版本。 从 TinyVue 2.11.0 开始，也支持 Vue 2.7+的工程了，请确保你安装了正确的 Vue 2.x 的依赖。
15
15
 
16
16
  ### 全新项目配置
17
17
 
@@ -47,9 +47,15 @@ export default defineConfig({
47
47
  })
48
48
  ```
49
49
 
50
+ <div class="tip custom-block">
51
+ <br>
52
+ <p>为了避免<code> @opentiny/vue </code> 的月度版本(minor)升级带来的不确定因素，因此推荐在您的工程中的<code> package.json </code> 中依赖包的版本号前使用 ~，
53
+ 比如 <code>"@opentiny/vue": "~3.12.0</code>。</p>
54
+ </div>
55
+
50
56
  ### 通过 CDN 方式引入
51
57
 
52
- 为了更快地体验 TinyVue 的组件，你也可以通过 CDN 方式直接在 HTML 页面中引入 TinyVue。
58
+ 为了更快地体验 TinyVue 的组件，你也可以通过 CDN 方式直接在 HTML 页面中引入 TinyVue, 建议版本号写 2 个有效版本数字即可，具体配置如下:
53
59
 
54
60
  ```html
55
61
  <head>
@@ -57,11 +63,11 @@ export default defineConfig({
57
63
  <script type="importmap">
58
64
  {
59
65
  "imports": {
60
- "vue": "https://unpkg.com/vue@3.2.45/dist/vue.esm-browser.js",
61
- "@opentiny/vue": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue.mjs",
62
- "@opentiny/vue-common": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue-common.mjs",
63
- "@opentiny/vue-icon": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue-icon.mjs",
64
- "@opentiny/vue-locale": "https://unpkg.com/@opentiny/vue@3.9.1/runtime/tiny-vue-locale.mjs"
66
+ "vue": "https://unpkg.com/vue@3.3/dist/vue.esm-browser.js",
67
+ "@opentiny/vue": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue.mjs",
68
+ "@opentiny/vue-common": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue-common.mjs",
69
+ "@opentiny/vue-icon": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue-icon.mjs",
70
+ "@opentiny/vue-locale": "https://unpkg.com/@opentiny/vue@3.12/runtime/tiny-vue-locale.mjs"
65
71
  }
66
72
  }
67
73
  </script>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opentiny/vue-docs",
3
- "version": "2.2.3",
3
+ "version": "2.2.5",
4
4
  "dependencies": {
5
5
  "@unocss/reset": "0.38.2",
6
6
  "@vue/repl": "^2.5.5",
@@ -17,15 +17,15 @@
17
17
  "sortablejs": "1.15.0",
18
18
  "@opentiny/vue-repl": "^1.1.0",
19
19
  "@opentiny/vue": "~3.12.0",
20
- "@opentiny/vue-icon": "~3.12.0",
20
+ "@opentiny/vue-theme-mobile": "~3.12.0",
21
21
  "@opentiny/vue-common": "~3.12.0",
22
- "@opentiny/vue-design-aurora": "~3.12.0",
22
+ "@opentiny/vue-icon": "~3.12.0",
23
23
  "@opentiny/vue-design-smb": "~3.12.0",
24
- "@opentiny/vue-theme-mobile": "~3.12.0",
25
- "@opentiny/vue-theme": "~3.12.0",
26
- "@opentiny/vue-vite-import": "~1.1.5",
24
+ "@opentiny/vue-design-aurora": "~3.12.0",
27
25
  "@opentiny/vue-icon-saas": "~3.12.0",
28
- "@opentiny/vue-theme-saas": "~3.12.0"
26
+ "@opentiny/vue-vite-import": "~1.1.5",
27
+ "@opentiny/vue-theme-saas": "~3.12.0",
28
+ "@opentiny/vue-theme": "~3.12.0"
29
29
  },
30
30
  "devDependencies": {
31
31
  "@types/markdown-it": "^12.2.3",
package/playground/App.vue CHANGED
@@ -17,11 +17,11 @@ import logoUrl from './assets/opentiny-logo.svg?url'
17
17
  import GitHub from './icons/Github.vue'
18
18
  import Share from './icons/Share.vue'
19
19
 
20
- const VERSION = 'tiny-vue-version'
20
+ const VERSION = 'tiny-vue-version-3.12'
21
21
  const LAYOUT = 'playground-layout'
22
22
  const LAYOUT_REVERSE = 'playground-layout-reverse'
23
23
 
24
- const versions = ['3.11', '3.10', '3.9', '3.8']
24
+ const versions = ['3.12', '3.11', '3.10', '3.9', '3.8']
25
25
  const latestVersion = localStorage.getItem(VERSION) || versions[0]
26
26
  const cdnHost = localStorage.getItem('setting-cdn')
27
27
  const getRuntime = (version) => `${cdnHost}/@opentiny/vue@${version}/runtime/`
package/src/App.vue CHANGED
@@ -16,6 +16,7 @@ import { ConfigProvider, Modal } from '@opentiny/vue'
16
16
  import { iconClose } from '@opentiny/vue-icon'
17
17
  import { appData } from './tools'
18
18
  import useTheme from './tools/useTheme'
19
+ import { useBulletin } from './tools/useBulletin.jsx'
19
20
 
20
21
  export default defineComponent({
21
22
  name: 'AppVue',
@@ -42,6 +43,7 @@ export default defineComponent({
42
43
  common.renderHeader()
43
44
  })
44
45
  const { designConfig } = useTheme()
46
+ useBulletin()
45
47
 
46
48
  provide('showPreview', (url) => {
47
49
  previewUrl.value = url
package/src/tools/useBulletin.jsx ADDED
@@ -0,0 +1,43 @@
1
+ import { $local } from './storage'
2
+ import { onMounted } from 'vue'
3
+ import { Modal } from '@opentiny/vue'
4
+
5
+ const bulletins = [
6
+ {
7
+ id: 'version-tip',
8
+ content: `为了避免 @opentiny/vue 的月度版本(minor)升级带来的不确定因素，推荐在您的工程中的 package.json 中依赖包的版本号前使用 ~，
9
+ 比如 "@opentiny/vue": "~3.12.0"。`,
10
+ time: '2023-12-04'
11
+ }
12
+ ]
13
+ const bulletinKey = 'openttiny-last-bulletin'
14
+ /**
15
+ * 公告通知管理
16
+ * 1、记录历史所有的公告，以备记录，每次只显示第一条公告即可！
17
+ * 2、用户点击确认之后，不再弹出该公告
18
+ */
19
+ export function useBulletin() {
20
+ const lastBulletin = bulletins[0]
21
+ if (lastBulletin.id !== $local[bulletinKey]) {
22
+ onMounted(() => {
23
+ Modal.confirm({
24
+ title: '公告',
25
+ message: (<div style="font-size:16px;line-height:1.5;">
26
+ <div>尊敬的 TinyVue 用户：</div>
27
+ <p style="text-indent: 2em;" v-html={lastBulletin.content}>
28
+ </p>
29
+ <div style="text-align:right;margin-top:20px">TinyVue 团队</div>
30
+ <div style="text-align:right;">{ lastBulletin.time }</div>
31
+ </div>),
32
+ status: null,
33
+ width:'760',
34
+ confirmContent: '我知道了',
35
+ cancelContent: '关闭'
36
+ }).then((res) => {
37
+ if (res === 'confirm') {
38
+ $local[bulletinKey] = lastBulletin.id
39
+ }
40
+ })
41
+ })
42
+ }
43
+ }
package/src/views/components/components.vue CHANGED
@@ -8,16 +8,17 @@
8
8
  <div class="ti-fi-1 ti-w0 ti-rel cmp-container">
9
9
  <!-- 一个组件的文档: 描述md + demos + apis -->
10
10
  <div class="markdown-body markdown-top-body" size="medium" v-html="cmpTopMd"></div>
11
- <version-tip
11
+ <version-tip
12
12
  v-if="currJson.metaData || currJson.versionTipOption"
13
- :metaData="currJson.metaData"
14
- v-bind="currJson.versionTipOption">
13
+ :meta-data="currJson.metaData"
14
+ v-bind="currJson.versionTipOption"
15
+ >
15
16
  </version-tip>
16
17
  <template v-if="currJson?.demos?.length > 0">
17
18
  <div class="all-demos-container">
18
19
  <h2 class="ti-f30 ti-fw-normal !ti-mb20">{{ $t('yan-shi') }}</h2>
19
20
  <div v-if="apiModeState.demoMode === 'default'" class="ti-f-c ti-f-wrap">
20
- <template v-if="currJson.column === '2'">
21
+ <template v-if="currJson.column === '2' && currJson.demos.length > 1">
21
22
  <div class="one-demo-col2">
22
23
  <div>
23
24
  <demo v-for="demo in evenDemo" :key="demo.name" :demo="demo" />
@@ -71,12 +72,13 @@
71
72
  <td>
72
73
  <a v-if="row.demoId" @click="jumpToDemo(row.demoId)">{{ row.name }}</a>
73
74
  <span v-else>{{ row.name }}</span>
74
- <version-tip
75
+ <version-tip
75
76
  v-if="row.metaData || row.versionTipOption"
76
- :metaData="row.metaData"
77
- v-bind="row.versionTipOption"
78
- renderType="tag"
79
- tipSubject="api">
77
+ :meta-data="row.metaData"
78
+ v-bind="row.versionTipOption"
79
+ render-type="tag"
80
+ tip-subject="api"
81
+ >
80
82
  </version-tip>
81
83
  </td>
82
84
  <td v-if="!key.includes('slots')">
@@ -138,7 +140,7 @@
138
140
  <script lang="jsx">
139
141
  import { defineComponent, reactive, computed, toRefs, watch, onMounted, ref } from 'vue'
140
142
  import { marked } from 'marked'
141
- import { Loading, Anchor, ButtonGroup, ColumnListGroup } from '@opentiny/vue'
143
+ import { Loading, Anchor, ButtonGroup } from '@opentiny/vue'
142
144
  import debounce from '@opentiny/vue-renderless/common/deps/debounce'
143
145
  import { $t, $t2, $clone, $split, fetchDemosFile, useApiMode, useTemplateMode } from '@/tools'
144
146
  import demo from '@/views/components/demo'