diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 92e7c22b14..acfee0a0ca 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -159,6 +159,7 @@ export { default as ObjectIdentity } from './util/ObjectIdentity'; export { default as Point } from './view/geometry/Point'; export { default as Rectangle } from './view/geometry/Rectangle'; +export * from './view/style/config'; export { default as EdgeStyle } from './view/style/EdgeStyle'; export { default as Perimeter } from './view/style/Perimeter'; export { default as StyleRegistry } from './view/style/StyleRegistry'; diff --git a/packages/core/src/util/Constants.ts b/packages/core/src/util/Constants.ts index 7f46416fcb..c02095ebb2 100644 --- a/packages/core/src/util/Constants.ts +++ b/packages/core/src/util/Constants.ts @@ -362,8 +362,7 @@ export const DEFAULT_MARKERSIZE = 6; export const DEFAULT_IMAGESIZE = 24; /** - * Defines the length of the horizontal segment of an `Entity Relation`. - * This can be overridden using {@link CellStateStyle.segment} style. + * Default value of {@link EntityRelationConnectorConfig.segment}. */ export const ENTITY_SEGMENT = 30; diff --git a/packages/core/src/view/style/config.ts b/packages/core/src/view/style/config.ts new file mode 100644 index 0000000000..518f63a897 --- /dev/null +++ b/packages/core/src/view/style/config.ts @@ -0,0 +1,45 @@ +/* +Copyright 2025-present The maxGraph project Contributors + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import { ENTITY_SEGMENT } from '../../util/Constants'; + +/** + * Configure the `Entity Relation connector` defaults for maxGraph. + * + * @experimental subject to change or removal. maxGraph's global configuration may be modified in the future without prior notice. + * @since 0.15.0 + * @category Configuration + */ +export const EntityRelationConnectorConfig = { + /** + * Defines the length of the horizontal segment of an `Entity Relation`. + * This can be overridden using {@link CellStateStyle.segment} style. + * @default {@link ENTITY_SEGMENT} + */ + segment: ENTITY_SEGMENT, +}; + +/** + * Resets {@link EntityRelationConnectorConfig} to default values. + * + * @experimental Subject to change or removal. maxGraph's global configuration may be modified in the future without prior notice. + * @since 0.15.0 + * @category Configuration + */ +export const resetEntityRelationConnectorConfig = (): void => { + // implement the reset manually as there are a few properties for now + EntityRelationConnectorConfig.segment = ENTITY_SEGMENT; +}; diff --git a/packages/core/src/view/style/edge/EntityRelation.ts b/packages/core/src/view/style/edge/EntityRelation.ts index 04791f583d..29c49fa413 100644 --- a/packages/core/src/view/style/edge/EntityRelation.ts +++ b/packages/core/src/view/style/edge/EntityRelation.ts @@ -19,11 +19,10 @@ limitations under the License. import CellState from '../../cell/CellState'; import Geometry from '../../geometry/Geometry'; import Point from '../../geometry/Point'; -import { DIRECTION_MASK, ENTITY_SEGMENT } from '../../../util/Constants'; +import { DIRECTION_MASK } from '../../../util/Constants'; import { getPortConstraints } from '../../../util/mathUtils'; -import { getValue } from '../../../util/Utils'; - import type { EdgeStyleFunction } from '../../../types'; +import { EntityRelationConnectorConfig } from '../config'; export const EntityRelation: EdgeStyleFunction = ( state: CellState, @@ -33,7 +32,8 @@ export const EntityRelation: EdgeStyleFunction = ( result: Point[] ) => { const { view } = state; - const segment = getValue(state.style, 'segment', ENTITY_SEGMENT) * view.scale; + const segment = + (state.style?.segment ?? EntityRelationConnectorConfig.segment) * view.scale; const pts = state.absolutePoints; const p0 = pts[0]; diff --git a/packages/html/.storybook/preview.ts b/packages/html/.storybook/preview.ts index f28b6cb4c7..d4eeff40ee 100644 --- a/packages/html/.storybook/preview.ts +++ b/packages/html/.storybook/preview.ts @@ -3,6 +3,7 @@ import { GlobalConfig, NoOpLogger, resetEdgeHandlerConfig, + resetEntityRelationConnectorConfig, resetHandleConfig, resetStyleDefaultsConfig, resetVertexHandlerConfig, @@ -19,6 +20,7 @@ const resetMaxGraphConfigs = (): void => { GlobalConfig.logger = defaultLogger; resetEdgeHandlerConfig(); + resetEntityRelationConnectorConfig(); resetHandleConfig(); resetStyleDefaultsConfig(); resetVertexHandlerConfig(); diff --git a/packages/html/stories/Folding.stories.ts b/packages/html/stories/Folding.stories.ts index 4e17f4ce7b..6fc4df962b 100644 --- a/packages/html/stories/Folding.stories.ts +++ b/packages/html/stories/Folding.stories.ts @@ -15,7 +15,14 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { constants, EdgeStyle, Graph, LayoutManager, StackLayout } from '@maxgraph/core'; +import { + constants, + EdgeStyle, + EntityRelationConnectorConfig, + Graph, + LayoutManager, + StackLayout, +} from '@maxgraph/core'; import { globalTypes, globalValues } from './shared/args.js'; import { configureExpandedAndCollapsedImages, @@ -37,9 +44,8 @@ const Template = ({ label, ...args }: Record) => { configureImagesBasePath(); const container = createGraphContainer(args); - // TODO Allow overriding constants. See https://github.com/maxGraph/maxGraph/issues/192 - // Enables crisp rendering of rectangles in SVG - // constants.ENTITY_SEGMENT = 20; + // Override default values + EntityRelationConnectorConfig.segment = 20; // Creates the graph inside the given container const graph = new Graph(container); diff --git a/packages/website/docs/usage/global-configuration.md b/packages/website/docs/usage/global-configuration.md index ea0b887bdf..fafa34c19b 100644 --- a/packages/website/docs/usage/global-configuration.md +++ b/packages/website/docs/usage/global-configuration.md @@ -14,6 +14,7 @@ The following objects can be used to configure `maxGraph` globally: - `Client`: this is the historical entry point for global configuration, coming from the `mxGraph` library. - `EdgeHandlerConfig` (since 0.14.0): for `EdgeHandler` (including subclasses). + - `EntityRelationConnectorConfig` (since 0.15.0): for the `EntityRelation` Connector/EdgeStyle. - `GlobalConfig` (since 0.11.0): for shared resources (logger). - `HandleConfig` (since 0.14.0): for shared handle configurations. - `StencilShapeConfig` (since 0.11.0): for stencil shapes. @@ -23,6 +24,7 @@ The following objects can be used to configure `maxGraph` globally: Some functions are provided to reset the global configuration to the default values. For example: - `resetEdgeHandlerConfig` (since 0.14.0) + - `resetEntityRelationConnectorConfig` (since 0.15.0) - `resetHandleConfig` (since 0.14.0) - `resetStyleDefaultsConfig` (since 0.14.0) - `resetVertexHandlerConfig` (since 0.14.0)