z9130
/
pansoft-plrl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: all icons used in the core are offline (#4173) 

* perf: all icons used in the core are offline

* chore: update default icon

* chore: update shadow
This commit is contained in:
Vben 2024-08-17 21:11:07 +08:00 committed by GitHub
parent 66808582ff
commit 3c17f4e9f8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
30 changed files with 320 additions and 347 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web-antd/src/router/routes/modules/vben.ts
View File

@ -26,7 +26,7 @@ const routes: RouteRecordRaw[] = [
{
name: 'VbenAbout',
path: '/vben-admin/about',
component: () => import('#/views/_core/vben/about/index.vue'),
component: () => import('#/views/_core/about/index.vue'),
meta: {
icon: 'lucide:copyright',
title: $t('page.vben.about'),

0
apps/web-antd/src/views/_core/vben/about/index.vue → apps/web-antd/src/views/_core/about/index.vue
View File

2
apps/web-ele/src/router/routes/modules/vben.ts
View File

@ -26,7 +26,7 @@ const routes: RouteRecordRaw[] = [
{
name: 'VbenAbout',
path: '/vben-admin/about',
component: () => import('#/views/_core/vben/about/index.vue'),
component: () => import('#/views/_core/about/index.vue'),
meta: {
icon: 'lucide:copyright',
title: $t('page.vben.about'),

0
apps/web-ele/src/views/_core/vben/about/index.vue → apps/web-ele/src/views/_core/about/index.vue
View File

2
apps/web-naive/src/router/routes/modules/vben.ts
View File

@ -26,7 +26,7 @@ const routes: RouteRecordRaw[] = [
{
name: 'VbenAbout',
path: '/vben-admin/about',
component: () => import('#/views/_core/vben/about/index.vue'),
component: () => import('#/views/_core/about/index.vue'),
meta: {
icon: 'lucide:copyright',
title: $t('page.vben.about'),

0
apps/web-naive/src/views/_core/vben/about/index.vue → apps/web-naive/src/views/_core/about/index.vue
View File

2
docs/package.json
View File

@ -13,7 +13,7 @@
"devDependencies": {
"@nolebase/vitepress-plugin-git-changelog": "^2.4.0",
"@vite-pwa/vitepress": "^0.5.0",
"vitepress": "^1.3.2",
"vitepress": "^1.3.3",
"vue": "^3.4.37"
}
}

2
docs/src/guide/essentials/route.md
View File

@ -64,7 +64,7 @@ const routes: RouteRecordRaw[] = [
{
name: 'VbenAbout',
path: '/vben-admin/about',
component: () => import('#/views/_core/vben/about/index.vue'),
component: () => import('#/views/_core/about/index.vue'),
meta: {
badgeType: 'dot',
badgeVariants: 'destructive',

2
internal/tailwind-config/package.json
View File

@ -46,7 +46,7 @@
"tailwindcss": "^3.4.3"
},
"dependencies": {
"@iconify/json": "^2.2.237",
"@iconify/json": "^2.2.238",
"@iconify/tailwind": "^1.1.2",
"@tailwindcss/nesting": "0.0.0-insiders.565cd3e",
"@tailwindcss/typography": "^0.5.14",

4
package.json
View File

@ -60,7 +60,7 @@
"@changesets/cli": "^2.27.7",
"@ls-lint/ls-lint": "^2.2.3",
"@types/jsdom": "^21.1.7",
"@types/node": "^22.3.0",
"@types/node": "^22.4.0",
"@vben/commitlint-config": "workspace:*",
"@vben/eslint-config": "workspace:*",
"@vben/prettier-config": "workspace:*",
@ -75,7 +75,7 @@
"@vue/test-utils": "^2.4.6",
"autoprefixer": "^10.4.20",
"cross-env": "^7.0.3",
"cspell": "^8.13.3",
"cspell": "^8.14.1",
"husky": "^9.1.4",
"is-ci": "^3.0.1",
"jsdom": "^24.1.1",

2
packages/@core/base/icons/src/create-icon.ts
View File

@ -4,7 +4,7 @@ import { Icon } from '@iconify/vue';
function createIconifyIcon(icon: string) {
return defineComponent({
name: `SvgIcon-${icon}`,
name: `Icon-${icon}`,
setup(props, { attrs }) {
return () => h(Icon, { icon, ...props, ...attrs });
},

1
packages/@core/base/icons/src/index.ts
View File

@ -1,5 +1,4 @@
export * from './create-icon';
export * from './lucide';
export * from './mdi';
export * from '@iconify/vue';

8
packages/@core/base/icons/src/lucide.ts
View File

@ -1,7 +1,9 @@
export {
ArrowDown,
ArrowLeft,
ArrowLeftFromLine as MdiMenuOpen,
ArrowLeftToLine,
ArrowRightFromLine as MdiMenuClose,
ArrowRightLeft,
ArrowRightToLine,
ArrowUp,
@ -11,10 +13,12 @@ export {
ChevronDown,
ChevronLeft,
ChevronRight,
ChevronsLeft,
ChevronsRight,
CircleHelp,
Copy,
CornerDownLeft,
Disc3 as IconDefault,
Disc as IconDefault,
Ellipsis,
ExternalLink,
Eye,
@ -36,6 +40,8 @@ export {
Palette,
PanelLeft,
PanelRight,
Pin,
PinOff,
RotateCw,
Search,
SearchX,

19
packages/@core/base/icons/src/mdi.ts
View File

@ -1,19 +0,0 @@
import { createIconifyIcon } from './create-icon';
export const MdiKeyboardEsc = createIconifyIcon('mdi:keyboard-esc');
export const MdiWechat = createIconifyIcon('mdi:wechat');
export const MdiGithub = createIconifyIcon('mdi:github');
export const MdiGoogle = createIconifyIcon('mdi:google');
export const MdiQqchat = createIconifyIcon('mdi:qqchat');
export const MdiPin = createIconifyIcon('mdi:pin');
export const MdiPinOff = createIconifyIcon('mdi:pin-off');
export const MdiMenuClose = createIconifyIcon('mdi:menu-close');
export const MdiMenuOpen = createIconifyIcon('mdi:menu-open');

1
packages/@core/ui-kit/layout-ui/src/components/layout-content.vue
View File

@ -54,7 +54,6 @@ const style = computed((): CSSProperties => {
<template>
<main ref="contentElement" :style="style" class="bg-background-deep relative">
<!-- <BlurShadow :style="shadowStyle" /> -->
<slot :overlay-style="overlayStyle" name="overlay"></slot>
<slot></slot>
</main>

8
packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-collapse-button.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { MdiMenuClose, MdiMenuOpen } from '@vben-core/icons';
import { ChevronsLeft, ChevronsRight } from '@vben-core/icons';
const collapsed = defineModel<boolean>('collapsed');
@ -10,10 +10,10 @@ function handleCollapsed() {
<template>
<div
class="flex-center hover:text-foreground text-foreground/60 hover:bg-accent-hover bg-accent absolute bottom-2 left-3 z-10 cursor-pointer rounded-sm p-1 transition-all duration-300"
class="flex-center hover:text-foreground text-foreground/60 hover:bg-accent-hover bg-accent absolute bottom-2 left-3 z-10 cursor-pointer rounded-sm p-1"
@click.stop="handleCollapsed"
>
<MdiMenuClose v-if="collapsed" class="size-4" />
<MdiMenuOpen v-else class="size-4" />
<ChevronsRight v-if="collapsed" class="size-4" />
<ChevronsLeft v-else class="size-4" />
</div>
</template>

8
packages/@core/ui-kit/layout-ui/src/components/widgets/sidebar-fixed-button.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts">
import { MdiPin, MdiPinOff } from '@vben-core/icons';
import { Pin, PinOff } from '@vben-core/icons';
const expandOnHover = defineModel<boolean>('expandOnHover');
@ -10,10 +10,10 @@ function toggleFixed() {
<template>
<div
class="flex-center hover:text-foreground text-foreground/60 hover:bg-accent-hover bg-accent absolute bottom-2 right-3 z-10 cursor-pointer rounded-sm p-1 transition-all duration-300"
class="flex-center hover:text-foreground text-foreground/60 hover:bg-accent-hover bg-accent absolute bottom-2 right-3 z-10 cursor-pointer rounded-sm p-[5px] transition-all duration-300"
@click="toggleFixed"
>
<MdiPinOff v-if="!expandOnHover" />
<MdiPin v-else />
<PinOff v-if="!expandOnHover" class="size-3.5" />
<Pin v-else class="size-3.5" />
</div>
</template>

2
packages/@core/ui-kit/layout-ui/src/vben-layout.vue
View File

@ -474,7 +474,7 @@ function handleOpenMenu() {
>
<div
:style="headerWrapperStyle"
class="overflow-hidden transition-all duration-200"
class="overflow-hidden shadow-[0_16px_24px_hsl(var(--background))] transition-all duration-200"
>
<LayoutHeader
v-if="headerVisible"

26
packages/@core/ui-kit/shadcn-ui/src/components/scrollbar/scrollbar.vue
View File

@ -42,15 +42,17 @@ const showShadowBottom = computed(() => props.shadow && props.shadowBottom);
const showShadowLeft = computed(() => props.shadow && props.shadowLeft);
const showShadowRight = computed(() => props.shadow && props.shadowRight);
const computedShadowClasses = computed(() => ({
'shadow-both':
!isAtLeft.value &&
!isAtRight.value &&
showShadowLeft.value &&
showShadowRight.value,
'shadow-left': !isAtLeft.value && showShadowLeft.value,
'shadow-right': !isAtRight.value && showShadowRight.value,
}));
const computedShadowClasses = computed(() => {
return {
'both-shadow':
!isAtLeft.value &&
!isAtRight.value &&
showShadowLeft.value &&
showShadowRight.value,
'left-shadow': !isAtLeft.value && showShadowLeft.value,
'right-shadow': !isAtRight.value && showShadowRight.value,
};
});
function handleScroll(event: Event) {
const target = event.target as HTMLElement;
@ -107,11 +109,11 @@ function handleScroll(event: Event) {
<style scoped>
.vben-scrollbar {
&:not(.shadow-both).shadow-left {
&:not(.both-shadow).left-shadow {
mask-image: linear-gradient(90deg, transparent, #000 16px);
}
&:not(.shadow-both).shadow-right {
&:not(.both-shadow).right-shadow {
mask-image: linear-gradient(
90deg,
#000 0%,
@ -120,7 +122,7 @@ function handleScroll(event: Event) {
);
}
&.shadow-both {
&.both-shadow {
mask-image: linear-gradient(
90deg,
transparent,

8
packages/@core/ui-kit/tabs-ui/src/components/tabs-chrome/tabs.vue
View File

@ -5,7 +5,7 @@ import type { TabConfig, TabsProps } from '../../types';
import { computed, ref } from 'vue';
import { MdiPin, X } from '@vben-core/icons';
import { Pin, X } from '@vben-core/icons';
import { VbenContextMenu, VbenIcon } from '@vben-core/shadcn-ui';
interface Props extends TabsProps {}
@ -62,7 +62,7 @@ const tabsView = computed((): TabConfig[] => {
:style="style"
class="tabs-chrome !flex h-full w-max pr-6"
>
<TransitionGroup name="slide-left">
<TransitionGroup name="slide-right">
<div
v-for="(tab, i) in tabsView"
:key="tab.key"
@ -70,7 +70,7 @@ const tabsView = computed((): TabConfig[] => {
:class="[{ 'is-active': tab.key === active, dragable: !tab.affixTab }]"
:data-active-tab="active"
:data-index="i"
class="tabs-chrome__item draggable group relative -mr-3 flex h-full select-none items-center"
class="tabs-chrome__item draggable translate-all group relative -mr-3 flex h-full select-none items-center"
data-tab-item="true"
@click="active = tab.key"
>
@ -119,7 +119,7 @@ const tabsView = computed((): TabConfig[] => {
class="hover:bg-accent stroke-accent-foreground/80 hover:stroke-accent-foreground text-accent-foreground/80 group-[.is-active]:text-accent-foreground mt-[2px] size-3 cursor-pointer rounded-full transition-all"
@click.stop="() => emit('close', tab.key)"
/>
<MdiPin
<Pin
v-show="tab.affixTab && tabsView.length > 1 && tab.closable"
class="hover:text-accent-foreground text-accent-foreground/80 group-[.is-active]:text-accent-foreground mt-[2px] size-3.5 cursor-pointer rounded-full transition-all"
@click.stop="() => emit('unpin', tab)"

8
packages/@core/ui-kit/tabs-ui/src/components/tabs/tabs.vue
View File

@ -5,7 +5,7 @@ import type { TabConfig, TabsProps } from '../../types';
import { computed } from 'vue';
import { MdiPin, X } from '@vben-core/icons';
import { Pin, X } from '@vben-core/icons';
import { VbenContextMenu, VbenIcon } from '@vben-core/shadcn-ui';
interface Props extends TabsProps {}
@ -65,7 +65,7 @@ const tabsView = computed((): TabConfig[] => {
:class="contentClass"
class="relative !flex h-full w-max items-center pr-6"
>
<TransitionGroup name="slide-left">
<TransitionGroup name="slide-right">
<div
v-for="(tab, i) in tabsView"
:key="tab.key"
@ -77,7 +77,7 @@ const tabsView = computed((): TabConfig[] => {
typeWithClass.content,
]"
:data-index="i"
class="tab-item [&:not(.is-active)]:hover:bg-accent group relative flex cursor-pointer select-none"
class="tab-item [&:not(.is-active)]:hover:bg-accent translate-all group relative flex cursor-pointer select-none"
data-tab-item="true"
@click="active = tab.key"
>
@ -98,7 +98,7 @@ const tabsView = computed((): TabConfig[] => {
class="hover:bg-accent stroke-accent-foreground/80 hover:stroke-accent-foreground dark:group-[.is-active]:text-accent-foreground group-[.is-active]:text-primary size-3 cursor-pointer rounded-full transition-all"
@click.stop="() => emit('close', tab.key)"
/>
<MdiPin
<Pin
v-show="tab.affixTab && tabsView.length > 1 && tab.closable"
class="hover:bg-accent hover:stroke-accent-foreground group-[.is-active]:text-primary dark:group-[.is-active]:text-accent-foreground mt-[2px] size-3.5 cursor-pointer rounded-full transition-all"
@click.stop="() => emit('unpin', tab)"

4
packages/@core/ui-kit/tabs-ui/src/tabs-view.vue
View File

@ -60,9 +60,11 @@ useTabsDrag(props, emit);
>
<VbenScrollbar
ref="scrollbarRef"
:shadow-bottom="false"
:shadow-top="false"
class="h-full"
horizontal
scroll-bar-class="z-10 hidden"
scroll-bar-class="z-10 hidden "
shadow
shadow-left
shadow-right

2
packages/@core/ui-kit/tabs-ui/src/use-tabs-drag.ts
View File

@ -31,7 +31,7 @@ export function useTabsDrag(props: TabsProps, emit: EmitType) {
const resetElState = async () => {
el.style.cursor = 'default';
el.classList.remove('dragging');
// el.classList.remove('dragging');
el.querySelector('.draggable')?.classList.remove('dragging');
};

6
packages/effects/layouts/src/basic/tabbar/use-tabbar.ts
View File

@ -13,9 +13,9 @@ import {
ExternalLink,
FoldHorizontal,
Fullscreen,
MdiPin,
MdiPinOff,
Minimize2,
Pin,
PinOff,
RotateCw,
X,
} from '@vben/icons';
@ -135,7 +135,7 @@ export function useTabbar() {
handler: async () => {
await toggleTabPin(tab);
},
icon: affixTab ? MdiPinOff : MdiPin,
icon: affixTab ? PinOff : Pin,
key: 'affix',
text: affixTab
? $t('preferences.tabbar.contextMenu.unpin')

12
packages/icons/src/iconify/index.ts
View File

@ -1,5 +1,13 @@
// import { createIconifyIcon } from '@vben-core/icons';
import { createIconifyIcon } from '@vben-core/icons';
export * from '@vben-core/icons';
// export const MdiKeyboardEsc = createIconifyIcon('mdi:keyboard-esc');
export const MdiKeyboardEsc = createIconifyIcon('mdi:keyboard-esc');
export const MdiWechat = createIconifyIcon('mdi:wechat');
export const MdiGithub = createIconifyIcon('mdi:github');
export const MdiGoogle = createIconifyIcon('mdi:google');
export const MdiQqchat = createIconifyIcon('mdi:qqchat');

4
packages/locales/package.json
View File

@ -20,8 +20,8 @@
}
},
"dependencies": {
"@intlify/core-base": "^9.13.1",
"@intlify/core-base": "^9.14.0",
"vue": "^3.4.37",
"vue-i18n": "^9.13.1"
"vue-i18n": "^9.14.0"
}
}

2
playground/src/router/routes/modules/vben.ts
View File

@ -27,7 +27,7 @@ const routes: RouteRecordRaw[] = [
{
name: 'VbenAbout',
path: '/vben-admin/about',
component: () => import('#/views/_core/vben/about/index.vue'),
component: () => import('#/views/_core/about/index.vue'),
meta: {
icon: 'lucide:copyright',
title: $t('page.vben.about'),

0
playground/src/views/_core/vben/about/index.vue → playground/src/views/_core/about/index.vue
View File

2
playground/src/views/examples/ellipsis/index.vue
View File

@ -16,7 +16,7 @@ const text = ref(longText);
title="文本省略示例"
>
<Card class="mb-4" title="基本使用">
<EllipsisText :max-width="240">{{ text }}</EllipsisText>
<EllipsisText :max-width="500">{{ text }}</EllipsisText>
</Card>
<Card class="mb-4" title="多行省略">

528
pnpm-lock.yaml
View File

File diff suppressed because it is too large Load Diff