@eclipse-papyrus/papyrus-web-parent 2026.2.0

package/papyrus-web/src/fonts.css

@@ -0,0 +1,81 @@
+/*******************************************************************************
+ * Copyright (c) 2019, 2020 Obeo.
+ * This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v2.0
+ * which accompanies this distribution, and is available at
+ * https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *     Obeo - initial API and implementation
+ *******************************************************************************/
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 100;
+  src: url(./fonts/Lato/Lato-Thin.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 100;
+  src: url(./fonts/Lato/Lato-ThinItalic.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 300;
+  src: url(./fonts/Lato/Lato-Light.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 300;
+  src: url(./fonts/Lato/Lato-LightItalic.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 400;
+  src: url(./fonts/Lato/Lato-Regular.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 400;
+  src: url(./fonts/Lato/Lato-Italic.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 700;
+  src: url(./fonts/Lato/Lato-Bold.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 700;
+  src: url(./fonts/Lato/Lato-BoldItalic.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: normal;
+  font-weight: 900;
+  src: url(./fonts/Lato/Lato-Black.ttf) format('truetype');
+}
+
+@font-face {
+  font-family: 'Lato';
+  font-style: italic;
+  font-weight: 900;
+  src: url(./fonts/Lato/Lato-BlackItalic.ttf) format('truetype');
+}

package/papyrus-web/src/footer/Footer.tsx

@@ -0,0 +1,50 @@
+/*******************************************************************************
+ * Copyright (c) 2021, 2024 Obeo.
+ * This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v2.0
+ * which accompanies this distribution, and is available at
+ * https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *     Obeo - initial API and implementation
+ *******************************************************************************/
+import Link from '@mui/material/Link';
+import { makeStyles } from 'tss-react/mui';
+import Typography from '@mui/material/Typography';
+
+const useFooterStyles = makeStyles()((theme) => ({
+  footer: {
+    display: 'flex',
+    justifyContent: 'center',
+    margin: theme.spacing(2),
+    '& > *': {
+      marginLeft: theme.spacing(0.5),
+      marginRight: theme.spacing(0.5),
+    },
+  },
+}));
+
+export const Footer = () => {
+  const { classes } = useFooterStyles();
+  return (
+    <footer className={classes.footer}>
+      <Typography variant="caption">
+        &copy; {new Date().getFullYear()} CEA LIST, Obeo, Artal. Powered by&nbsp;
+      </Typography>
+      <Link
+        variant="caption"
+        href="https://gitlab.eclipse.org/eclipse/papyrus/org.eclipse.papyrus-web"
+        rel="noopener noreferrer"
+        target="_blank">
+        Papyrus Web.
+      </Link>
+      &nbsp;
+      <Typography variant="caption">Papyrus-Web is developed under the&nbsp;</Typography>
+      <Link variant="caption" href="https://www.eclipse.org/legal/epl-2.0" rel="noopener noreferrer" target="_blank">
+        EPL v2 License.
+      </Link>
+    </footer>
+  );
+};

package/papyrus-web/src/index.tsx

@@ -0,0 +1,325 @@
+/*******************************************************************************
+ * Copyright (c) 2019, 2025 CEA LIST, Obeo.
+ * This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v2.0
+ * which accompanies this distribution, and is available at
+ * https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *     Obeo - initial API and implementation
+ *     Titouan BOUETE-GIRAUD (Artal Technologies) - Issue 210
+ *******************************************************************************/
+import { loadDevMessages, loadErrorMessages } from '@apollo/client/dev';
+import { ExtensionRegistry } from '@eclipse-sirius/sirius-components-core';
+import {
+  DiagramPaletteToolContributionProps,
+  diagramPaletteToolExtensionPoint,
+  EdgeData,
+  NodeData,
+  NodeTypeContribution,
+} from '@eclipse-sirius/sirius-components-diagrams';
+import {
+  ApolloClientOptionsConfigurer,
+  apolloClientOptionsConfigurersExtensionPoint,
+  DefaultExtensionRegistryMergeStrategy,
+  DiagramRepresentationConfiguration,
+  footerExtensionPoint,
+  navigationBarIconExtensionPoint,
+  navigationBarMenuHelpURLExtensionPoint,
+  NodeTypeRegistry,
+  SiriusWebApplication,
+} from '@eclipse-sirius/sirius-web-application';
+import { forkRegistry } from '@eclipse-sirius/sirius-web-view-fork';
+import FormatListBulletedIcon from '@mui/icons-material/FormatListBulleted';
+import { httpOrigin, wsOrigin } from './core/URL';
+import { CuboidNode } from '@eclipse-papyrus/papyrus-web-components';
+import { CuboidNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { CuboidNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { CuboidNodeListConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { CuboidNodeListLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { CustomImageNode } from '@eclipse-papyrus/papyrus-web-components';
+import { CustomImageNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { CustomImageNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { EllipseNode } from '@eclipse-papyrus/papyrus-web-components';
+import { EllipseNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { EllipseNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { InnerFlagNode } from '@eclipse-papyrus/papyrus-web-components';
+import { InnerFlagNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { InnerFlagNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { NoteNode } from '@eclipse-papyrus/papyrus-web-components';
+import { NoteNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { NoteNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { OuterFlagNode } from '@eclipse-papyrus/papyrus-web-components';
+import { OuterFlagNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { OuterFlagNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { PackageNode } from '@eclipse-papyrus/papyrus-web-components';
+import { PackageNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { PackageNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { PackageNodeListConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { PackageNodeListLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+import { RectangleWithExternalLabelNode } from '@eclipse-papyrus/papyrus-web-components';
+import { RectangleWithExternalLabelNodeConverter } from '@eclipse-papyrus/papyrus-web-components';
+import { RectangleWithExternalLabelNodeLayoutHandler } from '@eclipse-papyrus/papyrus-web-components';
+
+import {
+  GQLWidget,
+  PropertySectionComponent,
+  widgetContributionExtensionPoint,
+} from '@eclipse-sirius/sirius-components-forms';
+import { treeItemContextMenuEntryExtensionPoint } from '@eclipse-sirius/sirius-components-trees';
+import {
+  ReferenceIcon,
+  ReferencePreview,
+  ReferencePropertySection,
+} from '@eclipse-sirius/sirius-components-widget-reference';
+import './ReactFlow.css';
+import { PapyrusPopupToolContribution } from '@eclipse-papyrus/papyrus-web-components';
+import './fonts.css';
+import { Footer } from './footer/Footer';
+import { nodesStyleDocumentTransform } from '@eclipse-papyrus/papyrus-web-components';
+import './portals.css';
+import { UMLModelTreeItemContextMenuContribution } from '@eclipse-papyrus/papyrus-web-components';
+import { UMLElementTreeItemContextMenuContribution } from '@eclipse-papyrus/papyrus-web-components';
+import './reset.css';
+import './variables.css';
+import { customWidgetsDocumentTransform } from '@eclipse-papyrus/papyrus-web-components';
+
+import { Edge, Node } from '@xyflow/react';
+import { ExtensionRegistryMergeStrategy } from './extensions/ExtensionRegistryMergeStrategy';
+import { createRoot } from 'react-dom/client';
+import { PapyrusNavigationBarIcon } from './core/PapyrusNavigationBarIcon';
+import { PublishProfileTreeItemContextMenuContribution } from '@eclipse-papyrus/papyrus-web-components';
+import { ContainmentReferenceIcon } from '@eclipse-papyrus/papyrus-web-components';
+import { ContainmentReferencePreview } from '@eclipse-papyrus/papyrus-web-components';
+import { ContainmentReferenceSection } from '@eclipse-papyrus/papyrus-web-components';
+import { CustomImageIcon } from '@eclipse-papyrus/papyrus-web-components';
+import { CustomImagePreview } from '@eclipse-papyrus/papyrus-web-components';
+import { CustomImageSection } from '@eclipse-papyrus/papyrus-web-components';
+import { LanguageExpressionIcon } from '@eclipse-papyrus/papyrus-web-components';
+import { LanguageExpressionPreview } from '@eclipse-papyrus/papyrus-web-components';
+import { LanguageExpressionSection } from '@eclipse-papyrus/papyrus-web-components';
+import { PrimitiveListWidgetPreview } from '@eclipse-papyrus/papyrus-web-components';
+import { PrimitiveListSection } from '@eclipse-papyrus/papyrus-web-components';
+import { PrimitiveRadioIcon } from '@eclipse-papyrus/papyrus-web-components';
+import { PrimitiveRadioPreview } from '@eclipse-papyrus/papyrus-web-components';
+import { PrimitiveRadioSection } from '@eclipse-papyrus/papyrus-web-components';
+
+if (process.env.NODE_ENV !== 'production') {
+  loadDevMessages();
+  loadErrorMessages();
+}
+
+const extensionRegistry: ExtensionRegistry = new ExtensionRegistry();
+
+/*
+ * Custom node contribution
+ */
+const nodeTypeRegistryValue: NodeTypeRegistry = {
+  nodeLayoutHandlers: [
+    new EllipseNodeLayoutHandler(),
+    new PackageNodeLayoutHandler(),
+    new PackageNodeListLayoutHandler(),
+    new RectangleWithExternalLabelNodeLayoutHandler(),
+    new NoteNodeLayoutHandler(),
+    new InnerFlagNodeLayoutHandler(),
+    new OuterFlagNodeLayoutHandler(),
+    new CuboidNodeLayoutHandler(),
+    new CuboidNodeListLayoutHandler(),
+    new CustomImageNodeLayoutHandler(),
+  ],
+  nodeConverters: [
+    new EllipseNodeConverter(),
+    new PackageNodeConverter(),
+    new PackageNodeListConverter(),
+    new RectangleWithExternalLabelNodeConverter(),
+    new NoteNodeConverter(),
+    new InnerFlagNodeConverter(),
+    new OuterFlagNodeConverter(),
+    new CuboidNodeConverter(),
+    new CuboidNodeListConverter(),
+    new CustomImageNodeConverter(),
+  ],
+  nodeTypeContributions: [
+    <NodeTypeContribution component={EllipseNode} type={'ellipseNode'} />,
+    <NodeTypeContribution component={PackageNode} type={'packageNode'} />,
+    <NodeTypeContribution component={PackageNode} type={'packageNodeList'} />,
+    <NodeTypeContribution component={RectangleWithExternalLabelNode} type={'rectangleWithExternalLabelNode'} />,
+    <NodeTypeContribution component={NoteNode} type={'noteNode'} />,
+    <NodeTypeContribution component={InnerFlagNode} type={'innerFlagNode'} />,
+    <NodeTypeContribution component={OuterFlagNode} type={'outerFlagNode'} />,
+    <NodeTypeContribution component={CuboidNode} type={'cuboidNode'} />,
+    <NodeTypeContribution component={CuboidNode} type={'cuboidNodeList'} />,
+    <NodeTypeContribution component={CustomImageNode} type={'customImageNode'} />,
+  ],
+};
+
+// Contribution to modify GraphQl requests to handle custom node
+const nodeApolloClientOptionsConfigurer: ApolloClientOptionsConfigurer = (currentOptions) => {
+  const { documentTransform } = currentOptions;
+
+  const newDocumentTransform = documentTransform
+    ? documentTransform.concat(nodesStyleDocumentTransform)
+    : nodesStyleDocumentTransform;
+  return {
+    ...currentOptions,
+    documentTransform: newDocumentTransform,
+  };
+};
+
+/*
+ * Custom widgets contribution
+ */
+
+// Contribution to modify GraphQl requests to handle custom widgets
+const widgetsApolloClientOptionsConfigurer: ApolloClientOptionsConfigurer = (currentOptions) => {
+  const { documentTransform } = currentOptions;
+
+  const newDocumentTransform = documentTransform
+    ? documentTransform.concat(customWidgetsDocumentTransform)
+    : customWidgetsDocumentTransform;
+  return {
+    ...currentOptions,
+    documentTransform: newDocumentTransform,
+  };
+};
+
+extensionRegistry.putData(widgetContributionExtensionPoint, {
+  identifier: 'papyrus-custom-widget-primitive-list',
+  data: [
+    {
+      name: 'PrimitiveListWidget',
+      icon: <FormatListBulletedIcon />,
+      previewComponent: PrimitiveListWidgetPreview,
+      component: (widget: GQLWidget): PropertySectionComponent<GQLWidget> | null => {
+        if (widget.__typename === 'PrimitiveListWidget') {
+          return PrimitiveListSection;
+        }
+        return null;
+      },
+    },
+    {
+      name: 'LanguageExpression',
+      icon: <LanguageExpressionIcon />,
+      previewComponent: LanguageExpressionPreview,
+      component: (widget: GQLWidget): PropertySectionComponent<GQLWidget> | null => {
+        if (widget.__typename === 'LanguageExpression') {
+          return LanguageExpressionSection;
+        }
+        return null;
+      },
+    },
+    {
+      name: 'ContainmentReferenceWidget',
+      icon: <ContainmentReferenceIcon />,
+      previewComponent: ContainmentReferencePreview,
+      component: (widget: GQLWidget): PropertySectionComponent<GQLWidget> | null => {
+        if (widget.__typename === 'ContainmentReferenceWidget') {
+          return ContainmentReferenceSection;
+        }
+        return null;
+      },
+    },
+    {
+      name: 'PrimitiveRadio',
+      icon: <PrimitiveRadioIcon />,
+      previewComponent: PrimitiveRadioPreview,
+      component: (widget: GQLWidget): PropertySectionComponent<GQLWidget> | null => {
+        if (widget.__typename === 'PrimitiveRadio') {
+          return PrimitiveRadioSection;
+        }
+        return null;
+      },
+    },
+    {
+      name: 'ReferenceWidget',
+      icon: <ReferenceIcon />,
+      previewComponent: ReferencePreview,
+      component: (widget: GQLWidget): PropertySectionComponent<GQLWidget> | null => {
+        let propertySectionComponent: PropertySectionComponent<GQLWidget> | null = null;
+
+        if (widget.__typename === 'ReferenceWidget') {
+          propertySectionComponent = ReferencePropertySection;
+        }
+        return propertySectionComponent;
+      },
+    },
+    {
+      name: 'CustomImageWidget',
+      icon: <CustomImageIcon />,
+      previewComponent: CustomImagePreview,
+      component: (widget: GQLWidget): PropertySectionComponent<GQLWidget> | null => {
+        if (widget.__typename === 'CustomImageWidget') {
+          return CustomImageSection;
+        }
+        return null;
+      },
+    },
+  ],
+});
+
+// Plug both (widgets and node) graphQl document transformers
+extensionRegistry.putData(apolloClientOptionsConfigurersExtensionPoint, {
+  identifier: `papyrusweb_${apolloClientOptionsConfigurersExtensionPoint.identifier}`,
+  data: [nodeApolloClientOptionsConfigurer, widgetsApolloClientOptionsConfigurer],
+});
+
+// Palette tools contribution
+const diagramPaletteToolContributions: DiagramPaletteToolContributionProps[] = [
+  {
+    canHandle: (_: Node<NodeData> | Edge<EdgeData>) => true,
+    component: PapyrusPopupToolContribution,
+  },
+];
+extensionRegistry.putData<DiagramPaletteToolContributionProps[]>(diagramPaletteToolExtensionPoint, {
+  identifier: 'papyrus-diagram-tools',
+  data: diagramPaletteToolContributions,
+});
+
+// Tree Item context menu contributions
+extensionRegistry.addComponent(treeItemContextMenuEntryExtensionPoint, {
+  identifier: 'papyrus-custom-tree-menu-profile',
+  Component: UMLModelTreeItemContextMenuContribution,
+});
+extensionRegistry.addComponent(treeItemContextMenuEntryExtensionPoint, {
+  identifier: 'papyrus-custom-tree-menu-stereotype',
+  Component: UMLElementTreeItemContextMenuContribution,
+});
+extensionRegistry.addComponent(treeItemContextMenuEntryExtensionPoint, {
+  identifier: 'papyrus-custom-tree-menu-publish-profile',
+  Component: PublishProfileTreeItemContextMenuContribution,
+});
+
+// Footer contribution
+extensionRegistry.addComponent(footerExtensionPoint, {
+  identifier: 'papyrus-footer',
+  Component: Footer,
+});
+
+// Main icon contribution
+extensionRegistry.addComponent(navigationBarIconExtensionPoint, {
+  identifier: 'papyrusweb_navigationbar#icon',
+  Component: PapyrusNavigationBarIcon,
+});
+
+// Customize help url
+extensionRegistry.putData(navigationBarMenuHelpURLExtensionPoint, {
+  identifier: `papyrus_web_doc_${navigationBarMenuHelpURLExtensionPoint.identifier}`,
+  data: `${httpOrigin}/doc/index.html`,
+});
+
+// Table contribution
+extensionRegistry.addAll(forkRegistry, new DefaultExtensionRegistryMergeStrategy());
+
+const container = document.getElementById('root');
+const root = createRoot(container!);
+root.render(
+  <SiriusWebApplication
+    httpOrigin={httpOrigin}
+    wsOrigin={wsOrigin}
+    extensionRegistry={extensionRegistry}
+    extensionRegistryMergeStrategy={new ExtensionRegistryMergeStrategy()}>
+    <DiagramRepresentationConfiguration nodeTypeRegistry={nodeTypeRegistryValue} />
+  </SiriusWebApplication>
+);

package/papyrus-web/src/portals.css

@@ -0,0 +1,16 @@
+/*******************************************************************************
+ * Copyright (c) 2023, 2024 Obeo.
+ * This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v2.0
+ * which accompanies this distribution, and is available at
+ * https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *     Obeo - initial API and implementation
+ *******************************************************************************/
+
+.react-grid-item.react-grid-placeholder {
+  background: #be1a78;
+}

package/papyrus-web/src/react-app-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="react-scripts" />

package/papyrus-web/src/reset.css

@@ -0,0 +1,218 @@
+/*******************************************************************************
+ * Copyright (c) 2019, 2022 Obeo and others.
+ * This program and the accompanying materials
+ * are made available under the terms of the Eclipse Public License v2.0
+ * which accompanies this distribution, and is available at
+ * https://www.eclipse.org/legal/epl-2.0/
+ *
+ * SPDX-License-Identifier: EPL-2.0
+ *
+ * Contributors:
+ *     Obeo - initial API and implementation
+ *******************************************************************************/
+html,
+body,
+div,
+span,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+abbr,
+address,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+samp,
+small,
+strong,
+sub,
+sup,
+var,
+b,
+i,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  font-size: 100%;
+  vertical-align: baseline;
+  background: transparent;
+}
+
+*,
+*:before,
+*:after {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+:focus {
+  outline: 0;
+}
+
+body {
+  line-height: 1;
+  color: black;
+  background: white;
+}
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+
+nav ul {
+  list-style: none;
+}
+
+blockquote,
+q {
+  quotes: none;
+}
+
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: '';
+  content: none;
+}
+
+a {
+  margin: 0;
+  padding: 0;
+  font-size: 100%;
+  vertical-align: baseline;
+  background: transparent;
+}
+
+ins {
+  background-color: white;
+  color: black;
+  text-decoration: none;
+}
+
+mark {
+  background-color: white;
+  color: black;
+  font-style: inherit;
+  font-weight: inherit;
+}
+
+del {
+  text-decoration: line-through;
+}
+
+abbr[title],
+dfn[title] {
+  border-bottom: 1px dotted;
+  cursor: help;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+hr {
+  display: block;
+  height: 1px;
+  border: 0;
+  border-top: 1px solid black;
+  margin: 0;
+  padding: 0;
+}
+
+input,
+select {
+  vertical-align: middle;
+}
+
+ol,
+ul {
+  list-style: none;
+}
+
+[role='button'],
+input[type='submit'],
+input[type='reset'],
+input[type='button'],
+button {
+  background: none;
+  border: 0;
+  color: inherit;
+  font: inherit;
+  line-height: normal;
+  overflow: visible;
+  padding: 0;
+  -webkit-appearance: button; /* for input */
+  -webkit-user-select: none; /* for button */
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+input::-moz-focus-inner,
+button::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}