diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 073500b1..430950ee 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,9 +11,12 @@ importers: '@dagrejs/dagre': specifier: ^1.1.4 version: 1.1.8 - '@frankframework/ff-doc': - specifier: ^1.2.0 - version: 1.2.0(rxjs@7.8.2) + '@frankframework/doc-library-core': + specifier: ^1.0.1 + version: 1.0.1 + '@frankframework/doc-library-react': + specifier: ^1.0.2 + version: 1.0.2(react@19.2.1) '@mdx-js/rollup': specifier: ^3.1.0 version: 3.1.1(rollup@4.53.3) @@ -192,19 +195,6 @@ packages: '@adobe/css-tools@4.4.4': resolution: {integrity: sha512-Elp+iwUx5rN5+Y8xLt5/GRoG20WGoDCQ/1Fb+1LiGtvwbDavuSk0jhD/eZdckHAuzcDzccnkv+rEjyWfRx18gg==} - '@angular/core@20.3.15': - resolution: {integrity: sha512-NMbX71SlTZIY9+rh/SPhRYFJU0pMJYW7z/TBD4lqiO+b0DTOIg1k7Pg9ydJGqSjFO1Z4dQaA6TteNuF99TJCNw==} - engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0} - peerDependencies: - '@angular/compiler': 20.3.15 - rxjs: ^6.5.3 || ^7.4.0 - zone.js: ~0.15.0 - peerDependenciesMeta: - '@angular/compiler': - optional: true - zone.js: - optional: true - '@asamuzakjp/css-color@4.1.0': resolution: {integrity: sha512-9xiBAtLn4aNsa4mDnpovJvBn72tNEIACyvlqaNJ+ADemR+yeMJWnBudOi2qGDviJa7SwcDOU/TRh5dnET7qk0w==} @@ -676,8 +666,13 @@ packages: '@floating-ui/utils@0.2.10': resolution: {integrity: sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==} - '@frankframework/ff-doc@1.2.0': - resolution: {integrity: sha512-vkahJ3d4Fla5bVRavXvZm10I6VkGU3Al89tCg4eiCNa6p6TTqIAIc1r6xAC8pUCSbPZTvzRVUJ3ssoR0sUyLzw==} + '@frankframework/doc-library-core@1.0.1': + resolution: {integrity: sha512-NgUyPV+M0nGLtv7wKt/UbXchtvUmLb453CcR/HxUc6rWiRn9mUPWBXIhp//AP6x/dn9Spzp6iVaG+3fUVdkqHA==} + + '@frankframework/doc-library-react@1.0.2': + resolution: {integrity: sha512-sRoqD+4U4/oTWFzJNee55DlMpHyinuHIV+XKagaEa1jc34tTsmKf0ni88aPnBQYWHrIdb9pykogMmw5AS+bb2w==} + peerDependencies: + react: ^19.1.0 || ^20.0.0 '@humanfs/core@0.19.1': resolution: {integrity: sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==} @@ -1145,56 +1140,67 @@ packages: resolution: {integrity: sha512-k9oD15soC/Ln6d2Wv/JOFPzZXIAIFLp6B+i14KhxAfnq76ajt0EhYc5YPeX6W1xJkAdItcVT+JhKl1QZh44/qw==} cpu: [arm] os: [linux] + libc: [glibc] '@rollup/rollup-linux-arm-musleabihf@4.53.3': resolution: {integrity: sha512-vTNlKq+N6CK/8UktsrFuc+/7NlEYVxgaEgRXVUVK258Z5ymho29skzW1sutgYjqNnquGwVUObAaxae8rZ6YMhg==} cpu: [arm] os: [linux] + libc: [musl] '@rollup/rollup-linux-arm64-gnu@4.53.3': resolution: {integrity: sha512-RGrFLWgMhSxRs/EWJMIFM1O5Mzuz3Xy3/mnxJp/5cVhZ2XoCAxJnmNsEyeMJtpK+wu0FJFWz+QF4mjCA7AUQ3w==} cpu: [arm64] os: [linux] + libc: [glibc] '@rollup/rollup-linux-arm64-musl@4.53.3': resolution: {integrity: sha512-kASyvfBEWYPEwe0Qv4nfu6pNkITLTb32p4yTgzFCocHnJLAHs+9LjUu9ONIhvfT/5lv4YS5muBHyuV84epBo/A==} cpu: [arm64] os: [linux] + libc: [musl] '@rollup/rollup-linux-loong64-gnu@4.53.3': resolution: {integrity: sha512-JiuKcp2teLJwQ7vkJ95EwESWkNRFJD7TQgYmCnrPtlu50b4XvT5MOmurWNrCj3IFdyjBQ5p9vnrX4JM6I8OE7g==} cpu: [loong64] os: [linux] + libc: [glibc] '@rollup/rollup-linux-ppc64-gnu@4.53.3': resolution: {integrity: sha512-EoGSa8nd6d3T7zLuqdojxC20oBfNT8nexBbB/rkxgKj5T5vhpAQKKnD+h3UkoMuTyXkP5jTjK/ccNRmQrPNDuw==} cpu: [ppc64] os: [linux] + libc: [glibc] '@rollup/rollup-linux-riscv64-gnu@4.53.3': resolution: {integrity: sha512-4s+Wped2IHXHPnAEbIB0YWBv7SDohqxobiiPA1FIWZpX+w9o2i4LezzH/NkFUl8LRci/8udci6cLq+jJQlh+0g==} cpu: [riscv64] os: [linux] + libc: [glibc] '@rollup/rollup-linux-riscv64-musl@4.53.3': resolution: {integrity: sha512-68k2g7+0vs2u9CxDt5ktXTngsxOQkSEV/xBbwlqYcUrAVh6P9EgMZvFsnHy4SEiUl46Xf0IObWVbMvPrr2gw8A==} cpu: [riscv64] os: [linux] + libc: [musl] '@rollup/rollup-linux-s390x-gnu@4.53.3': resolution: {integrity: sha512-VYsFMpULAz87ZW6BVYw3I6sWesGpsP9OPcyKe8ofdg9LHxSbRMd7zrVrr5xi/3kMZtpWL/wC+UIJWJYVX5uTKg==} cpu: [s390x] os: [linux] + libc: [glibc] '@rollup/rollup-linux-x64-gnu@4.53.3': resolution: {integrity: sha512-3EhFi1FU6YL8HTUJZ51imGJWEX//ajQPfqWLI3BQq4TlvHy4X0MOr5q3D2Zof/ka0d5FNdPwZXm3Yyib/UEd+w==} cpu: [x64] os: [linux] + libc: [glibc] '@rollup/rollup-linux-x64-musl@4.53.3': resolution: {integrity: sha512-eoROhjcc6HbZCJr+tvVT8X4fW3/5g/WkGvvmwz/88sDtSJzO7r/blvoBDgISDiCjDRZmHpwud7h+6Q9JxFwq1Q==} cpu: [x64] os: [linux] + libc: [musl] '@rollup/rollup-openharmony-arm64@4.53.3': resolution: {integrity: sha512-OueLAWgrNSPGAdUdIjSWXw+u/02BRTcnfw9PN41D2vq/JSEPnJnVuBgw18VkN8wcd4fjUs+jFHVM4t9+kBSNLw==} @@ -1330,24 +1336,28 @@ packages: engines: {node: '>= 10'} cpu: [arm64] os: [linux] + libc: [glibc] '@tailwindcss/oxide-linux-arm64-musl@4.1.17': resolution: {integrity: sha512-HvZLfGr42i5anKtIeQzxdkw/wPqIbpeZqe7vd3V9vI3RQxe3xU1fLjss0TjyhxWcBaipk7NYwSrwTwK1hJARMg==} engines: {node: '>= 10'} cpu: [arm64] os: [linux] + libc: [musl] '@tailwindcss/oxide-linux-x64-gnu@4.1.17': resolution: {integrity: sha512-M3XZuORCGB7VPOEDH+nzpJ21XPvK5PyjlkSFkFziNHGLc5d6g3di2McAAblmaSUNl8IOmzYwLx9NsE7bplNkwQ==} engines: {node: '>= 10'} cpu: [x64] os: [linux] + libc: [glibc] '@tailwindcss/oxide-linux-x64-musl@4.1.17': resolution: {integrity: sha512-k7f+pf9eXLEey4pBlw+8dgfJHY4PZ5qOUFDyNf7SI6lHjQ9Zt7+NcscjpwdCEbYi6FI5c2KDTDWyf2iHcCSyyQ==} engines: {node: '>= 10'} cpu: [x64] os: [linux] + libc: [musl] '@tailwindcss/oxide-wasm32-wasi@4.1.17': resolution: {integrity: sha512-cEytGqSSoy7zK4JRWiTCx43FsKP/zGr0CsuMawhH67ONlH+T79VteQeJQRO/X7L0juEUA8ZyuYikcRBf0vsxhg==} @@ -3215,24 +3225,28 @@ packages: engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] + libc: [glibc] lightningcss-linux-arm64-musl@1.30.2: resolution: {integrity: sha512-5Vh9dGeblpTxWHpOx8iauV02popZDsCYMPIgiuw97OJ5uaDsL86cnqSFs5LZkG3ghHoX5isLgWzMs+eD1YzrnA==} engines: {node: '>= 12.0.0'} cpu: [arm64] os: [linux] + libc: [musl] lightningcss-linux-x64-gnu@1.30.2: resolution: {integrity: sha512-Cfd46gdmj1vQ+lR6VRTTadNHu6ALuw2pKR9lYq4FnhvgBc4zWY1EtZcAc6EffShbb1MFrIPfLDXD6Xprbnni4w==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] + libc: [glibc] lightningcss-linux-x64-musl@1.30.2: resolution: {integrity: sha512-XJaLUUFXb6/QG2lGIW6aIk6jKdtjtcffUT0NKvIqhSBY3hh9Ch+1LCeH80dR9q9LBjG3ewbDjnumefsLsP6aiA==} engines: {node: '>= 12.0.0'} cpu: [x64] os: [linux] + libc: [musl] lightningcss-win32-arm64-msvc@1.30.2: resolution: {integrity: sha512-FZn+vaj7zLv//D/192WFFVA0RgHawIcHqLX9xuWiQt7P0PtdFEVaxgF9rjM/IRYHQXNnk61/H/gb2Ei+kUQ4xQ==} @@ -4926,12 +4940,6 @@ snapshots: '@adobe/css-tools@4.4.4': {} - '@angular/core@20.3.15(rxjs@7.8.2)': - dependencies: - rxjs: 7.8.2 - tslib: 2.8.1 - optional: true - '@asamuzakjp/css-color@4.1.0': dependencies: '@csstools/css-calc': 2.1.4(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4) @@ -4971,7 +4979,7 @@ snapshots: '@babel/types': 7.28.5 '@jridgewell/remapping': 2.3.5 convert-source-map: 2.0.0 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) gensync: 1.0.0-beta.2 json5: 2.2.3 semver: 6.3.1 @@ -5139,7 +5147,7 @@ snapshots: '@babel/parser': 7.28.5 '@babel/template': 7.27.2 '@babel/types': 7.28.5 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -5384,7 +5392,7 @@ snapshots: '@eslint/config-array@0.21.1': dependencies: '@eslint/object-schema': 2.1.7 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) minimatch: 3.1.2 transitivePeerDependencies: - supports-color @@ -5400,7 +5408,7 @@ snapshots: '@eslint/eslintrc@3.3.3': dependencies: ajv: 6.12.6 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) espree: 10.4.0 globals: 14.0.0 ignore: 5.3.2 @@ -5437,17 +5445,12 @@ snapshots: '@floating-ui/utils@0.2.10': {} - '@frankframework/ff-doc@1.2.0(rxjs@7.8.2)': + '@frankframework/doc-library-core@1.0.1': {} + + '@frankframework/doc-library-react@1.0.2(react@19.2.1)': dependencies: - tslib: 2.8.1 - optionalDependencies: - '@angular/core': 20.3.15(rxjs@7.8.2) + '@frankframework/doc-library-core': 1.0.1 react: 19.2.1 - react-dom: 19.2.1(react@19.2.1) - transitivePeerDependencies: - - '@angular/compiler' - - rxjs - - zone.js '@humanfs/core@0.19.1': {} @@ -6284,7 +6287,7 @@ snapshots: '@typescript-eslint/types': 8.49.0 '@typescript-eslint/typescript-estree': 8.49.0(typescript@5.9.3) '@typescript-eslint/visitor-keys': 8.49.0 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) eslint: 9.39.1(jiti@2.6.1) typescript: 5.9.3 transitivePeerDependencies: @@ -6294,7 +6297,7 @@ snapshots: dependencies: '@typescript-eslint/tsconfig-utils': 8.49.0(typescript@5.9.3) '@typescript-eslint/types': 8.49.0 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) typescript: 5.9.3 transitivePeerDependencies: - supports-color @@ -6313,7 +6316,7 @@ snapshots: '@typescript-eslint/types': 8.49.0 '@typescript-eslint/typescript-estree': 8.49.0(typescript@5.9.3) '@typescript-eslint/utils': 8.49.0(eslint@9.39.1(jiti@2.6.1))(typescript@5.9.3) - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) eslint: 9.39.1(jiti@2.6.1) ts-api-utils: 2.1.0(typescript@5.9.3) typescript: 5.9.3 @@ -6328,7 +6331,7 @@ snapshots: '@typescript-eslint/tsconfig-utils': 8.49.0(typescript@5.9.3) '@typescript-eslint/types': 8.49.0 '@typescript-eslint/visitor-keys': 8.49.0 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) minimatch: 9.0.5 semver: 7.7.3 tinyglobby: 0.2.15 @@ -7062,10 +7065,6 @@ snapshots: optionalDependencies: supports-color: 8.1.1 - debug@4.4.3: - dependencies: - ms: 2.1.3 - debug@4.4.3(supports-color@8.1.1): dependencies: ms: 2.1.3 @@ -7452,7 +7451,7 @@ snapshots: ajv: 6.12.6 chalk: 4.1.2 cross-spawn: 7.0.6 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) escape-string-regexp: 4.0.0 eslint-scope: 8.4.0 eslint-visitor-keys: 4.2.1 @@ -7911,7 +7910,7 @@ snapshots: http-proxy-agent@7.0.2: dependencies: agent-base: 7.1.4 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -7924,7 +7923,7 @@ snapshots: https-proxy-agent@7.0.6: dependencies: agent-base: 7.1.4 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) transitivePeerDependencies: - supports-color @@ -8787,7 +8786,7 @@ snapshots: micromark@4.0.2: dependencies: '@types/debug': 4.1.12 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) decode-named-character-reference: 1.2.0 devlop: 1.1.0 micromark-core-commonmark: 2.0.3 @@ -10080,7 +10079,7 @@ snapshots: vite-node@3.2.4(@types/node@20.19.26)(jiti@2.6.1)(lightningcss@1.30.2): dependencies: cac: 6.7.14 - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) es-module-lexer: 1.7.0 pathe: 2.0.3 vite: 6.4.1(@types/node@20.19.26)(jiti@2.6.1)(lightningcss@1.30.2) @@ -10111,7 +10110,7 @@ snapshots: vite-tsconfig-paths@5.1.4(typescript@5.9.3)(vite@6.4.1(@types/node@20.19.26)(jiti@2.6.1)(lightningcss@1.30.2)): dependencies: - debug: 4.4.3 + debug: 4.4.3(supports-color@8.1.1) globrex: 0.1.2 tsconfck: 3.1.6(typescript@5.9.3) optionalDependencies: diff --git a/src/main/frontend/app/components/flow/create-node-modal.tsx b/src/main/frontend/app/components/flow/create-node-modal.tsx index afac3670..9ffe6de0 100644 --- a/src/main/frontend/app/components/flow/create-node-modal.tsx +++ b/src/main/frontend/app/components/flow/create-node-modal.tsx @@ -1,9 +1,9 @@ import { useMemo, useState, type ChangeEvent } from 'react' import useFlowStore from '~/stores/flow-store' import useNodeContextStore from '~/stores/node-context-store' -import { useFrankDoc } from '~/providers/frankdoc-provider' +import { useFFDoc } from '@frankframework/doc-library-react' import Button from '../inputs/button' -import type { Elements, FFDocJson } from '@frankframework/ff-doc' +import type { Elements, FFDocJson } from '@frankframework/doc-library-core' interface CreateNodeModalProperties { isOpen: boolean @@ -41,7 +41,7 @@ function CreateNodeModal({ positions, sourceInfo, }: Readonly) { - const { elements, ffDoc } = useFrankDoc() + const { elements, ffDoc } = useFFDoc() const { setAttributes, setNodeId } = useNodeContextStore((state) => state) const nodes = useFlowStore((state) => state.nodes) const [search, setSearch] = useState('') diff --git a/src/main/frontend/app/hooks/use-handle-types.ts b/src/main/frontend/app/hooks/use-handle-types.ts index ccc8c9eb..6713efce 100644 --- a/src/main/frontend/app/hooks/use-handle-types.ts +++ b/src/main/frontend/app/hooks/use-handle-types.ts @@ -1,5 +1,5 @@ import { useMemo } from 'react' -import type { ElementProperty } from '@frankframework/ff-doc' +import type { ElementProperty } from '@frankframework/doc-library-core' export function useHandleTypes(typesAllowed?: Record) { return useMemo(() => { diff --git a/src/main/frontend/app/providers/frankdoc-provider.tsx b/src/main/frontend/app/providers/frankdoc-provider.tsx deleted file mode 100644 index 0684bcba..00000000 --- a/src/main/frontend/app/providers/frankdoc-provider.tsx +++ /dev/null @@ -1,42 +0,0 @@ -import { createContext, useContext, useMemo, type ReactNode } from 'react' -import { useFFDoc } from '@frankframework/ff-doc/react' -import type { Elements, Filters, FFDocJson } from '@frankframework/ff-doc' -import { apiUrl } from '~/utils/api' - -interface FrankDocContextValue { - ffDoc: FFDocJson | null - elements: Elements | null - filters: Filters | null - isLoading: boolean - error: Error | null - refetch: () => void -} - -const FrankDocContext = createContext(null) - -export function FrankDocProvider({ children }: { children: ReactNode }) { - const { ffDoc, elements, filters } = useFFDoc(apiUrl('/json/frankdoc')) - - const isLoading = ffDoc === null - const error = null - - // eslint-disable-next-line unicorn/consistent-function-scoping - const refetch = () => { - globalThis.location.reload() - } - - const contextValue = useMemo( - () => ({ ffDoc, elements, filters, isLoading, error, refetch }), - [ffDoc, elements, filters, isLoading], - ) - - return {children} -} - -export function useFrankDoc(): FrankDocContextValue { - const context = useContext(FrankDocContext) - if (!context) { - throw new Error('useFrankDoc must be used within a FrankDocProvider') - } - return context -} diff --git a/src/main/frontend/app/routes/app-layout.tsx b/src/main/frontend/app/routes/app-layout.tsx index ad91b665..809b1bce 100644 --- a/src/main/frontend/app/routes/app-layout.tsx +++ b/src/main/frontend/app/routes/app-layout.tsx @@ -1,11 +1,12 @@ +import { FFDocProvider } from '@frankframework/doc-library-react' import Navbar from '~/components/navbar/navbar' -import { FrankDocProvider } from '~/providers/frankdoc-provider' import AppContent from '~/components/app-content' import { useEffect, useState } from 'react' import { useProjectStore, getStoredProjectName } from '~/stores/project-store' import { fetchProject } from '~/services/project-service' import LoadingSpinner from '~/components/loading-spinner' import type { Project } from '~/types/project.types' +import { apiUrl } from '~/utils/api' export default function AppLayout() { const [restoring, setRestoring] = useState(!!getStoredProjectName()) @@ -38,13 +39,13 @@ export default function AppLayout() { } return ( - +
- + ) } diff --git a/src/main/frontend/app/routes/editor/editor.tsx b/src/main/frontend/app/routes/editor/editor.tsx index c6dfdc2a..9b65433c 100644 --- a/src/main/frontend/app/routes/editor/editor.tsx +++ b/src/main/frontend/app/routes/editor/editor.tsx @@ -11,7 +11,7 @@ import EditorFileStructure from '~/components/file-structure/editor-file-structu import useEditorTabStore from '~/stores/editor-tab-store' import EditorTabs from '~/components/tabs/editor-tabs' import type { ElementDetails, Attribute, EnumValue } from '~/types/ff-doc.types' -import { useFrankDoc } from '~/providers/frankdoc-provider' +import { useFFDoc } from '@frankframework/doc-library-react' import { fetchConfiguration, saveConfiguration } from '~/services/configuration-service' import RulerCrossPenIcon from '/icons/solar/Ruler Cross Pen.svg?react' import { openInStudio } from '~/actions/navigationActions' @@ -31,7 +31,7 @@ const SAVED_DISPLAY_DURATION = 2000 export default function CodeEditor() { const theme = useTheme() - const { elements } = useFrankDoc() + const { elements } = useFFDoc() const project = useProjectStore.getState().project const [activeTabFilePath, setActiveTabFilePath] = useState(useEditorTabStore.getState().activeTabFilePath) const [xmlContent, setXmlContent] = useState('') diff --git a/src/main/frontend/app/routes/studio/canvas/nodetypes/child-node.tsx b/src/main/frontend/app/routes/studio/canvas/nodetypes/child-node.tsx index 7064ea42..2e1b2a31 100644 --- a/src/main/frontend/app/routes/studio/canvas/nodetypes/child-node.tsx +++ b/src/main/frontend/app/routes/studio/canvas/nodetypes/child-node.tsx @@ -4,7 +4,7 @@ import { getElementTypeFromName } from '../../node-translator-module' import useNodeContextStore from '~/stores/node-context-store' import { useNodeContextMenu } from '../flow' import { canAcceptChildStatic, type FrankElement } from './node-utilities' -import { useFrankDoc } from '~/providers/frankdoc-provider' +import { useFFDoc } from '@frankframework/doc-library-react' export interface ChildNode { id: string @@ -37,7 +37,7 @@ export function ChildNodeComponent({ const [dragOver, setDragOver] = useState(false) const [canDropDraggedElement, setCanDropDraggedElement] = useState(false) const [dragForbidden, setDragForbidden] = useState(false) - const { elements, filters } = useFrankDoc() + const { elements, filters } = useFFDoc() // Store the associated Frank element const frankElement = useMemo(() => { if (!elements) return null diff --git a/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle-menu.tsx b/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle-menu.tsx index 08580333..fb0b03a2 100644 --- a/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle-menu.tsx +++ b/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle-menu.tsx @@ -1,7 +1,7 @@ import React from 'react' import HandleMenuItem from './handle-menu-item' import { translateHandleTypeToColour } from './handle' -import type { ElementProperty } from '@frankframework/ff-doc' +import type { ElementProperty } from '@frankframework/doc-library-core' import { useHandleTypes } from '~/hooks/use-handle-types' interface HandleMenuProperties { diff --git a/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle.tsx b/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle.tsx index 1672916b..bd5eba88 100644 --- a/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle.tsx +++ b/src/main/frontend/app/routes/studio/canvas/nodetypes/components/handle.tsx @@ -1,7 +1,7 @@ import { Handle, Position, useNodeConnections, useReactFlow } from '@xyflow/react' import { useState } from 'react' import HandleMenuItem from './handle-menu-item' -import type { ElementProperty } from '@frankframework/ff-doc' +import type { ElementProperty } from '@frankframework/doc-library-core' import { useHandleTypes } from '~/hooks/use-handle-types' interface HandleProperties { diff --git a/src/main/frontend/app/routes/studio/canvas/nodetypes/exit-node.tsx b/src/main/frontend/app/routes/studio/canvas/nodetypes/exit-node.tsx index bd5962ce..8274e080 100644 --- a/src/main/frontend/app/routes/studio/canvas/nodetypes/exit-node.tsx +++ b/src/main/frontend/app/routes/studio/canvas/nodetypes/exit-node.tsx @@ -4,8 +4,8 @@ import { FlowConfig } from '~/routes/studio/canvas/flow.config' import useNodeContextStore from '~/stores/node-context-store' import { useNodeContextMenu } from '~/routes/studio/canvas/flow' import { useSettingsStore } from '~/stores/settings-store' -import { useFrankDoc } from '~/providers/frankdoc-provider' -import type { Attribute } from '@frankframework/ff-doc' +import { useFFDoc } from '@frankframework/doc-library-react' +import type { Attribute } from '@frankframework/doc-library-core' export type ExitNode = Node<{ subtype: string @@ -18,7 +18,7 @@ export default function ExitNodeComponent(properties: NodeProps) { const minNodeWidth = FlowConfig.EXIT_DEFAULT_WIDTH const minNodeHeight = FlowConfig.EXIT_DEFAULT_HEIGHT const showNodeContextMenu = useNodeContextMenu() - const { elements } = useFrankDoc() + const { elements } = useFFDoc() const { setNodeId, setAttributes, setIsEditing, setEditingSubtype, setParentId, setChildParentId } = useNodeContextStore() const gradientEnabled = useSettingsStore((state) => state.studio.gradient) diff --git a/src/main/frontend/app/routes/studio/canvas/nodetypes/frank-node.tsx b/src/main/frontend/app/routes/studio/canvas/nodetypes/frank-node.tsx index 3d0909f0..73aa97b4 100644 --- a/src/main/frontend/app/routes/studio/canvas/nodetypes/frank-node.tsx +++ b/src/main/frontend/app/routes/studio/canvas/nodetypes/frank-node.tsx @@ -16,12 +16,12 @@ import { useNodeContextMenu } from '~/routes/studio/canvas/flow' import useNodeContextStore from '~/stores/node-context-store' import { getElementTypeFromName } from '~/routes/studio/node-translator-module' import { useSettingsStore } from '~/stores/settings-store' -import { useFrankDoc } from '~/providers/frankdoc-provider' +import { useFFDoc } from '@frankframework/doc-library-react' import HandleMenu from './components/handle-menu' import { ChildNodeComponent, type ChildNode } from './child-node' import { findChildRecursive } from '~/stores/child-utilities' import { canAcceptChildStatic } from './node-utilities' -import type { ElementDetails } from '@frankframework/ff-doc' +import type { ElementDetails } from '@frankframework/doc-library-core' import { DeprecatedPopover } from './components/deprecated-popover' import { showWarningToast } from '~/components/toast' import { useHandleTypes } from '~/hooks/use-handle-types' @@ -45,7 +45,7 @@ export default function FrankNode(properties: NodeProps) { const [dragOver, setDragOver] = useState(false) const [canDropDraggedElement, setCanDropDraggedElement] = useState(false) const showNodeContextMenu = useNodeContextMenu() - const { elements, filters } = useFrankDoc() + const { elements, filters } = useFFDoc() const { setNodeId, setIsNewNode, diff --git a/src/main/frontend/app/routes/studio/canvas/nodetypes/node-utilities.ts b/src/main/frontend/app/routes/studio/canvas/nodetypes/node-utilities.ts index 0b6e775c..75b5c17b 100644 --- a/src/main/frontend/app/routes/studio/canvas/nodetypes/node-utilities.ts +++ b/src/main/frontend/app/routes/studio/canvas/nodetypes/node-utilities.ts @@ -1,4 +1,4 @@ -import type { Child, Filters } from '@frankframework/ff-doc' +import type { Child, Filters } from '@frankframework/doc-library-core' export interface FrankElement { children?: Child[] diff --git a/src/main/frontend/app/routes/studio/context/context-input.tsx b/src/main/frontend/app/routes/studio/context/context-input.tsx index fe225b97..f44162d0 100644 --- a/src/main/frontend/app/routes/studio/context/context-input.tsx +++ b/src/main/frontend/app/routes/studio/context/context-input.tsx @@ -1,8 +1,8 @@ import React, { useState } from 'react' import HelpIcon from '/icons/solar/Help.svg?react' -import { useJavadocTransform } from '@frankframework/ff-doc/react' +import { useJavadocTransform } from '@frankframework/doc-library-react' import ContextInputField from './context-input-field' -import type { Attribute, Elements } from '@frankframework/ff-doc' +import type { Attribute, Elements } from '@frankframework/doc-library-core' export interface ContextInputProperties { id: string diff --git a/src/main/frontend/app/routes/studio/context/node-context.tsx b/src/main/frontend/app/routes/studio/context/node-context.tsx index 403814e8..7737dbe6 100644 --- a/src/main/frontend/app/routes/studio/context/node-context.tsx +++ b/src/main/frontend/app/routes/studio/context/node-context.tsx @@ -5,8 +5,8 @@ import Button from '~/components/inputs/button' import { useShallow } from 'zustand/react/shallow' import ContextInput from './context-input' import { findChildRecursive } from '~/stores/child-utilities' -import { useFrankDoc } from '~/providers/frankdoc-provider' -import type { Attribute } from '@frankframework/ff-doc' +import { useFFDoc } from '@frankframework/doc-library-react' +import type { Attribute } from '@frankframework/doc-library-core' export default function NodeContext({ nodeId, @@ -24,7 +24,7 @@ export default function NodeContext({ const [initiallyFilledKeys, setInitiallyFilledKeys] = useState>(new Set()) const [initialValues, setInitialValues] = useState>({}) - const { elements, ffDoc } = useFrankDoc() + const { elements, ffDoc } = useFFDoc() const { attributes, isNewNode, diff --git a/src/main/frontend/app/routes/studio/context/sorted-elements.tsx b/src/main/frontend/app/routes/studio/context/sorted-elements.tsx index 18be7a49..06742390 100644 --- a/src/main/frontend/app/routes/studio/context/sorted-elements.tsx +++ b/src/main/frontend/app/routes/studio/context/sorted-elements.tsx @@ -3,7 +3,7 @@ import ArrowDownIcon from 'icons/solar/Alt Arrow Down.svg?react' import ArrowRightIcon from 'icons/solar/Alt Arrow Right.svg?react' import { useSettingsStore } from '~/stores/settings-store' import useNodeContextStore from '~/stores/node-context-store' -import type { ElementDetails } from '@frankframework/ff-doc' +import type { ElementDetails } from '@frankframework/doc-library-core' import { getElementTypeFromName } from '../node-translator-module' import DangerIcon from '../../../../icons/solar/Danger Triangle.svg?react' import { DeprecatedListPopover } from './deprecated-list-popover' diff --git a/src/main/frontend/app/routes/studio/context/studio-context.tsx b/src/main/frontend/app/routes/studio/context/studio-context.tsx index 2bdfeb57..162ecdff 100644 --- a/src/main/frontend/app/routes/studio/context/studio-context.tsx +++ b/src/main/frontend/app/routes/studio/context/studio-context.tsx @@ -4,15 +4,15 @@ import { useState } from 'react' import SortedElements from '~/routes/studio/context/sorted-elements' import Search from '~/components/search/search' import { useProjectStore } from '~/stores/project-store' -import type { ElementDetails } from '@frankframework/ff-doc' -import { useFrankDoc } from '~/providers/frankdoc-provider' +import type { ElementDetails } from '@frankframework/doc-library-core' +import { useFFDoc } from '@frankframework/doc-library-react' import LoadingSpinner from '~/components/loading-spinner' export default function StudioContext() { const { setAttributes, setNodeId, setDraggedName } = useNodeContextStore((state) => state) const [searchTerm, setSearchTerm] = useState('') const project = useProjectStore((state) => state.project) - const { filters, elements, isLoading } = useFrankDoc() + const { filters, elements, isLoading } = useFFDoc() if (isLoading || !elements) { return ( diff --git a/src/main/frontend/app/services/frankdoc-service.ts b/src/main/frontend/app/services/frankdoc-service.ts index e79192c5..7c273dfe 100644 --- a/src/main/frontend/app/services/frankdoc-service.ts +++ b/src/main/frontend/app/services/frankdoc-service.ts @@ -1,5 +1,5 @@ import { apiFetch } from '~/utils/api' -import type { FFDocJson } from '@frankframework/ff-doc' +import type { FFDocJson } from '@frankframework/doc-library-core' export async function fetchFrankDoc(signal?: AbortSignal): Promise { return apiFetch('/json/frankdoc', { signal }) diff --git a/src/main/frontend/app/types/ff-doc.types.ts b/src/main/frontend/app/types/ff-doc.types.ts index 6a5d0a6c..f02139ff 100644 --- a/src/main/frontend/app/types/ff-doc.types.ts +++ b/src/main/frontend/app/types/ff-doc.types.ts @@ -1,9 +1,9 @@ /** * Shared FF Doc type definitions - * Extracted from @frankframework/ff-doc using TypeScript utility types + * Extracted from @frankframework/doc-library-react using TypeScript utility types */ -import { useFFDoc } from '@frankframework/ff-doc/react' +import { useFFDoc } from '@frankframework/doc-library-react' type FFDocReturn = ReturnType export type Elements = NonNullable diff --git a/src/main/frontend/package.json b/src/main/frontend/package.json index f9cc8954..e4345043 100644 --- a/src/main/frontend/package.json +++ b/src/main/frontend/package.json @@ -16,7 +16,8 @@ }, "dependencies": { "@dagrejs/dagre": "^1.1.4", - "@frankframework/ff-doc": "^1.2.0", + "@frankframework/doc-library-core": "^1.0.1", + "@frankframework/doc-library-react": "^1.0.2", "@mdx-js/rollup": "^3.1.0", "@monaco-editor/react": "4.7.0-rc.0", "@react-router/node": "^7.4.1", diff --git a/src/main/frontend/tsconfig.app.json b/src/main/frontend/tsconfig.app.json deleted file mode 100644 index 4ad6f684..00000000 --- a/src/main/frontend/tsconfig.app.json +++ /dev/null @@ -1,17 +0,0 @@ -/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ -/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ -{ - "extends": "./tsconfig.json", - "compilerOptions": { - "outDir": "./out-tsc/app", - "types": [], - "composite": true, - "noEmit": false - }, - "include": [ - "src/**/*.ts" - ], - "exclude": [ - "src/**/*.spec.ts" - ] -} diff --git a/src/main/frontend/tsconfig.json b/src/main/frontend/tsconfig.json index 0d3bf31a..7e12aee3 100644 --- a/src/main/frontend/tsconfig.json +++ b/src/main/frontend/tsconfig.json @@ -40,13 +40,5 @@ "resolveJsonModule": true, "skipLibCheck": true, "strict": true - }, - "references": [ - { - "path": "./tsconfig.app.json" - }, - { - "path": "./tsconfig.spec.json" - } - ] + } } diff --git a/src/main/frontend/tsconfig.spec.json b/src/main/frontend/tsconfig.spec.json deleted file mode 100644 index f7f36368..00000000 --- a/src/main/frontend/tsconfig.spec.json +++ /dev/null @@ -1,12 +0,0 @@ -/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ -/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ -{ - "extends": "./tsconfig.json", - "compilerOptions": { - "outDir": "./out-tsc/spec", - "types": ["jasmine"], - "composite": true, - "noEmit": false - }, - "include": ["**/*.spec.ts", "**/*.test.ts"] -} diff --git a/src/main/frontend/vite.config.ts b/src/main/frontend/vite.config.ts index 1fdb5ae6..74044b9d 100644 --- a/src/main/frontend/vite.config.ts +++ b/src/main/frontend/vite.config.ts @@ -5,16 +5,10 @@ import tsconfigPaths from 'vite-tsconfig-paths' import svgr from 'vite-plugin-svgr' import mdx from '@mdx-js/rollup' import dotenv from 'dotenv' -import { fileURLToPath } from 'node:url' -import path from 'node:path' dotenv.config({ quiet: true }) import remarkGfm from 'remark-gfm' -const __dirname = path.dirname(fileURLToPath(import.meta.url)) - -const ffDocRoot = path.resolve(__dirname, 'node_modules/@frankframework/ff-doc') - export default defineConfig({ plugins: [ tailwindcss(), @@ -25,12 +19,6 @@ export default defineConfig({ tsconfigPaths(), svgr(), ], - resolve: { - alias: { - '@frankframework/ff-doc/react': path.join(ffDocRoot, 'react/frankframework-ff-doc.mjs'), - '@frankframework/ff-doc': path.join(ffDocRoot, 'frankframework-ff-doc.mjs'), - }, - }, server: { port: 3000, },