@cundi/refine-xaf 1.0.3 → 1.0.5

package/README.md

@@ -11,6 +11,7 @@ This is an SDK integrating XAF backend with Refine frontend, including core logi
     - `LoginPage`: Standard login page.
     - `SmartList`, `RelatedList`: Highly encapsulated generic list and detail components. (**Note**: To use `defaultVisible` prop, import `@cundi/refine-xaf/dist/antd-column-ext` in your app entry)
     - `TiptapEditor`: Rich text editor with support for Images, Tables, Tasks, Math (LaTeX), YouTube, Emoji, Highlight, and Text Color.
+    - `DrawioEditor`: Draw.io diagram editor with i18n language sync support.
     - `ApplicationUser`: Complete user management (List, Create, Edit, Role Assignment).
     - `PermissionPolicyRole`: Complete role and permission management.
 
@@ -260,6 +261,32 @@ export const DemoObjectCreate = () => {
 };
 ```
 
+### DrawioEditor Usage
+
+Use the `DrawioEditor` component for Draw.io diagram editing with automatic i18n language synchronization.
+
+```tsx
+import { DrawioEditor } from "@cundi/refine-xaf";
+import { Form } from "antd";
+
+// Basic usage in a form
+<Form.Item
+    label="Diagram"
+    name={["DiagramXml"]}
+    trigger="onChange"
+    getValueFromEvent={(value) => value}
+>
+    <DrawioEditor height={600} />
+</Form.Item>
+
+// Props:
+// - value?: string          - XML format diagram data
+// - onChange?: (xml) => void - Callback when content changes
+// - disabled?: boolean      - Read-only mode (hides save button)
+// - height?: number|string  - Editor height (default: 500)
+// - autosave?: boolean      - Enable autosave (default: true)
+```
+
 ## Development and Publishing
 
 1. **Install Dependencies**: `npm install`
@@ -299,7 +326,20 @@ console.log(claims.sub, claims.exp);
 
 ## Changelog
 
-### v1.0.2 (Latest)
+### v1.0.5 (Latest)
+- Added `DrawioEditor` component for Draw.io diagram editing
+- DrawioEditor supports automatic i18n language synchronization
+- Added `react-drawio` dependency
+
+### v1.0.4
+- Fixed `refineXafTranslations` export (was missing from main index)
+- Fixed i18n translations for dashboard page
+
+### v1.0.3
+- Added Dashboard page translations
+- Fixed internationalization in template
+
+### v1.0.2
 - Fixed `defaultVisible` type definition for `SmartList`. Consumers must add `import "@cundi/refine-xaf/dist/antd-column-ext";` to their entry file (e.g., `App.tsx`) to enable this feature.
 
 ### v1.0.1

package/dist/index.d.mts

@@ -194,6 +194,207 @@ declare const keycloakService: {
     logout: (idToken?: string) => void;
 };
 
+declare const refineXafTranslations: {
+    en: {
+        pages: {
+            login: {
+                title: string;
+                buttons: {
+                    submit: string;
+                };
+            };
+        };
+        buttons: {
+            create: string;
+            edit: string;
+            delete: string;
+            save: string;
+            cancel: string;
+            refresh: string;
+            list: string;
+            logout: string;
+        };
+        actions: {
+            create: string;
+            edit: string;
+            show: string;
+            list: string;
+            delete: string;
+        };
+        components: {
+            header: {
+                theme: {
+                    light: string;
+                    dark: string;
+                };
+                language: {
+                    en: string;
+                    "zh-TW": string;
+                };
+                menu: {
+                    changePhoto: string;
+                    manageAccount: string;
+                    changePassword: string;
+                    logout: string;
+                };
+            };
+            base64Upload: {
+                upload: string;
+            };
+            relatedList: {
+                addDetail: string;
+                actions: string;
+                manageDetail: string;
+                deleteConfirm: string;
+            };
+            smartList: {
+                search: string;
+                refresh: string;
+                columns: string;
+                selectColumns: string;
+                reset: string;
+            };
+            tiptapEditor: {
+                placeholder: string;
+                textColor: string;
+                highlight: string;
+                insertTable: string;
+                deleteTable: string;
+                emoji: string;
+                addRowBefore: string;
+                addRowAfter: string;
+                deleteRow: string;
+                addColumnBefore: string;
+                addColumnAfter: string;
+                deleteColumn: string;
+                math: string;
+                youtube: string;
+                enterYoutubeUrl: string;
+            };
+            drawioEditor: {
+                loading: string;
+            };
+        };
+        common: {
+            actions: {
+                create: string;
+                edit: string;
+                delete: string;
+                save: string;
+                cancel: string;
+            };
+        };
+        sider: {
+            dashboard: string;
+            dataTypeExamples: string;
+            tiptapExamples: string;
+            drawioExamples: string;
+            users: string;
+            roles: string;
+            settings: string;
+        };
+    };
+    "zh-TW": {
+        pages: {
+            login: {
+                title: string;
+                buttons: {
+                    submit: string;
+                };
+            };
+        };
+        buttons: {
+            create: string;
+            edit: string;
+            delete: string;
+            save: string;
+            cancel: string;
+            refresh: string;
+            list: string;
+            logout: string;
+        };
+        actions: {
+            create: string;
+            edit: string;
+            show: string;
+            list: string;
+            delete: string;
+        };
+        components: {
+            header: {
+                theme: {
+                    light: string;
+                    dark: string;
+                };
+                language: {
+                    en: string;
+                    "zh-TW": string;
+                };
+                menu: {
+                    changePhoto: string;
+                    manageAccount: string;
+                    changePassword: string;
+                    logout: string;
+                };
+            };
+            base64Upload: {
+                upload: string;
+            };
+            relatedList: {
+                addDetail: string;
+                actions: string;
+                manageDetail: string;
+                deleteConfirm: string;
+            };
+            smartList: {
+                search: string;
+                refresh: string;
+                columns: string;
+                selectColumns: string;
+                reset: string;
+            };
+            tiptapEditor: {
+                placeholder: string;
+                textColor: string;
+                highlight: string;
+                insertTable: string;
+                deleteTable: string;
+                emoji: string;
+                addRowBefore: string;
+                addRowAfter: string;
+                deleteRow: string;
+                addColumnBefore: string;
+                addColumnAfter: string;
+                deleteColumn: string;
+                math: string;
+                youtube: string;
+                enterYoutubeUrl: string;
+            };
+            drawioEditor: {
+                loading: string;
+            };
+        };
+        common: {
+            actions: {
+                create: string;
+                edit: string;
+                delete: string;
+                save: string;
+                cancel: string;
+            };
+        };
+        sider: {
+            dashboard: string;
+            dataTypeExamples: string;
+            tiptapExamples: string;
+            drawioExamples: string;
+            users: string;
+            roles: string;
+            settings: string;
+        };
+    };
+};
+
 declare const Header: React.FC;
 
 interface SmartListProps {
@@ -235,6 +436,20 @@ interface TiptapEditorProps {
 }
 declare const TiptapEditor: React.FC<TiptapEditorProps>;
 
+interface DrawioEditorProps {
+    /** XML format diagram data */
+    value?: string;
+    /** Callback when diagram content changes */
+    onChange?: (value: string) => void;
+    /** Whether the editor is disabled (read-only mode) */
+    disabled?: boolean;
+    /** Height of the editor, default is 500 */
+    height?: number | string;
+    /** Enable autosave feature */
+    autosave?: boolean;
+}
+declare const DrawioEditor: React.FC<DrawioEditorProps>;
+
 declare const LoginPage: React.FC;
 
 declare const KeycloakLoginPage: React.FC;
@@ -275,4 +490,4 @@ interface IModelType {
 }
 declare const useModelTypes: () => _tanstack_react_query.UseQueryResult<IModelType[], Error>;
 
-export { ApplicationUserCreate, ApplicationUserEdit, ApplicationUserList, AuthCallback, Base64Upload, ColorModeContext, ColorModeContextProvider, Header, HttpError, type IApplicationUser, type IJwtClaims, type IModelType, type IPermissionPolicyRole, type IPermissionPolicyTypePermissionObject, type IXafEntity, KeycloakLoginPage, type KeycloakTokenResponse, LoginPage, RelatedList, type RequestOptions, RoleCreate, RoleEdit, RoleList, SecurityPermissionPolicy, SecurityPermissionState, SmartList, TOKEN_KEY, TiptapEditor, type TiptapEditorProps, authProvider, authService, dataProvider, generatePassword, getBaseUrl, httpClient, keycloakService, parseJwt, useColorMode, useModelTypes, validatePasswordStrength };
+export { ApplicationUserCreate, ApplicationUserEdit, ApplicationUserList, AuthCallback, Base64Upload, ColorModeContext, ColorModeContextProvider, DrawioEditor, type DrawioEditorProps, Header, HttpError, type IApplicationUser, type IJwtClaims, type IModelType, type IPermissionPolicyRole, type IPermissionPolicyTypePermissionObject, type IXafEntity, KeycloakLoginPage, type KeycloakTokenResponse, LoginPage, RelatedList, type RequestOptions, RoleCreate, RoleEdit, RoleList, SecurityPermissionPolicy, SecurityPermissionState, SmartList, TOKEN_KEY, TiptapEditor, type TiptapEditorProps, authProvider, authService, dataProvider, generatePassword, getBaseUrl, httpClient, keycloakService, parseJwt, refineXafTranslations, useColorMode, useModelTypes, validatePasswordStrength };

package/dist/index.d.ts

@@ -194,6 +194,207 @@ declare const keycloakService: {
     logout: (idToken?: string) => void;
 };
 
+declare const refineXafTranslations: {
+    en: {
+        pages: {
+            login: {
+                title: string;
+                buttons: {
+                    submit: string;
+                };
+            };
+        };
+        buttons: {
+            create: string;
+            edit: string;
+            delete: string;
+            save: string;
+            cancel: string;
+            refresh: string;
+            list: string;
+            logout: string;
+        };
+        actions: {
+            create: string;
+            edit: string;
+            show: string;
+            list: string;
+            delete: string;
+        };
+        components: {
+            header: {
+                theme: {
+                    light: string;
+                    dark: string;
+                };
+                language: {
+                    en: string;
+                    "zh-TW": string;
+                };
+                menu: {
+                    changePhoto: string;
+                    manageAccount: string;
+                    changePassword: string;
+                    logout: string;
+                };
+            };
+            base64Upload: {
+                upload: string;
+            };
+            relatedList: {
+                addDetail: string;
+                actions: string;
+                manageDetail: string;
+                deleteConfirm: string;
+            };
+            smartList: {
+                search: string;
+                refresh: string;
+                columns: string;
+                selectColumns: string;
+                reset: string;
+            };
+            tiptapEditor: {
+                placeholder: string;
+                textColor: string;
+                highlight: string;
+                insertTable: string;
+                deleteTable: string;
+                emoji: string;
+                addRowBefore: string;
+                addRowAfter: string;
+                deleteRow: string;
+                addColumnBefore: string;
+                addColumnAfter: string;
+                deleteColumn: string;
+                math: string;
+                youtube: string;
+                enterYoutubeUrl: string;
+            };
+            drawioEditor: {
+                loading: string;
+            };
+        };
+        common: {
+            actions: {
+                create: string;
+                edit: string;
+                delete: string;
+                save: string;
+                cancel: string;
+            };
+        };
+        sider: {
+            dashboard: string;
+            dataTypeExamples: string;
+            tiptapExamples: string;
+            drawioExamples: string;
+            users: string;
+            roles: string;
+            settings: string;
+        };
+    };
+    "zh-TW": {
+        pages: {
+            login: {
+                title: string;
+                buttons: {
+                    submit: string;
+                };
+            };
+        };
+        buttons: {
+            create: string;
+            edit: string;
+            delete: string;
+            save: string;
+            cancel: string;
+            refresh: string;
+            list: string;
+            logout: string;
+        };
+        actions: {
+            create: string;
+            edit: string;
+            show: string;
+            list: string;
+            delete: string;
+        };
+        components: {
+            header: {
+                theme: {
+                    light: string;
+                    dark: string;
+                };
+                language: {
+                    en: string;
+                    "zh-TW": string;
+                };
+                menu: {
+                    changePhoto: string;
+                    manageAccount: string;
+                    changePassword: string;
+                    logout: string;
+                };
+            };
+            base64Upload: {
+                upload: string;
+            };
+            relatedList: {
+                addDetail: string;
+                actions: string;
+                manageDetail: string;
+                deleteConfirm: string;
+            };
+            smartList: {
+                search: string;
+                refresh: string;
+                columns: string;
+                selectColumns: string;
+                reset: string;
+            };
+            tiptapEditor: {
+                placeholder: string;
+                textColor: string;
+                highlight: string;
+                insertTable: string;
+                deleteTable: string;
+                emoji: string;
+                addRowBefore: string;
+                addRowAfter: string;
+                deleteRow: string;
+                addColumnBefore: string;
+                addColumnAfter: string;
+                deleteColumn: string;
+                math: string;
+                youtube: string;
+                enterYoutubeUrl: string;
+            };
+            drawioEditor: {
+                loading: string;
+            };
+        };
+        common: {
+            actions: {
+                create: string;
+                edit: string;
+                delete: string;
+                save: string;
+                cancel: string;
+            };
+        };
+        sider: {
+            dashboard: string;
+            dataTypeExamples: string;
+            tiptapExamples: string;
+            drawioExamples: string;
+            users: string;
+            roles: string;
+            settings: string;
+        };
+    };
+};
+
 declare const Header: React.FC;
 
 interface SmartListProps {
@@ -235,6 +436,20 @@ interface TiptapEditorProps {
 }
 declare const TiptapEditor: React.FC<TiptapEditorProps>;
 
+interface DrawioEditorProps {
+    /** XML format diagram data */
+    value?: string;
+    /** Callback when diagram content changes */
+    onChange?: (value: string) => void;
+    /** Whether the editor is disabled (read-only mode) */
+    disabled?: boolean;
+    /** Height of the editor, default is 500 */
+    height?: number | string;
+    /** Enable autosave feature */
+    autosave?: boolean;
+}
+declare const DrawioEditor: React.FC<DrawioEditorProps>;
+
 declare const LoginPage: React.FC;
 
 declare const KeycloakLoginPage: React.FC;
@@ -275,4 +490,4 @@ interface IModelType {
 }
 declare const useModelTypes: () => _tanstack_react_query.UseQueryResult<IModelType[], Error>;
 
-export { ApplicationUserCreate, ApplicationUserEdit, ApplicationUserList, AuthCallback, Base64Upload, ColorModeContext, ColorModeContextProvider, Header, HttpError, type IApplicationUser, type IJwtClaims, type IModelType, type IPermissionPolicyRole, type IPermissionPolicyTypePermissionObject, type IXafEntity, KeycloakLoginPage, type KeycloakTokenResponse, LoginPage, RelatedList, type RequestOptions, RoleCreate, RoleEdit, RoleList, SecurityPermissionPolicy, SecurityPermissionState, SmartList, TOKEN_KEY, TiptapEditor, type TiptapEditorProps, authProvider, authService, dataProvider, generatePassword, getBaseUrl, httpClient, keycloakService, parseJwt, useColorMode, useModelTypes, validatePasswordStrength };
+export { ApplicationUserCreate, ApplicationUserEdit, ApplicationUserList, AuthCallback, Base64Upload, ColorModeContext, ColorModeContextProvider, DrawioEditor, type DrawioEditorProps, Header, HttpError, type IApplicationUser, type IJwtClaims, type IModelType, type IPermissionPolicyRole, type IPermissionPolicyTypePermissionObject, type IXafEntity, KeycloakLoginPage, type KeycloakTokenResponse, LoginPage, RelatedList, type RequestOptions, RoleCreate, RoleEdit, RoleList, SecurityPermissionPolicy, SecurityPermissionState, SmartList, TOKEN_KEY, TiptapEditor, type TiptapEditorProps, authProvider, authService, dataProvider, generatePassword, getBaseUrl, httpClient, keycloakService, parseJwt, refineXafTranslations, useColorMode, useModelTypes, validatePasswordStrength };