Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
2 changes: 1 addition & 1 deletion hugo/content/docs/recipes/styling.md
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,7 @@ class MyNodeView extends ShapeView {

## Styling on User Interaction

Taking advantage of the conditional CSS classes, you can also apply styles to your diagram elements based on [user interaction]({{< ref "/docs/ref/user-interaction" >}}). For example, you could apply a CSS class to a node when it is selected. Without going into the details of how to handle user interaction, let's look at how Sprotty's default views handle this.
Taking advantage of the conditional CSS classes, you can also apply styles to your diagram elements based on user interaction. For example, you could apply a CSS class to a node when it is selected. Without going into the details of how to handle user interaction, let's look at how Sprotty's default views handle this.

`SNodeImpl` has the default feature `selectFeature`, meaning that when a node is selected, its `selected` property is set to `true`. This property can be used in the corresponding view to add a CSS class to the selected element. For example in the `RectangularNodeView`:

Expand Down
2 changes: 1 addition & 1 deletion hugo/content/docs/ref/features.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export class SNodeImpl extends SConnectableElementImpl implements Selectable, Fa
}
```

It is possible to fine-tune the behavior in the [dependency injection container]({{< ref "/docs/concepts/extension-points">}}#dependency-injection) by enabling or disabling features for a given model element type.
It is possible to fine-tune the behavior in the [dependency injection container]({{< relref "extension-points">}}#dependency-injection) by enabling or disabling features for a given model element type.

```typescript
configureElement('my-node-type', SNodeImpl, RectangularNodeView, {enable: [layoutableChildFeature], disable: [moveFeature]})
Expand Down
48 changes: 24 additions & 24 deletions hugo/content/docs/ref/smodel.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ This is the base class for **all** elements of the diagram model. This ensures t

