From a931e5fdc6326db3d82e506d179035c919e8e543 Mon Sep 17 00:00:00 2001 From: ajaxzheng <894103554@qq.com> Date: Mon, 27 May 2024 20:44:20 -0700 Subject: [PATCH] feat: sync release-3.16.0 to dev (#1648) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix(grid): fix right fixed table header gutter style (#1542) * fix(grid): [grid] fix grid no emit filter-change bug (#1536) * fix(grid): [grid] fix grid not emit filter-change bug * fix(grid): [grid] fix grid not emit filter-change bug * docs: add v3.15.0 changelog (#1544) * fix(tree): remove leaf node's padding-left (#1546) * fix(action-menu): [action-menu] fix no divided bug (#1538) * fix(action-menu): [action-menu] fix no divided bug * fix(action-menu): [action-menu] fix no divided bug * refactor(unplugin): rewrite unplugin for autoimport Vue components (#1553) * fix(tabs): [tabs] Fixed issue with default slot and template/v-if/v-for usage in vue2 and vue3 (#1558) * fix(tabs): [tabs] Fix the bug where the name is empty caused by using v-if in tabstem * fix(tabs): [tabs] update renderless version * fix(tabs): [tabs] Fix the issue with rendering in the default slot of Vue3 * fix(tabs): [tabs] Fix the issue of inconsistent highlighting when multiple V-ifs are used * fix(tabs): [tabs] update opentiny/vue-tabs version * fix(theme-saas): update theme saas dependencies (#1582) * Update package.json * feat(unplugin-tiny-vue): add TinyVueResolver (#1585) * docs: add breaking changes to changelog (#1562) * fix(chart): delete chart duplicate key (#1624) * fix(select): [select] add showAllTextTag prop for select (#1627) * fix(select): add showAllTextTag prop for select * fix(select): update select version in package.json * fix: [chart]fix chart height error and area chart empty data error (#1631) * fix: 修复面积图空数据报错问题 * fix: 修复图表高度设置为100%的高度异常问题 * fix: 修改boxplot图表案例引入 * fix(drop-times): [drop-times] modify style (#1635) * feat(theme): update theme version * fix(chart): fix chart extend bugs (#1638) * fix: 修复chart图表的extend未生效问题 * fix: 优化图表extend逻辑 * fix: 优化图表extend逻辑 * docs: optimize component category (#1626) (#1641) * docs: update changelog v3.16.0 (#1642) * feat(version): add npmmirror cdn link (#1646) * feat(version): update docs version --------- Co-authored-by: gimmyhehe <975402925@qq.com> Co-authored-by: Kagol Co-authored-by: 申君健 <40288193@qq.com> Co-authored-by: chenxi-20 <76168465+chenxi-20@users.noreply.github.com> Co-authored-by: Davont Co-authored-by: 李天佑 <66231260+You-Hw-Y@users.noreply.github.com> --- examples/sites/demos/apis/action-menu.js | 10 +- .../basic-usage-composition-api.vue | 3 +- .../demos/pc/app/action-menu/basic-usage.vue | 3 +- examples/sites/demos/pc/webdoc/changelog.md | 58 +++++++++- .../demos/pc/webdoc/import-components.md | 48 +++++++- examples/sites/package.json | 6 +- examples/sites/playground.html | 4 +- examples/sites/playground/App.vue | 34 +++--- internals/unplugin-tiny-vue/package.json | 4 +- internals/unplugin-tiny-vue/src/index.ts | 87 +++++--------- packages/renderless/package.json | 4 +- packages/renderless/src/tabs/index.ts | 71 +++++++++--- packages/renderless/types/action-menu.type.ts | 15 ++- packages/theme-saas/package.json | 2 +- packages/theme-saas/src/index.less | 1 + packages/theme-saas/src/mind-map/index.less | 0 packages/theme/package.json | 4 +- packages/theme/src/chart-core/index.less | 1 + packages/theme/src/drop-times/index.less | 10 +- packages/theme/src/grid/table.less | 3 + packages/vue/src/action-menu/package.json | 4 +- packages/vue/src/action-menu/src/pc.vue | 1 + .../vue/src/chart/chart-core/common/extend.ts | 32 +++--- .../vue/src/chart/chart-core/package.json | 2 +- .../src/chart/chart-core/src/chart-core.ts | 12 +- packages/vue/src/select/package.json | 2 +- packages/vue/src/select/src/index.ts | 4 + packages/vue/src/select/src/pc.vue | 108 ++++++++++-------- packages/vue/src/tabs/package.json | 4 +- packages/vue/src/tabs/src/tab-nav/pc.vue | 52 +-------- 30 files changed, 342 insertions(+), 247 deletions(-) create mode 100644 packages/theme-saas/src/mind-map/index.less diff --git a/examples/sites/demos/apis/action-menu.js b/examples/sites/demos/apis/action-menu.js index c2c7b90d9..212fc6810 100644 --- a/examples/sites/demos/apis/action-menu.js +++ b/examples/sites/demos/apis/action-menu.js @@ -165,11 +165,11 @@ export default { type: 'interface', code: ` interface IItemData { - label: string // 菜单项文本 - disabled: boolean // 是否禁用 - divided: boolean // 是否显示分割线 - children: IItemData[] // 菜单项子集 - icon: Component // 菜单项图标 + label?: string // 菜单项文本 + disabled?: boolean // 是否禁用 + divided?: boolean // 是否显示分割线 + children?: IItemData[] // 菜单项子集 + icon?: Component // 菜单项图标 } ` }, diff --git a/examples/sites/demos/pc/app/action-menu/basic-usage-composition-api.vue b/examples/sites/demos/pc/app/action-menu/basic-usage-composition-api.vue index 6a9d81049..eaa27836d 100644 --- a/examples/sites/demos/pc/app/action-menu/basic-usage-composition-api.vue +++ b/examples/sites/demos/pc/app/action-menu/basic-usage-composition-api.vue @@ -17,7 +17,8 @@ const options = ref([ label: '关机' }, { - label: '重启' + label: '重启', + divided: true }, { label: '网络设置', diff --git a/examples/sites/demos/pc/app/action-menu/basic-usage.vue b/examples/sites/demos/pc/app/action-menu/basic-usage.vue index 77361dc0e..be3952fa1 100644 --- a/examples/sites/demos/pc/app/action-menu/basic-usage.vue +++ b/examples/sites/demos/pc/app/action-menu/basic-usage.vue @@ -22,7 +22,8 @@ export default { label: '关机' }, { - label: '重启' + label: '重启', + divided: true }, { label: '网络设置', diff --git a/examples/sites/demos/pc/webdoc/changelog.md b/examples/sites/demos/pc/webdoc/changelog.md index 50b2f1f1f..f2c9b632f 100644 --- a/examples/sites/demos/pc/webdoc/changelog.md +++ b/examples/sites/demos/pc/webdoc/changelog.md @@ -1,5 +1,58 @@ # 更新日志 +## v2.16.0/v3.16.0 + +`2024/05/11` + +## What's Changed + +### Exciting New Features 🎉 + +- feat(tabs): [tabs] Add panel configuration function to adapt to the n… by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1547 +- fix(cascader): [cascader] add smb theme by @wuyiping0628 in https://github.com/opentiny/tiny-vue/pull/1584 +- fix(checkbox): [checkbox,check-button] Improve Checkbox and CheckButton accessibility. by @AcWrong02 in https://github.com/opentiny/tiny-vue/pull/1581 +- fix(button & button-grounp): [button, button-group]improve the accessibility by @AcWrong02 in https://github.com/opentiny/tiny-vue/pull/1586 +- feat(drawer): [drawer]support custom whether confirm event close the drawer and improve the type declaration by @AcWrong02 in https://github.com/opentiny/tiny-vue/pull/1588 + +### Bug Fixes 🐛 + +- fix(sites): change tinyui-design-common script link by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1539 +- fix(tabs): [tabs] Fix the bug where the name is empty caused by using… by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1549 +- fix(modal): the width of the modal box can be displayed in the center as the browser window size changes by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1554 +- fix(dialog-box): [dialog-box] fix issue #1242 by @RanierYu in https://github.com/opentiny/tiny-vue/pull/1550 +- fix(carousel): [carousel] fix issue #1543 by @Zcating in https://github.com/opentiny/tiny-vue/pull/1548 +- fix(grid): [grid] fix nested grid context menu error by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1578 +- fix(grid): [grid] fix simple custom setting selected value not match … by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1580 +- fix(grid): [grid] fix remote filter default value by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1574 +- fix(rich-text-editor): code overflow by @GaoNeng-wWw in https://github.com/opentiny/tiny-vue/pull/1590 +- fix(grid): [grid] fix tableWidth error when all column has min-width by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1595 +- fix(grid): [grid] fix shadow-root does not have getAttribute function by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1593 +- fix(date-picker): [date-picker]fix the tabindex's default value to 0 by @AcWrong02 in https://github.com/opentiny/tiny-vue/pull/1589 +- fix(modal): the modal prompt box is compatible with the position of titles and content icons by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1570 +- fix(file-upload): [file-upload] Fix the hidden feature bug in props.isHidden by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1614 +- fix(file-upload): [file-upload] Fix the hidden feature bug in props.isHidden by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1617 + +### Other Changes + +- docs: optimize component category by @kagol in https://github.com/opentiny/tiny-vue/pull/1641 +- docs: add v3.15.0 changelog by @kagol in https://github.com/opentiny/tiny-vue/pull/1537 +- docs: update vue-docs version by @kagol in https://github.com/opentiny/tiny-vue/pull/1541 +- fix(skeleton): [skeleton] update document by @wuyiping0628 in https://github.com/opentiny/tiny-vue/pull/1577 +- perf(theme-mobile): remove css vars from :root to root class of compo… by @Huangyilin19 in https://github.com/opentiny/tiny-vue/pull/1579 +- fix(anchor): [anchor] Correcting Ambiguity in Anchor Document Descrip… by @chenxi-20 in https://github.com/opentiny/tiny-vue/pull/1569 +- docs: add description and keywords for seo by @kagol in https://github.com/opentiny/tiny-vue/pull/1592 +- doc: [charts] 更新图表的 API 文档，增加 options 使用方法 by @Davont in https://github.com/opentiny/tiny-vue/pull/1600 +- test(button-group): [button-group] Supplement button-group component test case by @trueLoving in https://github.com/opentiny/tiny-vue/pull/1596 +- docs(Carousel): [carousel] improve the document of Carousel Component by @AcWrong02 in https://github.com/opentiny/tiny-vue/pull/1571 +- fix: optimization statistic component by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1608 +- feat: update chart docs by @zzcr in https://github.com/opentiny/tiny-vue/pull/1623 + +## New Contributors + +- @RanierYu made their first contribution in https://github.com/opentiny/tiny-vue/pull/1550 +- @Zcating made their first contribution in https://github.com/opentiny/tiny-vue/pull/1548 +- @trueLoving made their first contribution in https://github.com/opentiny/tiny-vue/pull/1596 + ## v2.15.0/v3.15.0 `2024/04/08` @@ -8,9 +61,10 @@ ### Exciting New Features 🎉 +- feat(chart-process): add Process Chart component by @Davont - feat(sites): add theme route by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1478 -- Cgm/add theme route by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1479 -- fix(transfer ): update transfer xdesign by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1496 +- feat: add theme route by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1479 +- fix(transfer): update transfer xdesign by @James-9696 in https://github.com/opentiny/tiny-vue/pull/1496 - feat(form): [form] add xDesign theme by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1507 - feat(action-menu): [action-menu] add XDesign theme by @gimmyhehe in https://github.com/opentiny/tiny-vue/pull/1514 - feat(date-picker): [date-picker] date picker add quarter type by @kagol in https://github.com/opentiny/tiny-vue/pull/1513 diff --git a/examples/sites/demos/pc/webdoc/import-components.md b/examples/sites/demos/pc/webdoc/import-components.md index bf1670ae5..3b152dfb0 100644 --- a/examples/sites/demos/pc/webdoc/import-components.md +++ b/examples/sites/demos/pc/webdoc/import-components.md @@ -22,7 +22,7 @@ Vite import autoImportPlugin from '@opentiny/unplugin-tiny-vue' export default { - plugins: [autoImportPlugin()] + plugins: [autoImportPlugin('vite')] } ``` @@ -33,13 +33,53 @@ Webpack const autoImportPlugin = require('@opentiny/unplugin-tiny-vue') -module.exports = { - plugins: [autoImportPlugin()] -} +module.exports = defineConfig({ + configureWebpack: { + plugins: [autoImportPlugin('webpack')] + } +}) ``` 这样你就能直接在项目中使用 TinyVue 的组件，这些组件都是自动按需导入的，无需手动导入，且不用担心项目体积变得太大。 +你也可以只使用 TinyVueResolver，这样就可以和其他组件库一起使用。 + +Vite + +```ts +// vite.config.ts + +import Components from 'unplugin-vue-components/vite' +import autoImportPlugin from '@opentiny/unplugin-tiny-vue' + +export default { + plugins: [ + Components({ + resolvers: [TinyVueResolver] + }) + ] +} +``` + +Webpack + +```js +// webpack.config.js + +const Components = require('unplugin-vue-components/webpack').default +const TinyVueResolver = require('@opentiny/unplugin-tiny-vue').TinyVueResolver + +module.exports = defineConfig({ + configureWebpack: { + plugins: [ + Components({ + resolvers: [TinyVueResolver] + }) + ] + } +}) +``` + 想了解更多自动按需导入的信息，请参考：[unplugin-vue-components](https://github.com/antfu/unplugin-vue-components) 和 [unplugin-auto-import](https://github.com/antfu/unplugin-auto-import)。 ### 多组件引入 diff --git a/examples/sites/package.json b/examples/sites/package.json index 1afb83213..5f7f988ca 100644 --- a/examples/sites/package.json +++ b/examples/sites/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/vue-docs", - "version": "3.16.0", + "version": "3.16.2", "license": "MIT", "scripts": { "start": "vite", @@ -44,7 +44,7 @@ "vue-router": "4.1.5", "marked": "^4.3.0", "sortablejs": "1.15.0", - "@opentiny/vue-repl": "^1.1.0" + "@opentiny/vue-repl": "^1.1.2" }, "devDependencies": { "@opentiny-internal/unplugin-virtual-template": "workspace:~", @@ -84,4 +84,4 @@ "vite-plugin-dynamic-import": "1.5.0", "vue-tsc": "^1.8.5" } -} \ No newline at end of file +} diff --git a/examples/sites/playground.html b/examples/sites/playground.html index 360dcc411..dd171056b 100644 --- a/examples/sites/playground.html +++ b/examples/sites/playground.html @@ -6,7 +6,7 @@ Vite + Vue @@ -14,4 +14,4 @@
- \ No newline at end of file + diff --git a/examples/sites/playground/App.vue b/examples/sites/playground/App.vue index 94639482f..61eb335e3 100644 --- a/examples/sites/playground/App.vue +++ b/examples/sites/playground/App.vue @@ -17,7 +17,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.14' +const VERSION = 'tiny-vue-version-3.16' const LAYOUT = 'playground-layout' const LAYOUT_REVERSE = 'playground-layout-reverse' @@ -28,27 +28,35 @@ const isMobileFirst = tinyMode === 'mobile-first' const isSaas = tinyTheme === 'saas' const isPreview = searchObj.get('openMode') === 'preview' // 是否多端弹窗预览 -const versions = ['3.14', '3.13', '3.12', '3.11', '3.10', '3.9', '3.8'] +const versions = ['3.16', '3.15', '3.14', '3.13', '3.12', '3.11', '3.10', '3.9', '3.8'] const latestVersion = isPreview ? versions[0] : localStorage.getItem(VERSION) || versions[0] const cdnHost = localStorage.getItem('setting-cdn') + +const versionDelimiter = cdnHost.includes('npmmirror') ? '/' : '@' +const fileDelimiter = cdnHost.includes('npmmirror') ? 'files/' : '' + const getRuntime = (version) => { const useVersion = import.meta.env.VITE_PLAYGROUND_VERIOSN || version - return `${cdnHost}/@opentiny/vue@${useVersion}/runtime/` + return `${cdnHost}/@opentiny/vue${versionDelimiter}${useVersion}/${fileDelimiter}runtime/` } const createImportMap = (version) => { const imports = { + 'vue': `${cdnHost}/vue${versionDelimiter}3.4.27/${fileDelimiter}dist/vue.runtime.esm-browser.js`, + '@vue/compiler-sfc': `${cdnHost}/@vue/compiler-sfc${versionDelimiter}3.4.27/${fileDelimiter}dist/compiler-sfc.esm-browser.js`, '@opentiny/vue': `${getRuntime(version)}tiny-vue.mjs`, '@opentiny/vue-icon': `${getRuntime(version)}tiny-vue-icon.mjs`, '@opentiny/vue-locale': `${getRuntime(version)}tiny-vue-locale.mjs`, '@opentiny/vue-common': `${getRuntime(version)}tiny-vue-common.mjs`, - '@opentiny/vue-theme/': `${cdnHost}/@opentiny/vue-theme@${version}/`, - '@opentiny/vue-theme-mobile/': `${cdnHost}/@opentiny/vue-theme-mobile@${version}/`, - '@opentiny/vue-renderless/': `${cdnHost}/@opentiny/vue-renderless@${version}/`, - 'sortablejs': `${cdnHost}/sortablejs@1.15.0/modular/sortable.esm.js` + '@opentiny/vue-theme/': `${cdnHost}/@opentiny/vue-theme${versionDelimiter}${version}/${fileDelimiter}`, + '@opentiny/vue-theme-mobile/': `${cdnHost}/@opentiny/vue-theme-mobile${versionDelimiter}${version}/${fileDelimiter}`, + '@opentiny/vue-renderless/': `${cdnHost}/@opentiny/vue-renderless${versionDelimiter}${version}/${fileDelimiter}`, + 'sortablejs': `${cdnHost}/sortablejs${versionDelimiter}1.15.0/${fileDelimiter}modular/sortable.esm.js` } if (['aurora', 'smb', 'saas'].includes(tinyTheme)) { - imports[`@opentiny/vue-design-${tinyTheme}`] = `${cdnHost}/@opentiny/vue-design-${tinyTheme}@${version}/index.js` + imports[ + `@opentiny/vue-design-${tinyTheme}` + ] = `${cdnHost}/@opentiny/vue-design-${tinyTheme}${versionDelimiter}${version}/${fileDelimiter}index.js` } if (isSaas) { imports['@opentiny/vue-icon'] = `${getRuntime(version)}tiny-vue-icon-saas.mjs` @@ -67,10 +75,10 @@ const getTinyTheme = (version) => { theme = 'default' } const tinyThemeMap = { - default: `${cdnHost}/@opentiny/vue-theme@${version}/index.css`, - smb: `${cdnHost}/@opentiny/vue-theme@${version}/index.css`, - aurora: `${cdnHost}/@opentiny/vue-theme@${version}/index.css`, - saas: `${cdnHost}/@opentiny/vue-theme-saas@${version}/index.css` + default: `${cdnHost}/@opentiny/vue-theme${versionDelimiter}${version}/${fileDelimiter}index.css`, + smb: `${cdnHost}/@opentiny/vue-theme${versionDelimiter}${version}/${fileDelimiter}index.css`, + aurora: `${cdnHost}/@opentiny/vue-theme${versionDelimiter}${version}/${fileDelimiter}index.css`, + saas: `${cdnHost}/@opentiny/vue-theme-saas${versionDelimiter}${version}/${fileDelimiter}index.css` } return tinyThemeMap[theme] } @@ -163,7 +171,7 @@ function insertStyleDom(version) { // 增加mobile支持，增加mobile的样式表 const mobileLink = link.cloneNode(true) - mobileLink.href = `${cdnHost}/@opentiny/vue-theme-mobile@${version}/index.css` + mobileLink.href = `${cdnHost}/@opentiny/vue-theme-mobile${versionDelimiter}${version}/${fileDelimiter}index.css` iframeWin.document.head.append(mobileLink) }) }) diff --git a/internals/unplugin-tiny-vue/package.json b/internals/unplugin-tiny-vue/package.json index b62878729..12ec3b7e3 100644 --- a/internals/unplugin-tiny-vue/package.json +++ b/internals/unplugin-tiny-vue/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/unplugin-tiny-vue", - "version": "0.0.1", + "version": "0.0.2", "description": "A vite auto import plugin for TinyVue", "main": "dist/index.cjs", "module": "dist/index.js", @@ -35,7 +35,7 @@ "vite": ">=4" }, "dependencies": { - "magic-string": "^0.27.0" + "unplugin-vue-components": "^0.26.0" }, "devDependencies": { "rimraf": "^5.0.5", diff --git a/internals/unplugin-tiny-vue/src/index.ts b/internals/unplugin-tiny-vue/src/index.ts index 7405f5d20..e7a4a6244 100644 --- a/internals/unplugin-tiny-vue/src/index.ts +++ b/internals/unplugin-tiny-vue/src/index.ts @@ -1,62 +1,37 @@ -import MagicString from 'magic-string' -import type { Plugin } from 'vite' +import AutoVite from 'unplugin-vue-components/vite' +import AutoWebpack from 'unplugin-vue-components/webpack' +import AutoRollup from 'unplugin-vue-components/rollup' +import AutoEsbuild from 'unplugin-vue-components/esbuild' +import AutoRspack from 'unplugin-vue-components/rspack' -function pascalCase(str: string) { - const camelCaseStr = str.replace(/-(\w)/g, (_, c) => (c ? c.toUpperCase() : '')) - return camelCaseStr.charAt(0).toUpperCase() + camelCaseStr.slice(1) +const supportMap = { + 'vite': AutoVite, + 'webpack': AutoWebpack, + 'rollup': AutoRollup, + 'esbuild': AutoEsbuild, + 'rspack': AutoRspack } -const resolveVue = (code: string, s: MagicString) => { - const results: any = [] - - for (const match of code.matchAll(/_resolveComponent[0-9]*\("(.+?)"\)/g)) { - const matchedName = match[1] - if (match.index != null && matchedName && !matchedName.startsWith('_')) { - const start = match.index - const end = start + match[0].length - results.push({ - rawName: matchedName, - replace: (resolved: string) => s.overwrite(start, end, resolved) - }) - } - } - - return results -} - -const findComponent = (rawName: string, name: string, s: MagicString) => { - if (!name.match(/^Tiny[a-zA-Z]/)) { - return - } - s.prepend(`import ${name} from '@opentiny/vue-${rawName.slice(5)}';\n`) -} - -const transformCode = (code) => { - const s = new MagicString(code) - const results = resolveVue(code, s) - - for (const { rawName, replace } of results) { - const name = pascalCase(rawName) - findComponent(rawName, name, s) - replace(name) - } - - const result = s.toString() - return result -} - -export default function vitePluginAutoImport(): Plugin { - return { - name: '@opentiny/auto-import', - - transform(code, id) { - // 不处理node_modules内的依赖 - if (/\.(?:vue)$/.test(id) && !/(node_modules)/.test(id)) { - return { - code: transformCode(code), - map: null - } - } +export const TinyVueResolver = (componentName) => { + if (componentName.startsWith('Tiny') && !componentName.startsWith('TinyIcon')) { + return { + name: componentName.slice(4), + from: '@opentiny/vue' } } } + +/** TinyVue 自动导入组件的插件，支持Vite,Webpack,Rollup 等常见的构建工具。 + * 目前不支持Tiny Icon的自动导入 + * @example + * import autoImportPlugin from '@opentiny/unplugin-tiny-vue' + * plugins: [autoImportPlugin('vite')] + */ +export default (name) => { + // 兼容webpack/vite的差异 + const autoPlugin = supportMap[name].default || supportMap[name] + + return autoPlugin({ + resolvers: [TinyVueResolver] + }) +} diff --git a/packages/renderless/package.json b/packages/renderless/package.json index 23952e48b..440f71713 100644 --- a/packages/renderless/package.json +++ b/packages/renderless/package.json @@ -1,7 +1,7 @@ { "name": "@opentiny/vue-renderless", "private": true, - "version": "3.16.0", + "version": "3.16.1", "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.", "homepage": "https://opentiny.design/tiny-vue", "keywords": [ @@ -43,4 +43,4 @@ "esno": "^0.16.3", "tsup": "7.2.0" } -} \ No newline at end of file +} diff --git a/packages/renderless/src/tabs/index.ts b/packages/renderless/src/tabs/index.ts index 5898e6186..6859a6577 100644 --- a/packages/renderless/src/tabs/index.ts +++ b/packages/renderless/src/tabs/index.ts @@ -11,6 +11,58 @@ */ import type { ITabsRenderlessParams, ITabsPane, ITabsCustomEvent, ITabsPaneVm } from '@/types' +// 此处与aui区别开，将tabNav的方法抽离出来，从源头解决pane的排序问题 +const getOrderedPanes = (parent, panes) => { + const slotDefault = parent.$slots.default + let orders + + if (typeof slotDefault === 'function') { + orders = [] + + const tabVnodes = slotDefault() + const handler = ({ type, componentOptions, props }) => { + let componentName = type && type.componentName + + if (!componentName) componentName = componentOptions && componentOptions.Ctor.extendOptions.componentName + + if (componentName === 'TabItem') { + const paneName = (props && props.name) || (componentOptions && componentOptions.propsData.name) + + orders.push(paneName) + } + } + + tabVnodes.forEach(({ type, componentOptions, props, children }) => { + if ( + type && + (type.toString() === 'Symbol(Fragment)' || // vue@3.3之前的开发模式 + type.toString() === 'Symbol(v-fgt)' || // vue@3.3.1 的变更 + type.toString() === 'Symbol()') // 构建后 + ) { + Array.isArray(children) && + children.forEach(({ type, componentOptions, props }) => handler({ type, componentOptions, props })) + } else { + handler({ type, componentOptions, props }) + } + }) + } + + // 此处不同步aui，vue3情况下插槽使用v-if生成的slotDefault有差异 + if (orders.length > 0) { + let tmpPanes = [] + + orders.forEach((paneName) => { + let pane = panes.find((pane) => pane.name === paneName) + + if (pane) tmpPanes.push(pane) + }) + + panes = tmpPanes + } + + return panes +} + export const calcPaneInstances = ({ constants, @@ -44,24 +96,7 @@ export const calcPaneInstances = index > -1 ? (currentPanes[index] = vm) : currentPanes.push(vm) } }) - - const currentPaneStates = currentPanes.map((pane) => pane.state) - const paneStates = state.panes.map((pane) => pane.state) - - let newPanes = [] as ITabsPaneVm[] - for (let i = 0; i < paneStates.length; i++) { - const paneState = paneStates[i] - const index = currentPaneStates.indexOf(paneState) - - if (index > -1) { - newPanes.push(state.panes[i]) - currentPanes.splice(index, 1) - - currentPaneStates.splice(index, 1) - } - } - - newPanes = newPanes.concat(currentPanes) + const newPanes = getOrderedPanes(parent, currentPanes) as ITabsPaneVm[] const panesChanged = !( newPanes.length === state.panes.length && diff --git a/packages/renderless/types/action-menu.type.ts b/packages/renderless/types/action-menu.type.ts index 279dc3e35..b8b2337c0 100644 --- a/packages/renderless/types/action-menu.type.ts +++ b/packages/renderless/types/action-menu.type.ts @@ -23,14 +23,23 @@ import type { computedSuffixIcon } from '../src/action-menu' +export interface IActonMenuOptionsItem { + label?: string + disabled?: boolean + divided?: boolean + children?: IActonMenuOptionsItem[] + icon?: any + [key: string]: any +} + export interface IActionMenuState { - visibleOptions: object - moreOptions: object + visibleOptions: IActonMenuOptionsItem[] + moreOptions: IActonMenuOptionsItem[] isCardMode: boolean spacing: string | number maxShowNum: number moreText: string - suffixIcon: string | Object + suffixIcon: string | object } export type IActionMenuProps = ExtractPropTypes diff --git a/packages/theme-saas/package.json b/packages/theme-saas/package.json index b1c9fc573..b6fe0c51a 100644 --- a/packages/theme-saas/package.json +++ b/packages/theme-saas/package.json @@ -101,4 +101,4 @@ ] } } -} \ No newline at end of file +} diff --git a/packages/theme-saas/src/index.less b/packages/theme-saas/src/index.less index 83c5dd802..d96cd84b8 100644 --- a/packages/theme-saas/src/index.less +++ b/packages/theme-saas/src/index.less @@ -99,6 +99,7 @@ @import './logout/index.less'; @import './menubar/index.less'; @import './milestone/index.less'; +@import './mind-map/index.less'; @import './modal/index.less'; @import './month-range/index.less'; @import './month-table/index.less'; diff --git a/packages/theme-saas/src/mind-map/index.less b/packages/theme-saas/src/mind-map/index.less new file mode 100644 index 000000000..e69de29bb diff --git a/packages/theme/package.json b/packages/theme/package.json index 35d2dc86f..4bddbc189 100644 --- a/packages/theme/package.json +++ b/packages/theme/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/vue-theme", - "version": "3.16.0", + "version": "3.16.2", "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.", "main": "index.css", "homepage": "https://opentiny.design/tiny-vue", @@ -87,4 +87,4 @@ ] } } -} \ No newline at end of file +} diff --git a/packages/theme/src/chart-core/index.less b/packages/theme/src/chart-core/index.less index f5b81ce8d..646c8bcdb 100644 --- a/packages/theme/src/chart-core/index.less +++ b/packages/theme/src/chart-core/index.less @@ -17,6 +17,7 @@ .hui-chart { position: relative; + height: 100% } .@{chart-prefix-cls} { diff --git a/packages/theme/src/drop-times/index.less b/packages/theme/src/drop-times/index.less index 4b0ad0ed1..77590e6d7 100644 --- a/packages/theme/src/drop-times/index.less +++ b/packages/theme/src/drop-times/index.less @@ -12,11 +12,13 @@ @import '../custom.less'; -@select-dropdown-prefix-cls: ~'@{css-prefix}select-dropdown'; +@drop-times-prefix-cls: ~'@{css-prefix}drop-times'; +@select-dropdown-prefix-cls: ~'@{css-prefix}select-dropdown__item'; -.@{select-dropdown-prefix-cls} { - & &__item { +.@{drop-times-prefix-cls} { + + .@{select-dropdown-prefix-cls} { font-size: var(--ti-drop-times-item-font-size); padding: var(--ti-drop-times-item-padding); @@ -31,4 +33,4 @@ } } -} \ No newline at end of file +} diff --git a/packages/theme/src/grid/table.less b/packages/theme/src/grid/table.less index f890e6c68..e22bdb36c 100644 --- a/packages/theme/src/grid/table.less +++ b/packages/theme/src/grid/table.less @@ -1015,6 +1015,9 @@ // 部分场景下浏览器缩放比例导致表头和表体错位问题 th.col__gutter { width: 0; + position: sticky; + right: 0; + background-color: var(--ti-grid-header-background-color); } } diff --git a/packages/vue/src/action-menu/package.json b/packages/vue/src/action-menu/package.json index 2078ecef2..f8af08294 100644 --- a/packages/vue/src/action-menu/package.json +++ b/packages/vue/src/action-menu/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/vue-action-menu", - "version": "3.16.0", + "version": "3.16.1", "description": "", "main": "lib/index.js", "module": "index.ts", @@ -24,4 +24,4 @@ "@opentiny/vue-icon": "workspace:~" }, "license": "MIT" -} \ No newline at end of file +} diff --git a/packages/vue/src/action-menu/src/pc.vue b/packages/vue/src/action-menu/src/pc.vue index a587f2282..7a383be14 100644 --- a/packages/vue/src/action-menu/src/pc.vue +++ b/packages/vue/src/action-menu/src/pc.vue @@ -42,6 +42,7 @@ { - const options = removeNullKeys(option) + const cloneOption = cloneDeep(option) + const mergeOption = removeNullKeys(cloneOption) if (!extend) { return } @@ -32,11 +34,11 @@ export default ({ option, extend }) => { if (~key.indexOf('.')) { // （其他类型）属性名中带. 为true - set(options, key, value) + set(mergeOption, key, value) } else if (typeof value === 'function') { // 当属性为函数时，设置的是函数的返回值 - options[key] = value(options[key]) - } else if (isArr(options[key]) && isArr(value)) { + mergeOption[key] = value(mergeOption[key]) + } else if (isArr(mergeOption[key]) && isArr(value)) { // 当被修改值和替换值都为数组时，key符合attrList就合并 const attrList = [ 'series', @@ -54,28 +56,28 @@ export default ({ option, extend }) => { ] if (~attrList.indexOf(key)) { // attrList，指定的key才能合并处理 - options[key] = merge(options[key], value) + mergeOption[key] = merge(mergeOption[key], value) } } else { // 属性为对象(eg: tooltip)或包含对象的数组(eg: series) - if (isArr(options[key]) && isObject(options[key][0])) { + if (isArr(mergeOption[key]) && isObject(mergeOption[key][0])) { // 属性值是包含对象数组 - options[key].forEach((option, i) => (options[key][i] = { ...option, ...value })) - } else if (isObject(options[key])) { + mergeOption[key].forEach((option, i) => (mergeOption[key][i] = { ...option, ...value })) + } else if (isObject(mergeOption[key])) { // 被替换属性值是对象 - let optionBase = options[key] + let optionBase = mergeOption[key] - options[key] = { ...optionBase, ...value } // 两者合并，后者覆盖前者 + mergeOption[key] = { ...optionBase, ...value } // 两者合并，后者覆盖前者 } else { // 直接覆盖替换 - options[key] = value + mergeOption[key] = value } } }) - const { series } = option + const { series } = mergeOption if (series) { if (Array.isArray(series)) { - options.series = series.map((item) => { + mergeOption.series = series.map((item) => { if (get(item, 'type') === 'line' && get(item, 'label.show')) { item.showSymbol = true } @@ -83,8 +85,8 @@ export default ({ option, extend }) => { return item }) } else { - options.series.label = { show: false, ...option.series.label } + mergeOption.series.label = { show: false, ...mergeOption.series.label } } } - return options + return mergeOption } diff --git a/packages/vue/src/chart/chart-core/package.json b/packages/vue/src/chart/chart-core/package.json index 1cf8ca07b..2bcae6c8d 100644 --- a/packages/vue/src/chart/chart-core/package.json +++ b/packages/vue/src/chart/chart-core/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/vue-chart-core", - "version": "3.16.0", + "version": "3.16.1", "description": "", "main": "lib/index.js", "module": "index.ts", diff --git a/packages/vue/src/chart/chart-core/src/chart-core.ts b/packages/vue/src/chart/chart-core/src/chart-core.ts index 37e729253..490221b17 100644 --- a/packages/vue/src/chart/chart-core/src/chart-core.ts +++ b/packages/vue/src/chart/chart-core/src/chart-core.ts @@ -26,7 +26,6 @@ export default { width: { type: String, default: 'auto' }, height: { type: String, default: '400px' }, events: { type: Object, default() {} }, - events: { type: Object, default() {} }, initOptions: { type: Object, default() { @@ -168,12 +167,6 @@ export default { } }, watch: { - options: { - handler() { - this.refreshChart() - }, - deep: true - }, options: { handler() { this.refreshChart() @@ -360,8 +353,7 @@ export default { this.setAnimation(option) this.applyMarks(this.integrateChart.eChartOption) this.integrateChart.refresh(option) - this.applyExtend(this.integrateChart.eChartOption) - option.extend = this.integrateChart.eChartOption + option.extend = this.applyExtend(this.integrateChart.eChartOption) if (this.colorMode !== 'default') { option.color = this.computedChartColor() } @@ -394,7 +386,7 @@ export default { this.integrateChart.setSimpleOption(this.iChartName, option, plugins) this.$emit('handle-color', option.color) this.applyMarks(this.integrateChart.eChartOption) - option = this.applyExtend(this.integrateChart.eChartOption) + option.extend = this.applyExtend(this.integrateChart.eChartOption) this.integrateChart.render(this.renderOption) } diff --git a/packages/vue/src/select/package.json b/packages/vue/src/select/package.json index 4da412e9a..dc040faa8 100644 --- a/packages/vue/src/select/package.json +++ b/packages/vue/src/select/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/vue-select", - "version": "3.16.0", + "version": "3.16.1", "description": "", "main": "lib/index.js", "module": "index.ts", diff --git a/packages/vue/src/select/src/index.ts b/packages/vue/src/select/src/index.ts index 3d07e4dc1..c7876d3f1 100644 --- a/packages/vue/src/select/src/index.ts +++ b/packages/vue/src/select/src/index.ts @@ -344,6 +344,10 @@ export default defineComponent({ allText: { type: String, default: '' + }, + showAllTextTag: { + type: Boolean, + default: false } }, setup(props, context) { diff --git a/packages/vue/src/select/src/pc.vue b/packages/vue/src/select/src/pc.vue index 8fc52d441..9469fa604 100644 --- a/packages/vue/src/select/src/pc.vue +++ b/packages/vue/src/select/src/pc.vue @@ -121,65 +121,80 @@ + - - + {{ allText || t('ui.base.all') }} - - + @@ -751,6 +766,7 @@ export default defineComponent({ 'showProportion', 'clickExpand', 'maxVisibleRows', + 'showAllTextTag', 'allText' ], setup(props, context) { diff --git a/packages/vue/src/tabs/package.json b/packages/vue/src/tabs/package.json index 1496fe117..6e7442683 100644 --- a/packages/vue/src/tabs/package.json +++ b/packages/vue/src/tabs/package.json @@ -1,6 +1,6 @@ { "name": "@opentiny/vue-tabs", - "version": "3.16.0", + "version": "3.16.1", "description": "", "main": "lib/index.js", "module": "index.ts", @@ -27,4 +27,4 @@ "@opentiny/vue-theme-mobile": "workspace:~" }, "license": "MIT" -} \ No newline at end of file +} diff --git a/packages/vue/src/tabs/src/tab-nav/pc.vue b/packages/vue/src/tabs/src/tab-nav/pc.vue index 1ee7c6216..f56482a9f 100644 --- a/packages/vue/src/tabs/src/tab-nav/pc.vue +++ b/packages/vue/src/tabs/src/tab-nav/pc.vue @@ -22,56 +22,6 @@ import type { ITabNavApi } from '@opentiny/vue-renderless/types/tab-nav.type' import TabBar from './tab-bar.vue' import { tabNavPcProps } from './index' -const getOrderedPanes = (state, panes) => { - const slotDefault = state.rootTabs.$slots.default - let orders - - if (typeof slotDefault === 'function') { - orders = [] - - const tabVnodes = slotDefault() - const handler = ({ type, componentOptions, props }) => { - let componentName = type && type.componentName - - if (!componentName) componentName = componentOptions && componentOptions.Ctor.extendOptions.componentName - - if (componentName === 'TabItem') { - const paneName = (props && props.name) || (componentOptions && componentOptions.propsData.name) - - orders.push(paneName) - } - } - - tabVnodes.forEach(({ type, componentOptions, props, children }) => { - if ( - type && - (type.toString() === 'Symbol(Fragment)' || // vue@3.3之前的开发模式 - type.toString() === 'Symbol(v-fgt)' || // vue@3.3.1 的变更 - type.toString() === 'Symbol()') // 构建后 - ) { - Array.isArray(children) && - children.forEach(({ type, componentOptions, props }) => handler({ type, componentOptions, props })) - } else { - handler({ type, componentOptions, props }) - } - }) - } - - if (orders) { - let tmpPanes = [] - - orders.forEach((paneName) => { - let pane = panes.find((pane) => pane.name === paneName) - - if (pane) tmpPanes.push(pane) - }) - - panes = tmpPanes - } - - return panes -} - export default defineComponent({ name: $prefix + 'TabNav', components: { @@ -198,7 +148,7 @@ export default defineComponent({ ) } - const tabs = getOrderedPanes(state, panes).map((pane, index) => { + const tabs = panes.map((pane, index) => { let tabName = pane.name || pane.state.index || index const withClose = pane.state.isClosable || editable