diff --git a/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js b/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js index 28ba17c133..be789daf6c 100644 --- a/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js +++ b/packages/devui-vue/devui-cli/templates/vitepress-sidebar.js @@ -14,8 +14,8 @@ const { isReadyToRelease } = require('../shared/utils'); // return { text, link: `/${SITES_COMPONENTS_DIR_NAME}/${kebabCase(name)}/`, status } // } -function buildCategoryOptions(text, children = []) { - return { text, children }; +function buildCategoryOptions(text, items = []) { + return { text, items }; } function generateZhMenus(componentsInfo) { @@ -72,7 +72,7 @@ exports.createVitepressSidebarTemplates = (componentsInfo = []) => { }, { "text": "Design Token", - "children": DESIGN_TOKENS_INFO + "items": DESIGN_TOKENS_INFO }, ], handler: generateZhMenus, @@ -94,7 +94,7 @@ exports.createVitepressSidebarTemplates = (componentsInfo = []) => { }, { "text": "Design Token", - "children": DESIGN_TOKENS_INFO + "items": DESIGN_TOKENS_INFO }, ], handler: generateEnMenus, diff --git a/packages/devui-vue/devui/button/src/use-button.ts b/packages/devui-vue/devui/button/src/use-button.ts index e3d53c1dc7..b3066eb127 100644 --- a/packages/devui-vue/devui/button/src/use-button.ts +++ b/packages/devui-vue/devui/button/src/use-button.ts @@ -2,7 +2,7 @@ import { computed, inject } from 'vue'; import type { SetupContext } from 'vue'; import { ButtonProps, UseButtonReturnType, buttonGroupInjectionKey } from './button-types'; import { useNamespace } from '../../shared/hooks/use-namespace'; -import { isString } from 'lodash'; +import { isString } from 'lodash-es'; export default function useButton(props: ButtonProps, ctx: SetupContext): UseButtonReturnType { const ns = useNamespace('button'); diff --git a/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts b/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts index 199efa45ba..340bd1487a 100644 --- a/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts +++ b/packages/devui-vue/devui/cascader/hooks/use-cascader-item.ts @@ -1,7 +1,7 @@ /** * 处理cascader-item中需要的参数 */ -import { cloneDeep } from 'lodash'; +import { cloneDeep } from 'lodash-es'; import { ref, reactive, Ref } from 'vue'; import { CascaderProps, UseCascaderItemCallback, CascaderItem } from '../src/cascader-types'; diff --git a/packages/devui-vue/devui/cascader/hooks/use-cascader.ts b/packages/devui-vue/devui/cascader/hooks/use-cascader.ts index c689daa6eb..4fcc4d8984 100644 --- a/packages/devui-vue/devui/cascader/hooks/use-cascader.ts +++ b/packages/devui-vue/devui/cascader/hooks/use-cascader.ts @@ -1,5 +1,5 @@ import { ref, SetupContext, toRef, reactive, Ref, watch, onMounted } from 'vue'; -import { cloneDeep } from 'lodash'; +import { cloneDeep } from 'lodash-es'; import { initActiveIndexs, initSingleIptValue } from './use-cascader-single'; import { initMultipleCascaderItem, initTagList, getMultiModelValues } from './use-cascader-multiple'; import type { CascaderItem, CascaderValueType, CascaderProps, UseCascaderFn } from '../src/cascader-types'; diff --git a/packages/devui-vue/devui/cascader/hooks/use-filter.ts b/packages/devui-vue/devui/cascader/hooks/use-filter.ts index 8c789898f4..21eede8ff0 100644 --- a/packages/devui-vue/devui/cascader/hooks/use-filter.ts +++ b/packages/devui-vue/devui/cascader/hooks/use-filter.ts @@ -1,4 +1,4 @@ -import { debounce, cloneDeep } from 'lodash'; +import { debounce, cloneDeep } from 'lodash-es'; import { ref, SetupContext, UnwrapRef, Ref, watch } from 'vue'; import { initActiveIndexs } from './use-cascader-single'; import { diff --git a/packages/devui-vue/devui/cascader/src/cascader.tsx b/packages/devui-vue/devui/cascader/src/cascader.tsx index 9992a17029..0004d007ff 100644 --- a/packages/devui-vue/devui/cascader/src/cascader.tsx +++ b/packages/devui-vue/devui/cascader/src/cascader.tsx @@ -1,5 +1,5 @@ import { defineComponent, Transition, SetupContext, provide, Teleport, ref, computed } from 'vue'; -import { cloneDeep } from 'lodash'; +import { cloneDeep } from 'lodash-es'; import { useNamespace } from '../../shared/hooks/use-namespace'; import DCascaderList from '../components/cascader-list'; import DMultipleBox from '../components/cascader-multiple/index'; diff --git a/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts b/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts index 52431aca34..0577414f55 100644 --- a/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts +++ b/packages/devui-vue/devui/category-search/src/composables/use-category-search.ts @@ -1,6 +1,6 @@ import { ref, computed, toRefs, provide, watch, onMounted, reactive } from 'vue'; import type { Ref, SetupContext } from 'vue'; -import { mergeWith, cloneDeep, merge } from 'lodash'; +import { mergeWith, cloneDeep, merge } from 'lodash-es'; import RadioMenu from '../components/radio-menu'; import CheckboxMenu from '../components/checkbox-menu'; import LabelMenu from '../components/label-menu'; diff --git a/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts b/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts index 977cb57ae2..568a9682b4 100644 --- a/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts +++ b/packages/devui-vue/devui/code-editor/src/composables/use-code-editor.ts @@ -1,5 +1,5 @@ import { inBrowser } from '../../../shared/utils/common-var'; -import { throttle } from 'lodash'; +import { throttle } from 'lodash-es'; import { onBeforeMount, onMounted, ref, SetupContext, toRefs, nextTick, watch } from 'vue'; import { CodeEditorProps, Comment, Decoration, LayoutInfo, PositionInfo } from '../code-editor-types'; diff --git a/packages/devui-vue/devui/color-picker/src/color-picker.tsx b/packages/devui-vue/devui/color-picker/src/color-picker.tsx index 4bf9de0d99..4bce7cfcb1 100644 --- a/packages/devui-vue/devui/color-picker/src/color-picker.tsx +++ b/packages/devui-vue/devui/color-picker/src/color-picker.tsx @@ -1,7 +1,7 @@ import { defineComponent, ref, computed, onMounted, watch, nextTick, provide, unref, readonly, Transition } from 'vue'; import type { StyleValue, Ref } from 'vue'; import { computePosition, flip } from '@floating-ui/dom'; -import { throttle } from 'lodash'; +import { throttle } from 'lodash-es'; import { useReactive, colorPickerResize, isExhibitionColorPicker, changeColorValue } from './utils/composable'; import { colorPickerProps, ColorPickerProps } from './color-picker-types'; import colorPanel from './components/color-picker-panel/color-picker-panel'; diff --git a/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx b/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx index c76eb810f8..ffe92c610d 100644 --- a/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx +++ b/packages/devui-vue/devui/color-picker/src/components/color-history/color-history.tsx @@ -4,7 +4,7 @@ import { Icon } from '../../../../icon'; import './color-history.scss'; import { fromHexa } from '../../utils/color-utils'; import { ProvideColorOptions, ColorPickerColor } from '../../utils/color-utils-types'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; const STORAGE_KEY = 'STORAGE_COLOR_PICKER_HISTORY_KEY'; const MAX_HISTORY_COUNT = 8; diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts index 7d1c3588b8..c5f31e174d 100644 --- a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts +++ b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-scroll.ts @@ -1,6 +1,6 @@ import { ref, onMounted, inject } from 'vue'; import type { Ref } from 'vue'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; import { DataGridInjectionKey } from '../data-grid-types'; import type { InnerColumnConfig, InnerRowData, DataGridContext, ScrollYParams, ScrollXParams } from '../data-grid-types'; import { getXStartOrEndIndex, getYStartIndex } from '../utils'; diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts index bdd124fa88..01b6efd348 100644 --- a/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts +++ b/packages/devui-vue/devui/data-grid/src/composables/use-data-grid-tree.ts @@ -1,6 +1,6 @@ import { ref, toRefs } from 'vue'; import type { SetupContext } from 'vue'; -import { isFunction } from 'lodash'; +import { isFunction } from 'lodash-es'; import type { DataGridProps, InnerRowData, RowData, IExpandLoadMoreResult } from '../data-grid-types'; import { generateInnerData } from '../utils'; diff --git a/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts b/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts index b61198f057..8a08b3f96d 100644 --- a/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts +++ b/packages/devui-vue/devui/data-grid/src/composables/use-overflow-tooltip.ts @@ -1,5 +1,5 @@ import { ref } from 'vue'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; import type { Placement } from '../../../overlay'; import type { InnerColumnConfig } from '../data-grid-types'; diff --git a/packages/devui-vue/devui/data-grid/src/utils.ts b/packages/devui-vue/devui/data-grid/src/utils.ts index e7947f7f77..ba94a13dc3 100644 --- a/packages/devui-vue/devui/data-grid/src/utils.ts +++ b/packages/devui-vue/devui/data-grid/src/utils.ts @@ -1,6 +1,6 @@ import { v4 as uuidv4 } from 'uuid'; import type { Ref } from 'vue'; -import { isFunction } from 'lodash'; +import { isFunction } from 'lodash-es'; import type { RowData, InnerRowData, RowKey, InnerColumnConfig, ColumnConfig } from './data-grid-types'; import { ColumnMinWidth } from './const'; diff --git a/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts b/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts index a68bd21e4e..72dac6bbd3 100644 --- a/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts +++ b/packages/devui-vue/devui/date-picker-pro/src/composables/use-calendar-panel.ts @@ -4,7 +4,7 @@ import { DAY_DURATION, calendarItemHeight } from '../const'; import { CalendarDateItem, YearAndMonthItem, UseCalendarPanelReturnType, DatePickerProPanelProps } from '../date-picker-pro-types'; import dayjs from 'dayjs'; import type { Dayjs } from 'dayjs'; -import { throttle } from 'lodash'; +import { throttle } from 'lodash-es'; import useCalendarSelected from './use-calendar-selected'; export default function useCalendarPanel(props: DatePickerProPanelProps, ctx: SetupContext): UseCalendarPanelReturnType { diff --git a/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts b/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts index dfe333200c..b8d08d5c27 100644 --- a/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts +++ b/packages/devui-vue/devui/date-picker-pro/src/composables/use-month-calendar-panel.ts @@ -3,7 +3,7 @@ import type { SetupContext } from 'vue'; import { useNamespace } from '../../../shared/hooks/use-namespace'; import { monthCalendarItemHeight } from '../const'; import { DatePickerProPanelProps, YearAndMonthItem, UseMonthCalendarPanelReturnType } from '../date-picker-pro-types'; -import { throttle } from 'lodash'; +import { throttle } from 'lodash-es'; import dayjs from 'dayjs'; import type { Dayjs } from 'dayjs'; import useCalendarSelected from './use-calendar-selected'; diff --git a/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts b/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts index e86a94ac0f..c5f226586d 100644 --- a/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts +++ b/packages/devui-vue/devui/date-picker-pro/src/composables/use-year-calendar-panel.ts @@ -1,6 +1,6 @@ import { ref, onBeforeMount, nextTick, watch } from 'vue'; import type { SetupContext } from 'vue'; -import { chunk } from 'lodash'; +import { chunk } from 'lodash-es'; import { useNamespace } from '../../../shared/hooks/use-namespace'; import { DatePickerProPanelProps, UseYearCalendarPanelReturnType } from '../date-picker-pro-types'; import dayjs from 'dayjs'; diff --git a/packages/devui-vue/devui/echarts/src/echarts.tsx b/packages/devui-vue/devui/echarts/src/echarts.tsx index 5b2465925d..324ef66f39 100644 --- a/packages/devui-vue/devui/echarts/src/echarts.tsx +++ b/packages/devui-vue/devui/echarts/src/echarts.tsx @@ -1,9 +1,7 @@ -import { defineComponent, onMounted, onUnmounted, ref } from "vue"; -import { DevuiChartProps, devuiChartProps } from "./echarts-types"; -import * as echarts from 'echarts'; -import { DEVUI_ECHART_THEME } from "./echarts-theme"; -import { toRefs } from "@vueuse/core"; - +import { defineComponent, onMounted, onUnmounted, ref } from 'vue'; +import { DevuiChartProps, devuiChartProps } from './echarts-types'; +import { DEVUI_ECHART_THEME } from './echarts-theme'; +import { toRefs } from '@vueuse/core'; export default defineComponent({ name: 'DChart', @@ -19,6 +17,12 @@ export default defineComponent({ const chartRef = ref(); + // dynamic import echarts + let echarts: unknown; + if (typeof window !== 'undefined') { + echarts = import('echarts'); + } + const themeChange = () => { isDark = !!themeService?.currentTheme?.isDark; theme = isDark ? DEVUI_ECHART_THEME.defaultDarkTheme : DEVUI_ECHART_THEME.defaultLightTheme; @@ -44,7 +48,7 @@ export default defineComponent({ theme = isDark ? DEVUI_ECHART_THEME.defaultDarkTheme : DEVUI_ECHART_THEME.defaultLightTheme; echartInstacne = echarts.init(chartRef.value, theme); - if(themeService) { + if (themeService) { themeService.eventBus.add('themeChanged', themeChange); } @@ -56,14 +60,12 @@ export default defineComponent({ onUnmounted(() => { echartInstacne?.dispatchAction({ - type: 'hideTip' + type: 'hideTip', }); themeService.eventBus.remove('themeChanged', themeChange); }); - return () => ( -
- ); - } + return () =>
; + }, }); diff --git a/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx b/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx index df31fca66e..2b1d757c87 100644 --- a/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx +++ b/packages/devui-vue/devui/editable-select/src/components/dropdown/dropdown.tsx @@ -4,7 +4,7 @@ import { EditableSelectContext, Option as O, SELECT_KEY } from '../../editable-s import Option from '../option/option'; import Loading from '../../../../loading/src/loading-directive'; import { useNamespace } from '../../../../shared/hooks/use-namespace'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; export default defineComponent({ name: 'DEditableSelectDropdown', diff --git a/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts b/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts index 9e80e4f056..04d3442358 100644 --- a/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts +++ b/packages/devui-vue/devui/editable-select/src/composables/use-input-event.ts @@ -1,5 +1,5 @@ import { computed, Ref, SetupContext } from 'vue'; -import { debounce, isFunction } from 'lodash'; +import { debounce, isFunction } from 'lodash-es'; import { EditableSelectProps } from '../editable-select-types'; import { States } from './use-select'; diff --git a/packages/devui-vue/devui/editable-select/src/composables/use-select.ts b/packages/devui-vue/devui/editable-select/src/composables/use-select.ts index 6b7f9969da..c64b61e3f0 100644 --- a/packages/devui-vue/devui/editable-select/src/composables/use-select.ts +++ b/packages/devui-vue/devui/editable-select/src/composables/use-select.ts @@ -1,7 +1,7 @@ import { computed, ComputedRef, getCurrentInstance, nextTick, onMounted, reactive, ref, Ref, SetupContext, watch } from 'vue'; import { EditableSelectProps, Option, Options } from '../editable-select-types'; import { createI18nTranslate } from '../../../locale/create'; -import { isFunction, isNil } from 'lodash'; +import { isFunction, isNil } from 'lodash-es'; export interface UseSelectStatesReturnType { hoveringIndex: number; diff --git a/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts b/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts index e3e3a688da..31e58de881 100644 --- a/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts +++ b/packages/devui-vue/devui/editor-md/src/composables/md-render-service.ts @@ -1,10 +1,12 @@ import hljs from 'highlight.js'; import MarkdownIt from 'markdown-it'; -import { filterXSS, getDefaultCSSWhiteList, getDefaultWhiteList, IWhiteList } from 'xss'; +import pkg from 'xss'; import { mermaidRender, refreshMermaid } from '../plugins/mermaid'; import tocAndAnchor from '../plugins/toc'; import type { MdPlugin, ICustomXssRule, ICustomRenderRule } from '../editor-md-types'; +const { filterXSS, getDefaultWhiteList, getDefaultCSSWhiteList, IWhiteList } = pkg; + export class MDRenderService { private xssWhiteList = getDefaultWhiteList(); private cssWhiteList = getDefaultCSSWhiteList(); @@ -19,7 +21,7 @@ export class MDRenderService { } return ''; }, - }) as any; + }); private baseUrl = ''; private breaks = true; private renderParse: Function | undefined; @@ -50,27 +52,27 @@ export class MDRenderService { this.xssWhiteList['td'] = ['style']; } - setBaseUrl(url: string) { + setBaseUrl(url: string): void { this.baseUrl = url; } - setBreaks(breaks: boolean) { + setBreaks(breaks: boolean): void { this.breaks = breaks; } - setRenderParse(func: Function) { + setRenderParse(func: Function): void { this.renderParse = func; } - getXssWhiteList() { + getXssWhiteList(): IWhiteList { return this.xssWhiteList; } - setXssWhiteList(list: IWhiteList) { + setXssWhiteList(list: IWhiteList): void { this.xssWhiteList = list; } - setCustomXssRules(rules: ICustomXssRule[]) { + setCustomXssRules(rules: ICustomXssRule[]): void { if (rules) { rules.forEach((rule) => { if (rule['value'] === null) { @@ -82,7 +84,7 @@ export class MDRenderService { } } - setCustomRendererRules(rules: ICustomRenderRule[]) { + setCustomRendererRules(rules: ICustomRenderRule[]): void { if (rules) { rules.forEach((rule) => { this.mdt.renderer.rules[rule['key']] = rule['value']; @@ -90,11 +92,11 @@ export class MDRenderService { } } - setOptions(options = {}) { + setOptions(options = {}): void { this.mdt.set(options); } - setPlugins(plugins: Array) { + setPlugins(plugins: Array): void { plugins.forEach((item) => { const { plugin, opts } = item; this.mdt.use(plugin, opts); @@ -125,7 +127,7 @@ export class MDRenderService { }); } - generateHTML(text: string) { + generateHTML(text: string): string { this.mdt.set({ breaks: this.breaks, }); @@ -156,7 +158,7 @@ export class MDRenderService { return this.replaceInternalUrl(html); } - public setRules(mdRules: Record): void { + public setRules(mdRules: Record): void { if (mdRules) { Object.keys(mdRules).forEach((rule) => { this.mdt[rule].set(mdRules[rule]); diff --git a/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts b/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts index 65d0c0a00e..a7ecd87342 100644 --- a/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts +++ b/packages/devui-vue/devui/editor-md/src/composables/use-editor-md.ts @@ -1,11 +1,10 @@ -import cloneDeep from 'lodash/cloneDeep'; +import { throttle, cloneDeep }from 'lodash-es'; import { computed, nextTick, onMounted, reactive, Ref, ref, SetupContext, toRefs, watch, onBeforeUnmount } from 'vue'; import { debounce } from '../../../shared/utils'; import { EditorMdProps, Mode } from '../editor-md-types'; import { DEFAULT_TOOLBARS } from '../toolbar-config'; import { parseHTMLStringToDomList } from '../utils'; import { refreshEditorCursor, _enforceMaxLength } from './helper'; -import { throttle } from 'lodash'; export function useEditorMd(props: EditorMdProps, ctx: SetupContext) { const { diff --git a/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts b/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts index 83b62c9207..018c556845 100644 --- a/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts +++ b/packages/devui-vue/devui/editor-md/src/plugins/checkbox.ts @@ -1,4 +1,4 @@ -import { extend } from 'lodash'; +import { extend } from 'lodash-es'; const checkboxReplace = function (md: any, options: any) { let lastId: number; diff --git a/packages/devui-vue/devui/editor-md/src/plugins/toc.ts b/packages/devui-vue/devui/editor-md/src/plugins/toc.ts index 19a8cbdb3b..d9da947334 100644 --- a/packages/devui-vue/devui/editor-md/src/plugins/toc.ts +++ b/packages/devui-vue/devui/editor-md/src/plugins/toc.ts @@ -1,4 +1,4 @@ -import cloneDeep from 'lodash/cloneDeep'; +import { cloneDeep }from 'lodash-es'; import Token from 'markdown-it/lib/token'; const TOC = '[toc]'; diff --git a/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts b/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts index 69403c4424..5bd51a2096 100644 --- a/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts +++ b/packages/devui-vue/devui/form/src/components/form-item/use-form-item.ts @@ -1,5 +1,5 @@ import { computed, inject, nextTick, onMounted, ref } from 'vue'; -import { castArray, get, isFunction, clone, isEqual, set } from 'lodash'; +import { castArray, get, isFunction, clone, isEqual, set } from 'lodash-es'; import Schema from 'async-validator'; import type { ComputedRef, Ref } from 'vue'; import type { RuleItem } from 'async-validator'; diff --git a/packages/devui-vue/devui/form/src/composables/use-form-validation.ts b/packages/devui-vue/devui/form/src/composables/use-form-validation.ts index 3876f7e6a5..d3e4178b94 100644 --- a/packages/devui-vue/devui/form/src/composables/use-form-validation.ts +++ b/packages/devui-vue/devui/form/src/composables/use-form-validation.ts @@ -1,4 +1,4 @@ -import { castArray } from 'lodash'; +import { castArray } from 'lodash-es'; import type { ValidateFieldsError } from 'async-validator'; import { UseFormValidation } from '../form-types'; import { FormItemContext, FormValidateCallback, FormValidateResult } from '../components/form-item/form-item-types'; diff --git a/packages/devui-vue/devui/git-graph/src/git-graph-class.ts b/packages/devui-vue/devui/git-graph/src/git-graph-class.ts index c620811109..1506b6209a 100644 --- a/packages/devui-vue/devui/git-graph/src/git-graph-class.ts +++ b/packages/devui-vue/devui/git-graph/src/git-graph-class.ts @@ -1,4 +1,4 @@ -import { cloneDeep } from "lodash"; +import { cloneDeep } from "lodash-es"; import { CommitInfo, GitGraphData } from "./git-graph-types"; export class GitGraph { diff --git a/packages/devui-vue/devui/mention/src/mention.tsx b/packages/devui-vue/devui/mention/src/mention.tsx index 9b96511ca3..de5aa717a2 100644 --- a/packages/devui-vue/devui/mention/src/mention.tsx +++ b/packages/devui-vue/devui/mention/src/mention.tsx @@ -4,7 +4,7 @@ import DTextarea from '../../textarea/src/textarea'; import DIcon from '../../icon/src/icon'; import './mention.scss'; import { useNamespace } from '../../shared/hooks/use-namespace'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; export default defineComponent({ name: 'DMention', diff --git a/packages/devui-vue/devui/popover/src/use-popover.ts b/packages/devui-vue/devui/popover/src/use-popover.ts index 16face2c76..9a8d0f47c8 100644 --- a/packages/devui-vue/devui/popover/src/use-popover.ts +++ b/packages/devui-vue/devui/popover/src/use-popover.ts @@ -1,6 +1,6 @@ import { toRefs, ref, computed, watch, onUnmounted, onMounted } from 'vue'; import type { Ref, ComputedRef } from 'vue'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; import { PopoverProps, UsePopoverEvent } from './popover-types'; const TransformOriginMap: Record = { diff --git a/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx b/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx index 7a686ba11c..d580518a2a 100644 --- a/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx +++ b/packages/devui-vue/devui/quadrant-diagram/src/components/axis/index.tsx @@ -2,7 +2,7 @@ import { defineComponent, toRefs, onMounted, reactive, ref, watch } from 'vue'; import { IAxisConfigs, IViewConfigs } from '../../../type'; import { AXIS_TITLE_SPACE } from '../../../config'; import { quadrantDiagramAxisProps, QuadrantDiagramAxisProps } from './types'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; import './index.scss'; diff --git a/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts b/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts index 220f65693e..684350795d 100644 --- a/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts +++ b/packages/devui-vue/devui/search/src/composables/use-search-keydown.ts @@ -3,7 +3,7 @@ */ import { SetupContext, Ref } from 'vue'; import { KeydownReturnTypes, SearchProps } from '../search-types'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; type EmitProps = 'update:modelValue' | 'search'; diff --git a/packages/devui-vue/devui/select/src/composables/use-select-content.ts b/packages/devui-vue/devui/select/src/composables/use-select-content.ts index 7936c16c55..03df4044e5 100644 --- a/packages/devui-vue/devui/select/src/composables/use-select-content.ts +++ b/packages/devui-vue/devui/select/src/composables/use-select-content.ts @@ -4,7 +4,7 @@ import { FORM_ITEM_TOKEN } from '../../../form'; import { OptionObjectItem } from '../select-types'; import { useNamespace } from '../../../shared/hooks/use-namespace'; import { className } from '../utils'; -import { isFunction } from 'lodash'; +import { isFunction } from 'lodash-es'; import { createI18nTranslate } from '../../../locale/create'; export default function useSelectContent() { diff --git a/packages/devui-vue/devui/select/src/use-select.ts b/packages/devui-vue/devui/select/src/use-select.ts index b9c72aedb3..652abc6182 100644 --- a/packages/devui-vue/devui/select/src/use-select.ts +++ b/packages/devui-vue/devui/select/src/use-select.ts @@ -4,7 +4,7 @@ import { SelectProps, OptionObjectItem } from './select-types'; import { className, KeyType } from './utils'; import { useNamespace } from '../../shared/hooks/use-namespace'; import { onClickOutside } from '@vueuse/core'; -import { isFunction, debounce } from 'lodash'; +import { isFunction, debounce } from 'lodash-es'; import { FORM_ITEM_TOKEN, FORM_TOKEN } from '../../form'; export default function useSelect( diff --git a/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts b/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts index 583a31ec46..3c39ff1e29 100644 --- a/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts +++ b/packages/devui-vue/devui/textarea/src/composables/use-textarea-autosize.ts @@ -1,7 +1,7 @@ import { computed, ShallowRef, shallowRef } from 'vue'; import { TextareaProps, UseTextareaAutosize } from '../textarea-types'; import type { StyleValue } from 'vue'; -import { isObject } from 'lodash'; +import { isObject } from 'lodash-es'; import { computeTextareaHeight } from '../utils'; export function useTextareaAutosize(props: TextareaProps, textarea: ShallowRef): UseTextareaAutosize { diff --git a/packages/devui-vue/devui/textarea/src/utils.ts b/packages/devui-vue/devui/textarea/src/utils.ts index 9f37e03a11..d684d39e59 100644 --- a/packages/devui-vue/devui/textarea/src/utils.ts +++ b/packages/devui-vue/devui/textarea/src/utils.ts @@ -1,4 +1,4 @@ -import { isNumber } from 'lodash'; +import { isNumber } from 'lodash-es'; let tempTextarea: HTMLTextAreaElement | undefined = undefined; diff --git a/packages/devui-vue/devui/tooltip/src/use-tooltip.ts b/packages/devui-vue/devui/tooltip/src/use-tooltip.ts index 1b97c5d66f..d62f3e670e 100644 --- a/packages/devui-vue/devui/tooltip/src/use-tooltip.ts +++ b/packages/devui-vue/devui/tooltip/src/use-tooltip.ts @@ -1,6 +1,6 @@ import { onMounted, ref, toRefs, computed, watch } from 'vue'; import type { Ref } from 'vue'; -import { debounce } from 'lodash'; +import { debounce } from 'lodash-es'; import { TooltipProps, BasePlacement, UseTooltipFn } from './tooltip-types'; export const transformOriginMap: Record = { diff --git a/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts b/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts index d4ff239063..22d28ef9d5 100644 --- a/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts +++ b/packages/devui-vue/devui/tree/src/composables/use-dragdrop.ts @@ -2,7 +2,7 @@ import { reactive, computed } from 'vue'; import type { Ref } from 'vue'; import type { TreeProps } from '../tree-types'; import type { DragState, IUseDraggable, IDropNode, IInnerTreeNode, ITreeNode, IDropType } from './use-tree-types'; -import cloneDeep from 'lodash/cloneDeep'; +import { cloneDeep }from 'lodash-es'; import { useNamespace } from '../../../shared/hooks/use-namespace'; import { formatBasicTree } from '../utils'; const ns = useNamespace('tree'); diff --git a/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts b/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts index b835830a89..d05d867a07 100644 --- a/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts +++ b/packages/devui-vue/devui/tree/src/composables/use-search-filter.ts @@ -1,6 +1,6 @@ import { Ref, ref } from 'vue'; import { IInnerTreeNode, IUseCore, IUseSearchFilter, SearchFilterOption } from './use-tree-types'; -import { trim } from 'lodash'; +import { trim } from 'lodash-es'; export function useSearchFilter() { return function useSearchFilterFn(data: Ref, core: IUseCore): IUseSearchFilter { const { clearNodeMap, getExpendedTree } = core; diff --git a/packages/devui-vue/docs/.vitepress/.gitignore b/packages/devui-vue/docs/.vitepress/.gitignore new file mode 100644 index 0000000000..e3990ffb70 --- /dev/null +++ b/packages/devui-vue/docs/.vitepress/.gitignore @@ -0,0 +1,2 @@ +cache +.temp \ No newline at end of file diff --git a/packages/devui-vue/docs/.vitepress/config.js b/packages/devui-vue/docs/.vitepress/config.js deleted file mode 100644 index 1fe86bc36a..0000000000 --- a/packages/devui-vue/docs/.vitepress/config.js +++ /dev/null @@ -1,4 +0,0 @@ -require('esbuild-register') - -const config = require('./config/index.ts') -module.exports = config.default \ No newline at end of file diff --git a/packages/devui-vue/docs/.vitepress/config.mts b/packages/devui-vue/docs/.vitepress/config.mts new file mode 100644 index 0000000000..89bddc7500 --- /dev/null +++ b/packages/devui-vue/docs/.vitepress/config.mts @@ -0,0 +1,57 @@ +import { defineConfig } from 'vitepress'; +import head from './config/head'; +import nav from './config/nav'; +import sidebar from './config/sidebar'; +import { demoblockPlugin, demoblockVitePlugin } from 'vitepress-theme-demoblock'; + +// https://vitepress.dev/reference/site-config +export default defineConfig({ + title: 'Vue DevUI', + description: 'Vue DevUI 组件库', + + head, + markdown: { + headers: true, + config: (md) => { + md.use(demoblockPlugin as any); + }, + }, + vite: { + plugins: [demoblockVitePlugin() as any], + }, + + locales: { + root: { + label: '简体中文', + lang: 'zh-CN', + }, + en: { + label: 'English', + lang: 'en-US', + link: '/en-US/', + }, + }, + + themeConfig: { + // https://vitepress.dev/reference/default-theme-config + nav, + sidebar, + + logo: '../../assets/logo.svg', + + algolia: { + appId: 'HOQD3NUZNM', + apiKey: '07456b4a262e8c84eb892088e5cc3791', + indexName: 'vue-devui', + }, + + socialLinks: [{ icon: 'github', link: 'https://github.com/DevCloudFE/vue-devui' }], + + footer: { + message: 'MIT Licensed', + copyright: 'Copyright © 2021-present DevCloudFE', + }, + }, + + ignoreDeadLinks: 'localhostLinks', +}); diff --git a/packages/devui-vue/docs/.vitepress/config/index.ts b/packages/devui-vue/docs/.vitepress/config/index.ts deleted file mode 100644 index 851b8b4c56..0000000000 --- a/packages/devui-vue/docs/.vitepress/config/index.ts +++ /dev/null @@ -1,46 +0,0 @@ -import { defineConfig } from 'vitepress' -import sidebar from './sidebar' -import head from './head' -import nav from './nav' -import markdown from './markdown' -import lang from './lang' - -const config = defineConfig({ - title: 'Vue DevUI', - description: 'Vue DevUI 组件库', - head, - markdown, - locales: { - '/': { - lang: 'zh-CN', - label: '简体中文' - }, - '/en-US': { - lang: 'en-US', - label: 'English' - } - }, - themeConfig: { - sidebar, - nav, - demoblock: lang, - logo: '../../assets/logo.svg', - locales: { - '/': { - lang: 'zh-CN', - label: '简体中文' - }, - '/en-US': { - lang: 'en-US', - label: 'English' - } - }, - algolia: { - appId: 'HOQD3NUZNM', - apiKey: '07456b4a262e8c84eb892088e5cc3791', - indexName: 'vue-devui' - } - } -}) - -export default config diff --git a/packages/devui-vue/docs/.vitepress/config/lang.ts b/packages/devui-vue/docs/.vitepress/config/lang.ts deleted file mode 100644 index 8280942417..0000000000 --- a/packages/devui-vue/docs/.vitepress/config/lang.ts +++ /dev/null @@ -1,16 +0,0 @@ -const lang = { - '/': { - 'hide-text': '隐藏代码', - 'show-text': '显示代码', - 'copy-button-text': '复制代码片段', - 'copy-success-text': '复制成功', - }, - '/en-US': { - 'hide-text': 'Hide', - 'show-text': 'Expand', - 'copy-button-text': 'Copy', - 'copy-success-text': 'Copy Success', - }, -}; - -export default lang; diff --git a/packages/devui-vue/docs/.vitepress/config/markdown.ts b/packages/devui-vue/docs/.vitepress/config/markdown.ts deleted file mode 100644 index 476f03037c..0000000000 --- a/packages/devui-vue/docs/.vitepress/config/markdown.ts +++ /dev/null @@ -1,14 +0,0 @@ -const options = { cssPreprocessor: 'scss' }; -import { blockPlugin } from '../plugins/block-plugin'; -import { renderPlugin, codePlugin } from 'vitepress-theme-demoblock'; - -const markdown = { - config: (md) => { - md.use((curMd) => { - curMd.use(blockPlugin, options); - curMd.use(codePlugin, options); - curMd.use(renderPlugin, options); - }); - } -} -export default markdown; diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue index 63d0d01869..42c0902a8d 100644 --- a/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue +++ b/packages/devui-vue/docs/.vitepress/devui-theme/Layout.vue @@ -10,16 +10,15 @@ import HomeFooter from './components/HomeFooter.vue'; import DevuiFooter from './components/DevuiFooter.vue'; import { CONTRIBUTORS_MAP } from './components/PageContributorConfig'; import PageContributor from './components/PageContributor.vue'; +// @ts-ignore - @devui/button sometimes unable to resolve by editor import { Button } from '@devui/button'; import { LANG_KEY, ZH_CN, EN_US } from './const'; const Home = defineAsyncComponent(() => import('./components/Home.vue')); -const NoopComponent = () => null; - -const CarbonAds = __CARBON__ ? defineAsyncComponent(() => import('./components/CarbonAds.vue')) : NoopComponent; -const BuySellAds = __BSA__ ? defineAsyncComponent(() => import('./components/BuySellAds.vue')) : NoopComponent; -const AlgoliaSearchBox = __ALGOLIA__ ? defineAsyncComponent(() => import('./components/AlgoliaSearchBox.vue')) : NoopComponent; +const CarbonAds = defineAsyncComponent(() => import('./components/CarbonAds.vue')); +const BuySellAds = defineAsyncComponent(() => import('./components/BuySellAds.vue')); +const AlgoliaSearchBox = defineAsyncComponent(() => import('./components/AlgoliaSearchBox.vue')); // generic state const route = useRoute(); @@ -29,9 +28,9 @@ const router = useRouter(); // custom layout const isCustomLayout = computed(() => !!frontmatter.value.customLayout); // home -const enableHome = computed(() => !!frontmatter.value.home); +const enableHome = computed(() => !!frontmatter.value.layout); -// automatic multilang check for AlgoliaSearchBox +// automatic multi-lang check for AlgoliaSearchBox const isMultiLang = computed(() => Object.keys(theme.value.locales || {}).length > 0); // navbar @@ -47,7 +46,7 @@ const showNavbar = computed(() => { const openSideBar = ref(false); const showSidebar = computed(() => { - if (frontmatter.value.home || frontmatter.value.sidebar === false) { + if (frontmatter.value.layout || frontmatter.value.sidebar === false) { return false; } @@ -182,7 +181,8 @@ const contributors = computed(() => { @@ -313,21 +310,21 @@ body[ui-theme='galaxy-theme'] { } .page-contributor { - & > a > span { + &>a>span { margin: 0 12px 8px 0 !important; - & > img, + &>img, & svg { width: 40px !important; height: 40px !important; } } - & > a:nth-child(8n) > span { + &>a:nth-child(8n)>span { margin: 0 12px 8px 0 !important; } - & > a:nth-child(7n) > span { + &>a:nth-child(7n)>span { margin: 0 !important; } } @@ -338,11 +335,11 @@ body[ui-theme='galaxy-theme'] { @media (max-width: 385px) { .container-contributors .contributors-inner { .page-contributor { - & > a:nth-child(7n) > span { + &>a:nth-child(7n)>span { margin: 0 12px 8px 0 !important; } - & > a:nth-child(6n) > span { + &>a:nth-child(6n)>span { margin: 0 !important; } } @@ -353,11 +350,11 @@ body[ui-theme='galaxy-theme'] { @media (max-width: 330px) { .container-contributors .contributors-inner { .page-contributor { - & > a:nth-child(6n) > span { + &>a:nth-child(6n)>span { margin: 0 12px 8px 0 !important; } - & > a:nth-child(5n) > span { + &>a:nth-child(5n)>span { margin: 0 !important; } } diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue b/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue index 8c200837bf..8f44932ef2 100644 --- a/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue +++ b/packages/devui-vue/docs/.vitepress/devui-theme/components/BackToTop.vue @@ -22,7 +22,7 @@ - ` - : ''; +${code} +`; + } return { - code: `${setup}\n${code}`, + code, }; }, }; diff --git a/packages/devui-vue/docs/.vitepress/theme/index.ts b/packages/devui-vue/docs/.vitepress/theme/index.ts index d77decc5af..26c872823b 100644 --- a/packages/devui-vue/docs/.vitepress/theme/index.ts +++ b/packages/devui-vue/docs/.vitepress/theme/index.ts @@ -1,13 +1,19 @@ +// https://vitepress.dev/guide/custom-theme +import { h } from 'vue'; +import type { Theme } from 'vitepress'; +import DefaultTheme from 'vitepress/theme'; +import 'vitepress-theme-demoblock/dist/theme/styles/index.css'; +import { useComponents } from './useComponents'; + import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'; import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker'; import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker'; import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker'; import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker'; + import DevUI from '../../../devui/vue-devui'; import Locale from '../../../devui/locale'; -import Theme from '../devui-theme'; -import 'vitepress-theme-demoblock/theme/styles/index.css'; -import { registerComponents } from './register-components.js'; +import DevUITheme from '../devui-theme'; import { insertBaiduScript } from './insert-baidu-script'; if (typeof window !== 'undefined') { @@ -31,10 +37,17 @@ if (typeof window !== 'undefined') { } export default { - ...Theme, - enhanceApp({ app }) { - app.use(Locale).use(DevUI); - registerComponents(app); + extends: DevUITheme, + Layout: () => { + return h(DevUITheme.Layout ?? DefaultTheme.Layout, null, { + // https://vitepress.dev/guide/extending-default-theme#layout-slots + }); + }, + enhanceApp(ctx) { + DefaultTheme.enhanceApp(ctx); + useComponents(ctx.app); + ctx.app.use(Locale); + ctx.app.use(DevUI); insertBaiduScript(); }, -}; +} satisfies Theme; diff --git a/packages/devui-vue/docs/.vitepress/theme/useComponents.js b/packages/devui-vue/docs/.vitepress/theme/useComponents.js new file mode 100644 index 0000000000..b6ad35f8bf --- /dev/null +++ b/packages/devui-vue/docs/.vitepress/theme/useComponents.js @@ -0,0 +1,8 @@ +// Don't remove this file, because it registers the demo components. +import Demo from 'vitepress-theme-demoblock/dist/client/components/Demo.vue' +import DemoBlock from 'vitepress-theme-demoblock/dist/client/components/DemoBlock.vue' + +export function useComponents(app) { + app.component('Demo', Demo) + app.component('DemoBlock', DemoBlock) +} diff --git a/packages/devui-vue/docs/components/accordion/index.md b/packages/devui-vue/docs/components/accordion/index.md index 921c449344..400c88bb40 100644 --- a/packages/devui-vue/docs/components/accordion/index.md +++ b/packages/devui-vue/docs/components/accordion/index.md @@ -2,9 +2,9 @@ 为页面提供导航的组件。 -#### 何时使用 - +:::tip 何时使用 需要通过分组组织菜单的时候使用。 +::: ### 基本用法 diff --git a/packages/devui-vue/docs/components/badge/index.md b/packages/devui-vue/docs/components/badge/index.md index 22eef59859..7232c8e2c8 100644 --- a/packages/devui-vue/docs/components/badge/index.md +++ b/packages/devui-vue/docs/components/badge/index.md @@ -2,13 +2,17 @@ 图标右上角的圆形徽标数字。 -#### 何时使用 - +:::tip 何时使用 出现在图标右上角或列表项右方,通过不同的状态色加数字提示用户有消息需要处理时。 +::: + +## 用法 ### 基本徽章 -::: demo 基本徽章类型,当有包裹元素时在右上角显示徽章和数目。 +基本徽章类型,当有包裹元素时在右上角显示徽章和数目。 + +::: demo ```vue