* `type: string`: The type of the element. This value is used in the Sprotty configuration to specify the corresponding view for all elements of this type.
* `id: string`: The globally unique identifier of the element.
* `features: FeatureSet` - *optional*: A set of [features]({{< ref "/docs/ref/features" >}}) that are enabled on the element. The list of features can be further configured in the [dependency injection container]({{< ref "/docs/concepts/extension-points">}}#dependency-injection).
* `features: FeatureSet` - *optional*: A set of [features]({{< relref "features" >}}) that are enabled on the element. The list of features can be further configured in the [dependency injection container]({{< relref "extension-points">}}#dependency-injection).
* `cssClasses: string[]` - *optional*: A list of CSS classes that should be applied to the element.

### SParentElementImpl
Expand Down Expand Up @@ -142,15 +142,15 @@ Model element for **Nodes**, which are the main entity in a graph. A node can be

*Default features:*

* [connectableFeature]({{< ref "/docs/ref/features" >}}#connectablefeature)
* [deletableFeature]({{< ref "/docs/ref/features" >}}#deletablefeature)
* [selectFeature]({{< ref "/docs/ref/features" >}}#selectfeature)
* [boundsFeature]({{< ref "/docs/ref/features" >}}#boundsfeature)
* [moveFeature]({{< ref "/docs/ref/features" >}}#movefeature)
* [layoutContainerFeature]({{< ref "/docs/ref/features" >}}#layoutcontainerfeature)
* [fadeFeature]({{< ref "/docs/ref/features" >}}#fadefeature)
* [hoverFeedbackFeature]({{< ref "/docs/ref/features" >}}#hoverfeedbackfeature)
* [popupFeature]({{< ref "/docs/ref/features" >}}#popupfeature)
* [connectableFeature]({{< relref "features" >}}#connectablefeature)
* [deletableFeature]({{< relref "features" >}}#deletablefeature)
* [selectFeature]({{< relref "features" >}}#selectfeature)
* [boundsFeature]({{< relref "features" >}}#boundsfeature)
* [moveFeature]({{< relref "features" >}}#movefeature)
* [layoutContainerFeature]({{< relref "features" >}}#layoutcontainerfeature)
* [fadeFeature]({{< relref "features" >}}#fadefeature)
* [hoverFeedbackFeature]({{< relref "features" >}}#hoverfeedbackfeature)
* [popupFeature]({{< relref "features" >}}#popupfeature)

### SPortImpl

Expand All @@ -168,11 +168,11 @@ A port is a connection point for edges. It should **always** be contained in an

*Default features:*

* [connectableFeature]({{< ref "/docs/ref/features" >}}#connectablefeature)
* [selectFeature]({{< ref "/docs/ref/features" >}}#selectfeature)
* [boundsFeature]({{< ref "/docs/ref/features" >}}#boundsfeature)
* [fadeFeature]({{< ref "/docs/ref/features" >}}#fadefeature)
* [hoverFeedbackFeature]({{< ref "/docs/ref/features" >}}#hoverfeedbackfeature)
* [connectableFeature]({{< relref "features" >}}#connectablefeature)
* [selectFeature]({{< relref "features" >}}#selectfeature)
* [boundsFeature]({{< relref "features" >}}#boundsfeature)
* [fadeFeature]({{< relref "features" >}}#fadefeature)
* [hoverFeedbackFeature]({{< relref "features" >}}#hoverfeedbackfeature)

### SEdgeImpl

Expand Down Expand Up @@ -221,11 +221,11 @@ A label represents some text to be displayed and attached to a node, compartment

*Default features:*

* [boundsFeature]({{< ref "/docs/ref/features" >}}#boundsfeature)
* [alignFeature]({{< ref "/docs/ref/features" >}}#alignfeature)
* [layoutableChildFeature]({{< ref "/docs/ref/features" >}}#layoutablechildfeature)
* [edgeLayoutFeature]({{< ref "/docs/ref/features" >}}#edgelayoutfeature)
* [fadeFeature]({{< ref "/docs/ref/features" >}}#fadefeature)
* [boundsFeature]({{< relref "features" >}}#boundsfeature)
* [alignFeature]({{< relref "features" >}}#alignfeature)
* [layoutableChildFeature]({{< relref "features" >}}#layoutablechildfeature)
* [edgeLayoutFeature]({{< relref "features" >}}#edgelayoutfeature)
* [fadeFeature]({{< relref "features" >}}#fadefeature)

### SCompartmentImpl

Expand All @@ -242,10 +242,10 @@ A compartment is used to group multiple child elements of a node or compartment,

*Default features:*

* [boundsFeature]({{< ref "/docs/ref/features" >}}#boundsfeature)
* [layoutContainerFeature]({{< ref "/docs/ref/features" >}}#layoutcontainerfeature)
* [layoutableChildFeature]({{< ref "/docs/ref/features" >}}#layoutablechildfeature)
* [fadeFeature]({{< ref "/docs/ref/features" >}}#fadefeature)
* [boundsFeature]({{< relref "features" >}}#boundsfeature)
* [layoutContainerFeature]({{< relref "features" >}}#layoutcontainerfeature)
* [layoutableChildFeature]({{< relref "features" >}}#layoutablechildfeature)
* [fadeFeature]({{< relref "features" >}}#fadefeature)

### SGraphIndex

Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@

[sprotty](../globals) / [AddRemoveBezierSegmentAction](../Namespace.AddRemoveBezierSegmentAction) / create

# Function: create()

> **create**(`actionTask`, `targetId`): [`AddRemoveBezierSegmentAction`](../Interface.AddRemoveBezierSegmentAction)

Defined in: [packages/sprotty/src/features/routing/bezier-edge-router.ts:341](https://github.com/eclipse-sprotty/sprotty/blob/f9b2433481cc27a1ac0c92d525a92039ae7f6c76/packages/sprotty/src/features/routing/bezier-edge-router.ts#L341)

## Parameters

### actionTask

`"add"` | `"remove"`

### targetId

`string`

## Returns

[`AddRemoveBezierSegmentAction`](../Interface.AddRemoveBezierSegmentAction)
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@

[sprotty](../globals) / [AddRemoveBezierSegmentAction](../Namespace.AddRemoveBezierSegmentAction) / KIND

# Variable: KIND

> `const` **KIND**: `"addRemoveBezierSegment"` = `'addRemoveBezierSegment'`

Defined in: [packages/sprotty/src/features/routing/bezier-edge-router.ts:340](https://github.com/eclipse-sprotty/sprotty/blob/f9b2433481cc27a1ac0c92d525a92039ae7f6c76/packages/sprotty/src/features/routing/bezier-edge-router.ts#L340)
Loading
Loading