# sap/open-ux-tools architecture

> Architecture diagram of the GitHub repository sap/open-ux-tools, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/sap/open-ux-tools
- Repository: https://github.com/sap/open-ux-tools

## Overview

Open UX Tools is a monorepo of reusable modules for SAP Fiori application development, including scaffolding and configuration, runtime adaptation, cloud/ABAP tooling, and annotation processing. A representative user workflow is adapting a running application: the preview client gathers fragment data, prepares a UI5 change command, executes it through runtime authoring, and can request an application reload. The README identifies Fiori generator and easyUI5 as consumers. Most package internals were not sampled, so their capabilities are shown without speculative call links.

Main entry points: [`packages/preview-middleware-client/src/adp/api-handler.ts`](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/api-handler.ts) (Fragment API), [`packages/preview-middleware-client/src/adp/command-executor.ts`](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/command-executor.ts) (Command executor), [`packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts`](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts) (Fragment dialog), [`packages/preview-middleware-client/src/adp/controllers/AddCustomFragment.controller.ts`](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddCustomFragment.controller.ts) (Custom fragment dialog)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_scaffold["Scaffolding and config"]
  node_deploy_inquirer["ABAP deploy prompts"]
  node_deploy_subgen["ABAP deploy generator"]
  node_abap_writer["ABAP config writer"]
  node_cf_inquirer["Cloud deploy prompts"]
  node_cf_subgen["Cloud deploy generator"]
  node_cf_writer["Cloud config writer"]
  node_app_config["App config writer"]
  node_cap_writer["CAP config writer"]
  node_freestyle_writer["Freestyle templates"]
end

subgraph group_author["UI5 authoring"]
  node_preview_client["Preview client"]
  node_fragment_dialog["Fragment dialog"]
  node_custom_fragment["Custom fragment dialog"]
  node_column_fragment["Table fragment dialog"]
  node_fragment_api["Fragment API<br/>[api-handler.ts]"]
  node_command_executor["Command executor"]
  node_ui5_tooling["ADP tooling"]
end

subgraph group_platform["Platform integration"]
  node_proxy_cf["Cloud proxy middleware"]
  node_proxy_base["Proxy middleware"]
  node_axios_ext["HTTP and ABAP services"]
  node_btp_utils["BTP utilities"]
end

subgraph group_annotations["Annotation processing"]
  node_annotation_gen["Annotation generator"]
  node_cds_parser["CDS annotation parser"]
  node_annotation_converter["Annotation converter"]
end

node_fiori_generator(("Fiori generator"))
node_easyui5(("easyUI5"))

node_fiori_generator -->|"consumes modules"| node_deploy_subgen
node_easyui5 -->|"consumes modules"| node_deploy_subgen
node_fragment_dialog -->|"fetches fragments"| node_fragment_api
node_custom_fragment -->|"fetches fragments"| node_fragment_api
node_column_fragment -->|"fetches fragments"| node_fragment_api
node_fragment_dialog -->|"creates change"| node_command_executor
node_custom_fragment -->|"creates change"| node_command_executor
node_column_fragment -->|"executes change"| node_command_executor

