@pdfme/ui 4.2.5-dev.3 → 4.2.5-dev.4

package/dist/types/components/Designer/RightSidebar/DetailView/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { SchemaForUI } from '@pdfme/common';
 import type { SidebarProps } from '../../../../types';
-type DetailViewProps = Pick<SidebarProps, 'size' | 'schemas' | 'pageSize' | 'changeSchemas' | 'activeElements' | 'deselectSchema'> & {
+type DetailViewProps = Pick<SidebarProps, 'size' | 'schemas' | 'schemasList' | 'pageSize' | 'changeSchemas' | 'activeElements' | 'deselectSchema'> & {
     activeSchema: SchemaForUI;
 };
 declare const _default: React.MemoExoticComponent<(props: DetailViewProps) => React.JSX.Element>;

package/dist/types/types.d.ts

@@ -7,6 +7,7 @@ export type SidebarProps = {
     pageSize: Size;
     activeElements: HTMLElement[];
     schemas: SchemaForUI[];
+    schemasList: SchemaForUI[][];
     onSortEnd: (sortedSchemas: SchemaForUI[]) => void;
     onEdit: (id: string) => void;
     onEditEnd: () => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pdfme/ui",
-  "version": "4.2.5-dev.3",
+  "version": "4.2.5-dev.4",
   "sideEffects": false,
   "author": "hand-dot",
   "license": "MIT",

package/src/components/Designer/RightSidebar/DetailView/index.tsx

@@ -14,7 +14,7 @@ import { InternalNamePath, ValidateErrorEntity } from "rc-field-form/es/interfac
 const { Text } = Typography;
 
 type DetailViewProps = Pick<SidebarProps,
-  'size' | 'schemas' | 'pageSize' | 'changeSchemas' | 'activeElements' | 'deselectSchema'
+  'size' | 'schemas' | 'schemasList' | 'pageSize' | 'changeSchemas' | 'activeElements' | 'deselectSchema'
 > & {
   activeSchema: SchemaForUI;
 };
@@ -22,7 +22,7 @@ type DetailViewProps = Pick<SidebarProps,
 const DetailView = (props: DetailViewProps) => {
   const { token } = theme.useToken();
 
-  const { size, schemas, changeSchemas, deselectSchema, activeSchema } = props;
+  const { size, schemasList, changeSchemas, deselectSchema, activeSchema } = props;
   const form = useForm();
 
   const i18n = useContext(I18nContext);
@@ -74,14 +74,16 @@ const DetailView = (props: DetailViewProps) => {
 
   useEffect(() => {
     uniqueSchemaKey.current = (value: string): boolean => {
-      for (const s of Object.values(schemas)) {
-        if (s.key === value && s.id !== activeSchema.id) {
-          return false;
+      for (const page of schemasList) {
+        for (const s of Object.values(page)) {
+          if (s.key === value && s.id !== activeSchema.id) {
+            return false;
+          }
         }
       }
       return true;
     };
-  }, [schemas, activeSchema]);
+  }, [schemasList, activeSchema]);
 
   const uniqueSchemaKey = useRef((value: string): boolean => true);
 
@@ -218,9 +220,11 @@ Check this document: https://pdfme.com/docs/custom-schemas`);
   };
 
   if (typeof activePropPanelSchema === 'function') {
+    const { schemasList: _, ...propPanelProps } = props;
+
     const apps =
       activePropPanelSchema({
-        ...props,
+        ...propPanelProps,
         options,
         theme: token,
         i18n: i18n as (key: keyof Dict | string) => string,

package/src/components/Designer/index.tsx

@@ -163,9 +163,9 @@ const TemplateEditor = ({
     const pageSize = pageSizes[pageCursor];
 
     const newSchemaKey = (prefix: string) => {
-      let keyNum = schemasList[pageCursor].length + 1;
+      let keyNum = schemasList.reduce((acc, page) => acc + page.length, 0);
       let newKey = prefix + keyNum;
-      while (schemasList[pageCursor].find((s) => s.key === newKey)) {
+      while (schemasList.some(page => page.find((s) => s.key === newKey))) {
         keyNum++;
         newKey = prefix + keyNum;
       }
@@ -298,6 +298,7 @@ const TemplateEditor = ({
           size={size}
           pageSize={pageSizes[pageCursor] ?? []}
           activeElements={activeElements}
+          schemasList={schemasList}
           schemas={schemasList[pageCursor] ?? []}
           changeSchemas={changeSchemas}
           onSortEnd={onSortEnd}

package/src/types.ts

@@ -8,6 +8,7 @@ export type SidebarProps = {
   pageSize: Size;
   activeElements: HTMLElement[];
   schemas: SchemaForUI[];
+  schemasList: SchemaForUI[][];
   onSortEnd: (sortedSchemas: SchemaForUI[]) => void;
   onEdit: (id: string) => void;
   onEditEnd: () => void;