This is an automated email from the ASF dual-hosted git repository.
tiagobento pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-kie-tools.git
The following commit(s) were added to refs/heads/main by this push:
new ca0757a7518 kie-issues#2169: DMN Editor: Add new flag to hide UI
elements in read-only mode (#3350)
ca0757a7518 is described below
commit ca0757a751896478957b5e91d43d8abf914c4af7
Author: Aswathi <[email protected]>
AuthorDate: Fri Nov 21 00:54:09 2025 +0530
kie-issues#2169: DMN Editor: Add new flag to hide UI elements in read-only
mode (#3350)
---
packages/dmn-editor/src/DmnEditor.tsx | 5 ++++-
packages/dmn-editor/src/diagram/Diagram.tsx | 15 ++++++++-------
2 files changed, 12 insertions(+), 8 deletions(-)
diff --git a/packages/dmn-editor/src/DmnEditor.tsx
b/packages/dmn-editor/src/DmnEditor.tsx
index 0583d438855..447a0be6461 100644
--- a/packages/dmn-editor/src/DmnEditor.tsx
+++ b/packages/dmn-editor/src/DmnEditor.tsx
@@ -204,6 +204,8 @@ export type DmnEditorProps = {
onOpenedBoxedExpressionEditorNodeChange?: (newOpenedNodeId: string |
undefined) => void;
locale: string;
+
+ previewMode?: boolean;
};
export const DmnEditorInternal = ({
@@ -213,6 +215,7 @@ export const DmnEditorInternal = ({
onOpenedBoxedExpressionEditorNodeChange,
onModelDebounceStateChanged,
forwardRef,
+ previewMode,
}: DmnEditorProps & { forwardRef?: React.Ref<DmnEditorRef> }) => {
const { i18n } = useDmnEditorI18n();
const boxedExpressionEditorActiveDrgElementId = useDmnEditorStore((s) =>
s.boxedExpressionEditor.activeDrgElementId);
@@ -429,7 +432,7 @@ export const DmnEditorInternal = ({
data-testid={"kie-tools--dmn-editor--diagram-container"}
>
{originalVersion && <DmnVersionLabel
version={originalVersion} />}
- <Diagram ref={diagramRef}
container={diagramContainerRef} />
+ <Diagram ref={diagramRef}
container={diagramContainerRef} previewMode={previewMode} />
</div>
</DrawerContentBody>
</DrawerContent>
diff --git a/packages/dmn-editor/src/diagram/Diagram.tsx
b/packages/dmn-editor/src/diagram/Diagram.tsx
index 1b1fe72cd0d..53383fbac57 100644
--- a/packages/dmn-editor/src/diagram/Diagram.tsx
+++ b/packages/dmn-editor/src/diagram/Diagram.tsx
@@ -136,6 +136,7 @@ const isFirefox = typeof (window as any).InstallTrigger !==
"undefined"; // See
const PAN_ON_DRAG = [1, 2];
const FIT_VIEW_OPTIONS: RF.FitViewOptions = { maxZoom: 1, minZoom: 0.1,
duration: 400 };
+const FIT_VIEW_OPTIONS_PREVIEW: RF.FitViewOptions = { maxZoom: 1, minZoom:
0.1, duration: 0 };
export const DEFAULT_VIEWPORT = { x: 100, y: 100, zoom: 1 };
@@ -165,8 +166,8 @@ export type DiagramRef = {
getReactFlowInstance: () => RF.ReactFlowInstance | undefined;
};
-export const Diagram = React.forwardRef<DiagramRef, { container:
React.RefObject<HTMLElement> }>(
- ({ container }, ref) => {
+export const Diagram = React.forwardRef<DiagramRef, { container:
React.RefObject<HTMLElement>; previewMode?: boolean }>(
+ ({ container, previewMode }, ref) => {
// Contexts
const dmnEditorStoreApi = useDmnEditorStoreApi();
@@ -1397,8 +1398,8 @@ export const Diagram = React.forwardRef<DiagramRef, {
container: React.RefObject
snapToGrid={true}
snapGrid={rfSnapGrid}
defaultViewport={viewport}
- fitView={false}
- fitViewOptions={FIT_VIEW_OPTIONS}
+ fitView={previewMode ? true : false}
+ fitViewOptions={previewMode ? FIT_VIEW_OPTIONS_PREVIEW :
FIT_VIEW_OPTIONS}
attributionPosition={"bottom-right"}
onInit={setReactFlowInstance}
deleteKeyCode={settings.isReadOnly ? [] : DELETE_NODE_KEY_CODES}
@@ -1409,11 +1410,11 @@ export const Diagram = React.forwardRef<DiagramRef, {
container: React.RefObject
// (end)
>
<SelectionStatus />
- <Palette pulse={isEmptyStateShowing} />
- <TopRightCornerPanels
availableHeight={container.current?.offsetHeight} />
+ {!previewMode && <Palette pulse={isEmptyStateShowing} />}
+ {!previewMode && <TopRightCornerPanels
availableHeight={container.current?.offsetHeight} />}
<DiagramCommands />
{!isFirefox && <RF.Background />}
- <RF.Controls fitViewOptions={FIT_VIEW_OPTIONS}
position={"bottom-right"} />
+ {!previewMode && <RF.Controls fitViewOptions={FIT_VIEW_OPTIONS}
position={"bottom-right"} />}
<SetConnectionToReactFlowStore />
<ViewportWatcher />
</RF.ReactFlow>
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
