Merge branch 'main' into milletpeak-fontsize

packages/effects/common-ui/src/components/icon-picker/icon-picker.vue

@@ -71,17 +71,10 @@ const modelValue = defineModel({ default: '', type: String });
 
 const visible = ref(false);
 const currentSelect = ref('');
-const currentPage = ref(1);
 const keyword = ref('');
 const keywordDebounce = refDebounced(keyword, 300);
 const innerIcons = ref<string[]>([]);
 
-/* 当检索关键词变化时，重置分页 */
-watch(keywordDebounce, () => {
-  currentPage.value = 1;
-  setCurrentPage(1);
-});
-
 watchDebounced(
   () => props.prefix,
   async (prefix) => {
@@ -122,7 +115,7 @@ const showList = computed(() => {
   );
 });
 
-const { paginationList, total, setCurrentPage } = usePagination(
+const { paginationList, total, setCurrentPage, currentPage } = usePagination(
   showList,
   props.pageSize,
 );
@@ -145,7 +138,6 @@ const handleClick = (icon: string) => {
 };
 
 const handlePageChange = (page: number) => {
-  currentPage.value = page;
   setCurrentPage(page);
 };
 

packages/effects/common-ui/src/components/json-viewer/index.vue

@@ -55,16 +55,12 @@ function handleClick(event: MouseEvent) {
       return;
     }
     const param: JsonViewerValue = {
-      path: '',
-      value: '',
-      depth: 0,
       el: event.target,
+      path: pathNode.getAttribute('path') || '',
+      depth: Number(pathNode.getAttribute('depth')) || 0,
+      value: event.target.textContent || undefined,
     };
 
-    param.path = pathNode.getAttribute('path') || '';
-    param.depth = Number(pathNode.getAttribute('depth')) || 0;
-
-    param.value = event.target.textContent || undefined;
     param.value = JSON.parse(param.value);
     emit('valueClick', param);
   }

packages/effects/common-ui/src/components/resize/resize.vue

@@ -618,13 +618,11 @@ const stickStyles = computed(() => (stick: string) => {
   const stickStyle = {
     width: `${stickSize.value / parentScaleX.value}px`,
     height: `${stickSize.value / parentScaleY.value}px`,
+    [styleMapping.y[stick[0] as 'b' | 'm' | 't'] as 'height' | 'width']:
+      `${stickSize.value / parentScaleX.value / -2}px`,
+    [styleMapping.x[stick[1] as 'l' | 'm' | 'r'] as 'height' | 'width']:
+      `${stickSize.value / parentScaleX.value / -2}px`,
   };
-  stickStyle[
-    styleMapping.y[stick[0] as 'b' | 'm' | 't'] as 'height' | 'width'
-  ] = `${stickSize.value / parentScaleX.value / -2}px`;
-  stickStyle[
-    styleMapping.x[stick[1] as 'l' | 'm' | 'r'] as 'height' | 'width'
-  ] = `${stickSize.value / parentScaleX.value / -2}px`;
   return stickStyle;
 });
 

packages/effects/hooks/src/use-pagination.ts

@@ -1,6 +1,6 @@
 import type { Ref } from 'vue';
 
-import { computed, ref, unref } from 'vue';
+import { computed, ref, unref, watch } from 'vue';
 
 /**
  * Paginates an array of items
@@ -22,7 +22,11 @@ function pagination<T = any>(list: T[], pageNo: number, pageSize: number): T[] {
   return ret;
 }
 
-export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
+export function usePagination<T = any>(
+  list: Ref<T[]>,
+  pageSize: number,
+  totalChangeToFirstPage = true,
+) {
   const currentPage = ref(1);
   const pageSizeRef = ref(pageSize);
 
@@ -38,11 +42,21 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
     return unref(list).length;
   });
 
+  if (totalChangeToFirstPage) {
+    watch(total, () => {
+      setCurrentPage(1);
+    });
+  }
+
   function setCurrentPage(page: number) {
-    if (page < 1 || page > unref(totalPages)) {
-      throw new Error('Invalid page number');
+    if (page === 1 && unref(totalPages) === 0) {
+      currentPage.value = 1;
+    } else {
+      if (page < 1 || page > unref(totalPages)) {
+        throw new Error('Invalid page number');
+      }
+      currentPage.value = page;
     }
-    currentPage.value = page;
   }
 
   function setPageSize(pageSize: number) {
@@ -54,5 +68,5 @@ export function usePagination<T = any>(list: Ref<T[]>, pageSize: number) {
     currentPage.value = 1;
   }
 
-  return { setCurrentPage, total, setPageSize, paginationList };
+  return { setCurrentPage, total, setPageSize, paginationList, currentPage };
 }

packages/effects/layouts/src/basic/header/header.vue

@@ -92,7 +92,7 @@ const rightSlots = computed(() => {
       list.push({ index: Number(name[2]), name: key });
     }
   });
-  return list.sort((a, b) => a.index - b.index);
+  return list.toSorted((a, b) => a.index - b.index);
 });
 
 const leftSlots = computed(() => {
@@ -111,7 +111,7 @@ const leftSlots = computed(() => {
       list.push({ index: Number(name[2]), name: key });
     }
   });
-  return list.sort((a, b) => a.index - b.index);
+  return list.toSorted((a, b) => a.index - b.index);
 });
 
 function clearPreferencesAndLogout() {

packages/effects/layouts/src/widgets/theme-toggle/theme-button.vue

@@ -66,7 +66,7 @@ function toggleTheme(event: MouseEvent) {
     ];
     const animate = document.documentElement.animate(
       {
-        clipPath: isDark.value ? [...clipPath].reverse() : clipPath,
+        clipPath: isDark.value ? [...clipPath].toReversed() : clipPath,
       },
       {
         duration: 450,