click node_deploy_inquirer "https://github.com/sap/open-ux-tools/tree/main/packages/abap-deploy-config-inquirer/src"
click node_deploy_subgen "https://github.com/sap/open-ux-tools/tree/main/packages/abap-deploy-config-sub-generator/src"
click node_abap_writer "https://github.com/sap/open-ux-tools/tree/main/packages/abap-deploy-config-writer/src"
click node_cf_inquirer "https://github.com/sap/open-ux-tools/tree/main/packages/cf-deploy-config-inquirer/src"
click node_cf_subgen "https://github.com/sap/open-ux-tools/tree/main/packages/cf-deploy-config-sub-generator/src"
click node_cf_writer "https://github.com/sap/open-ux-tools/tree/main/packages/cf-deploy-config-writer/src"
click node_app_config "https://github.com/sap/open-ux-tools/tree/main/packages/app-config-writer/src"
click node_cap_writer "https://github.com/sap/open-ux-tools/tree/main/packages/cap-config-writer/src"
click node_freestyle_writer "https://github.com/sap/open-ux-tools/tree/main/packages/fiori-freestyle-writer/templates"
click node_preview_client "https://github.com/sap/open-ux-tools/tree/main/packages/preview-middleware-client/src/adp/controllers"
click node_fragment_dialog "https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts"
click node_custom_fragment "https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddCustomFragment.controller.ts"
click node_column_fragment "https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddTableColumnFragments.controller.ts"
click node_fragment_api "https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/api-handler.ts"
click node_command_executor "https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/command-executor.ts"
click node_ui5_tooling "https://github.com/sap/open-ux-tools/tree/main/packages/adp-tooling/src"
click node_proxy_cf "https://github.com/sap/open-ux-tools/tree/main/packages/backend-proxy-middleware-cf/src"
click node_proxy_base "https://github.com/sap/open-ux-tools/tree/main/packages/backend-proxy-middleware/src"
click node_axios_ext "https://github.com/sap/open-ux-tools/tree/main/packages/axios-extension/src"
click node_btp_utils "https://github.com/sap/open-ux-tools/tree/main/packages/btp-utils/src"
click node_annotation_gen "https://github.com/sap/open-ux-tools/tree/main/packages/annotation-generator/src"
click node_cds_parser "https://github.com/sap/open-ux-tools/tree/main/packages/cds-annotation-parser/src"
click node_annotation_converter "https://github.com/sap/open-ux-tools/tree/main/packages/cds-odata-annotation-converter/src"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_deploy_inquirer,node_deploy_subgen,node_abap_writer,node_cf_inquirer,node_cf_subgen,node_cf_writer,node_app_config,node_cap_writer,node_freestyle_writer toneBlue
class node_preview_client,node_fragment_dialog,node_custom_fragment,node_column_fragment,node_fragment_api,node_command_executor,node_ui5_tooling toneAmber
class node_proxy_cf,node_proxy_base,node_axios_ext,node_btp_utils toneMint
class node_annotation_gen,node_cds_parser,node_annotation_converter toneRose
class node_fiori_generator,node_easyui5 toneIndigo
```

## Components

### Scaffolding and config

- [ABAP deploy prompts](https://github.com/sap/open-ux-tools/tree/main/packages/abap-deploy-config-inquirer/src): `packages/abap-deploy-config-inquirer/src`
- [ABAP deploy generator](https://github.com/sap/open-ux-tools/tree/main/packages/abap-deploy-config-sub-generator/src): `packages/abap-deploy-config-sub-generator/src`
- [ABAP config writer](https://github.com/sap/open-ux-tools/tree/main/packages/abap-deploy-config-writer/src): `packages/abap-deploy-config-writer/src`
- [Cloud deploy prompts](https://github.com/sap/open-ux-tools/tree/main/packages/cf-deploy-config-inquirer/src): `packages/cf-deploy-config-inquirer/src`
- [Cloud deploy generator](https://github.com/sap/open-ux-tools/tree/main/packages/cf-deploy-config-sub-generator/src): `packages/cf-deploy-config-sub-generator/src`
- [Cloud config writer](https://github.com/sap/open-ux-tools/tree/main/packages/cf-deploy-config-writer/src): `packages/cf-deploy-config-writer/src`
- [App config writer](https://github.com/sap/open-ux-tools/tree/main/packages/app-config-writer/src): `packages/app-config-writer/src`
- [CAP config writer](https://github.com/sap/open-ux-tools/tree/main/packages/cap-config-writer/src): `packages/cap-config-writer/src`
- [Freestyle templates](https://github.com/sap/open-ux-tools/tree/main/packages/fiori-freestyle-writer/templates): `packages/fiori-freestyle-writer/templates`

### UI5 authoring

- [Preview client](https://github.com/sap/open-ux-tools/tree/main/packages/preview-middleware-client/src/adp/controllers): `packages/preview-middleware-client/src/adp/controllers`
- [Fragment dialog](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts): `packages/preview-middleware-client/src/adp/controllers/AddFragment.controller.ts`
- [Custom fragment dialog](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddCustomFragment.controller.ts): `packages/preview-middleware-client/src/adp/controllers/AddCustomFragment.controller.ts`
- [Table fragment dialog](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/controllers/AddTableColumnFragments.controller.ts): `packages/preview-middleware-client/src/adp/controllers/AddTableColumnFragments.controller.ts`
- [Fragment API](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/api-handler.ts): `packages/preview-middleware-client/src/adp/api-handler.ts`
- [Command executor](https://github.com/sap/open-ux-tools/blob/main/packages/preview-middleware-client/src/adp/command-executor.ts): `packages/preview-middleware-client/src/adp/command-executor.ts`
- [ADP tooling](https://github.com/sap/open-ux-tools/tree/main/packages/adp-tooling/src): `packages/adp-tooling/src`

### Platform integration

- [Cloud proxy middleware](https://github.com/sap/open-ux-tools/tree/main/packages/backend-proxy-middleware-cf/src): `packages/backend-proxy-middleware-cf/src`
- [Proxy middleware](https://github.com/sap/open-ux-tools/tree/main/packages/backend-proxy-middleware/src): `packages/backend-proxy-middleware/src`
- [HTTP and ABAP services](https://github.com/sap/open-ux-tools/tree/main/packages/axios-extension/src): `packages/axios-extension/src`
- [BTP utilities](https://github.com/sap/open-ux-tools/tree/main/packages/btp-utils/src): `packages/btp-utils/src`

### Annotation processing

- [Annotation generator](https://github.com/sap/open-ux-tools/tree/main/packages/annotation-generator/src): `packages/annotation-generator/src`
- [CDS annotation parser](https://github.com/sap/open-ux-tools/tree/main/packages/cds-annotation-parser/src): `packages/cds-annotation-parser/src`
- [Annotation converter](https://github.com/sap/open-ux-tools/tree/main/packages/cds-odata-annotation-converter/src): `packages/cds-odata-annotation-converter/src`

### Other components

- **Fiori generator**
- **easyUI5**

## Connections

- Fiori generator → ABAP deploy generator: consumes modules
- easyUI5 → ABAP deploy generator: consumes modules
- Fragment dialog → Fragment API: fetches fragments
- Custom fragment dialog → Fragment API: fetches fragments
- Table fragment dialog → Fragment API: fetches fragments
- Fragment dialog → Command executor: creates change
- Custom fragment dialog → Command executor: creates change
- Table fragment dialog → Command executor: executes change