You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@camel.apache.org by ma...@apache.org on 2023/10/18 13:55:18 UTC
[camel-karavan] branch main updated: Fix #940
This is an automated email from the ASF dual-hosted git repository.
marat pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/camel-karavan.git
The following commit(s) were added to refs/heads/main by this push:
new 37f77fc7 Fix #940
37f77fc7 is described below
commit 37f77fc7707953b7f7e84de9679848246f066666
Author: Marat Gubaidullin <ma...@talismancloud.io>
AuthorDate: Wed Oct 18 09:55:09 2023 -0400
Fix #940
---
karavan-designer/src/App.tsx | 32 +-
karavan-designer/src/designer/KaravanDesigner.tsx | 2 +-
.../src/designer/icons/ComponentIcons.tsx | 908 ++-------------------
karavan-designer/src/designer/icons/EipIcons.tsx | 230 ++++++
.../src/designer/icons/KaravanIcons.tsx | 521 ++++++++++++
karavan-designer/src/designer/utils/CamelUi.tsx | 29 +-
karavan-designer/src/topology/CustomNode.tsx | 2 +-
karavan-designer/src/topology/TopologyTab.tsx | 1 +
karavan-space/src/designer/KaravanDesigner.tsx | 2 +-
.../src/designer/icons/ComponentIcons.tsx | 908 ++-------------------
karavan-space/src/designer/icons/EipIcons.tsx | 230 ++++++
karavan-space/src/designer/icons/KaravanIcons.tsx | 521 ++++++++++++
karavan-space/src/designer/utils/CamelUi.tsx | 29 +-
karavan-space/src/topology/CustomNode.tsx | 2 +-
karavan-space/src/topology/TopologyTab.tsx | 1 +
karavan-vscode/webview/topology/CustomNode.tsx | 2 +-
karavan-vscode/webview/topology/TopologyTab.tsx | 1 +
.../main/webui/src/designer/KaravanDesigner.tsx | 2 +-
.../KaravanIcons.tsx => icons/ComponentIcons.tsx} | 908 ++-------------------
.../src/main/webui/src/designer/icons/EipIcons.tsx | 230 ++++++
.../main/webui/src/designer/icons/KaravanIcons.tsx | 521 ++++++++++++
.../src/designer/templates/TemplatesDesigner.tsx | 71 --
.../src/main/webui/src/designer/utils/CamelUi.tsx | 29 +-
.../webui/src/designer/utils/KaravanComponents.tsx | 44 -
.../src/main/webui/src/topology/CustomNode.tsx | 2 +-
.../src/main/webui/src/topology/TopologyTab.tsx | 1 +
26 files changed, 2485 insertions(+), 2744 deletions(-)
diff --git a/karavan-designer/src/App.tsx b/karavan-designer/src/App.tsx
index 9e760223..933c493d 100644
--- a/karavan-designer/src/App.tsx
+++ b/karavan-designer/src/App.tsx
@@ -16,20 +16,32 @@
*/
import * as React from "react";
import {
- Bullseye, Button, Divider, Flex, FlexItem, Masthead,
- Page, PageSidebar, PageSidebarBody, Spinner, Tooltip,
+ Bullseye,
+ Button,
+ Divider,
+ Flex,
+ FlexItem,
+ Masthead,
+ Page,
+ PageSidebar,
+ PageSidebarBody,
+ Spinner,
+ Tooltip,
} from "@patternfly/react-core";
import {KameletApi} from "karavan-core/lib/api/KameletApi";
import {ComponentApi} from "karavan-core/lib/api/ComponentApi";
import {BlueprintIcon} from "@patternfly/react-icons";
import KnowledgebaseIcon from "@patternfly/react-icons/dist/js/icons/book-open-icon";
-import {KaravanIcon} from "./designer/utils/KaravanIcons";
+import TopologyIcon from "@patternfly/react-icons/dist/js/icons/topology-icon";
+import {KaravanIcon} from "./designer/icons/KaravanIcons";
import './designer/karavan.css';
import {DesignerPage} from "./DesignerPage";
import {TemplateApi} from "karavan-core/lib/api/TemplateApi";
import {KnowledgebasePage} from "./knowledgebase/KnowledgebasePage";
import {Notification} from "./designer/utils/Notification";
import {EventBus} from "./designer/utils/EventBus";
+import {TopologyTab} from "./topology/TopologyTab";
+import {IntegrationFile} from "./topology/TopologyStore";
class MenuItem {
pageId: string = '';
@@ -118,6 +130,7 @@ class App extends React.Component<Props, State> {
const {pageId} = this.state;
const pages: MenuItem[] = [
new MenuItem("designer", "Designer", <BlueprintIcon/>),
+ new MenuItem("topology", "Topology", <TopologyIcon/>),
new MenuItem("knowledgebase", "Knowledgebase", <KnowledgebaseIcon/>),
]
return (<Flex className="nav-buttons" direction={{default: "column"}} style={{height: "100%"}}
@@ -144,6 +157,10 @@ class App extends React.Component<Props, State> {
</Flex>)
}
+ getIntegrationFiles(): IntegrationFile[]{
+ return [new IntegrationFile("demo.camel.yaml", this.state.yaml)];
+ }
+
getPage() {
const { name, yaml, pageId} = this.state;
const dark = document.body.className.includes('vscode-dark');
@@ -160,6 +177,15 @@ class App extends React.Component<Props, State> {
return (
<KnowledgebasePage dark={dark}/>
)
+ case "topology":
+ return (
+ <TopologyTab
+ files={this.getIntegrationFiles()}
+ onSetFile={fileName => {}}
+ onClickCreateButton={() => {}}
+ hideToolbar={false}
+ />
+ )
}
}
diff --git a/karavan-designer/src/designer/KaravanDesigner.tsx b/karavan-designer/src/designer/KaravanDesigner.tsx
index 766b4e1f..4b7b3c7a 100644
--- a/karavan-designer/src/designer/KaravanDesigner.tsx
+++ b/karavan-designer/src/designer/KaravanDesigner.tsx
@@ -35,7 +35,7 @@ import {CamelUtil} from "karavan-core/lib/api/CamelUtil";
import {CamelUi} from "./utils/CamelUi";
import {useDesignerStore, useIntegrationStore} from "./DesignerStore";
import {shallow} from "zustand/shallow";
-import {getDesignerIcon} from "./utils/KaravanIcons";
+import {getDesignerIcon} from "./icons/KaravanIcons";
import {InfrastructureAPI} from "./utils/InfrastructureAPI";
import {EventBus, IntegrationUpdate} from "./utils/EventBus";
import {RestDesigner} from "./rest/RestDesigner";
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanIcons.tsx b/karavan-designer/src/designer/icons/ComponentIcons.tsx
similarity index 74%
copy from karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanIcons.tsx
copy to karavan-designer/src/designer/icons/ComponentIcons.tsx
index 906ba86e..a05f5e70 100644
--- a/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanIcons.tsx
+++ b/karavan-designer/src/designer/icons/ComponentIcons.tsx
@@ -16,736 +16,12 @@
*/
import React from 'react';
-export function KaravanIcon(className?: string) {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- xmlnsXlink="http://www.w3.org/1999/xlink"
- id="svg50"
- width="256"
- height="256"
- preserveAspectRatio="xMidYMid"
- version="1.1"
- viewBox="0 0 256 256"
- className={className ? className : "logo"}
- >
- <defs id="defs31">
- <linearGradient id="linearGradient1351">
- <stop
- id="stop1347"
- offset="0"
- stopColor="#dcffff"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop1349"
- offset="1"
- stopColor="#96d2e6"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <circle id="path-1" cx="128" cy="128" r="128"></circle>
- <linearGradient
- id="linearGradient-3"
- x1="-26.051"
- x2="254.316"
- y1="271.331"
- y2="0.048"
- gradientUnits="userSpaceOnUse"
- >
- <stop
- id="stop10"
- offset="0%"
- stopColor="#4790bb"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop12"
- offset="10.996%"
- stopColor="#64b7db"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop14"
- offset="94.502%"
- stopColor="#326ea0"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <linearGradient
- id="linearGradient-4"
- x1="-32.163"
- x2="259.338"
- y1="277.029"
- y2="-5.028"
- gradientUnits="userSpaceOnUse"
- >
- <stop id="stop17" offset="0%" stopColor="#F69923"></stop>
- <stop id="stop19" offset="8.048%" stopColor="#F79A23"></stop>
- <stop id="stop21" offset="41.874%" stopColor="#E97826"></stop>
- </linearGradient>
- <linearGradient
- id="linearGradient-5"
- x1="217.945"
- x2="99.459"
- y1="67.505"
- y2="247.005"
- gradientTransform="scale(.96442 1.0369)"
- gradientUnits="userSpaceOnUse"
- xlinkHref="#linearGradient-4"
- >
- <stop
- id="stop24"
- offset="0%"
- stopColor="#92d6d5"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop26"
- offset="41.191%"
- stopColor="#79b7cc"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop28"
- offset="73.271%"
- stopColor="#5891c5"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <mask id="mask-2" fill="#fff">
- <use id="use33" xlinkHref="#path-1"></use>
- </mask>
- <mask id="mask-2-7" fill="#fff">
- <use id="use137" xlinkHref="#path-1"></use>
- </mask>
- <linearGradient
- id="linearGradient1345"
- x1="233.122"
- x2="2.24"
- y1="56.015"
- y2="242.78"
- gradientUnits="userSpaceOnUse"
- xlinkHref="#linearGradient1351"
- ></linearGradient>
- </defs>
- <circle
- id="circle38"
- cx="127.994"
- cy="127.994"
- r="123.111"
- fill="url(#linearGradient-3)"
- fillRule="nonzero"
- mask="url(#mask-2)"
- ></circle>
- <g id="g2266">
- <path
- id="path42"
- fill="url(#linearGradient-5)"
- fillOpacity="1"
- fillRule="nonzero"
- d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412z"
- mask="url(#mask-2)"
- opacity="0.75"
- ></path>
- </g>
- <path
- id="path44"
- fill="#1e4b7b"
- fillOpacity="1"
- fillRule="nonzero"
- d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513z"
- mask="url(#mask-2)"
- opacity="0.75"
- ></path>
- <path
- id="path150"
- fill="url(#linearGradient1345)"
- fillOpacity="1"
- fillRule="nonzero"
- d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488z"
- mask="url(#mask-2-7)"
- transform="translate(-.769 -.133)"
- ></path>
- <path
- id="path40"
- fill="#2d4150"
- fillOpacity="1"
- fillRule="nonzero"
- d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232z"
- mask="url(#mask-2)"
- transform="translate(-.59) scale(1.00078)"
- ></path>
- </svg>
- );
-}
-
-export function CamelIcon(props?: (JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>) | undefined) {
- return (<svg
- xmlns="http://www.w3.org/2000/svg"
- xmlnsXlink="http://www.w3.org/1999/xlink"
- width={24}
- height={24}
- preserveAspectRatio="xMidYMid"
- viewBox="0 0 256 256"
- {...props}
- className="icon">
- <defs>
- <linearGradient
- id="b"
- x1="-12.564%"
- x2="101.304%"
- y1="108.214%"
- y2="-1.964%"
- >
- <stop offset="0%" stopColor="#F69923"/>
- <stop offset="10.996%" stopColor="#F79A23"/>
- <stop offset="94.502%" stopColor="#E97826"/>
- </linearGradient>
- <linearGradient
- id="d"
- x1="-12.564%"
- x2="101.304%"
- y1="108.214%"
- y2="-1.964%"
- >
- <stop offset="0%" stopColor="#F69923"/>
- <stop offset="8.048%" stopColor="#F79A23"/>
- <stop offset="41.874%" stopColor="#E97826"/>
- </linearGradient>
- <linearGradient
- id="e"
- x1="74.724%"
- x2="6.653%"
- y1="-3.059%"
- y2="100.066%"
- >
- <stop offset="0%" stopColor="#F6E423"/>
- <stop offset="41.191%" stopColor="#F79A23"/>
- <stop offset="73.271%" stopColor="#E97826"/>
- </linearGradient>
- <circle id="a" cx={128} cy={128} r={128}/>
- </defs>
- <mask id="c" fill="#fff">
- <use xlinkHref="#a"/>
- </mask>
- <circle
- cx={127.994}
- cy={127.994}
- r={123.111}
- fill="url(#b)"
- mask="url(#c)"
- />
- <path
- fill="url(#d)"
- d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128Zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232Z"
- mask="url(#c)"
- />
- <path
- fill="url(#e)"
- d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412Z"
- mask="url(#c)"
- opacity={0.75}
- />
- <path
- fill="#28170B"
- d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513Z"
- mask="url(#c)"
- opacity={0.75}
- />
- <path
- fill="#FFF"
- d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488Z"
- mask="url(#c)"
- />
- </svg>
- );
-}
-
-export function getDesignerIcon(icon: string) {
- if (icon === 'kamelet') return (
- <svg
- className="top-icon" id="icon"
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 32 32"
- >
- <title>{"application"}</title>
- <path d="M16 18H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2ZM6 6v10h10V6ZM26 12v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM26 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM16 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2Z" />
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- )
- if (icon === 'code') return (
- <svg
-
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- fill="none"
- viewBox="0 0 24 24"
- >
- <path
- fill="#000000"
- d="M8.502 5.387a.75.75 0 00-1.004-1.115L5.761 5.836c-.737.663-1.347 1.212-1.767 1.71-.44.525-.754 1.088-.754 1.784 0 .695.313 1.258.754 1.782.42.499 1.03 1.049 1.767 1.711l1.737 1.564a.75.75 0 101.004-1.115l-1.697-1.527c-.788-.709-1.319-1.19-1.663-1.598-.33-.393-.402-.622-.402-.817 0-.196.072-.425.402-.818.344-.409.875-.889 1.663-1.598l1.697-1.527zM14.18 4.275a.75.75 0 01.532.918l-3.987 15a.75.75 0 11-1.45-.386l3.987-15a.75.75 0 01.918-.532zM15.443 10.498a.75.75 0 011.059 [...]
- ></path>
- </svg>
- )
- if (icon === 'routes') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <path
- d="M29,10H24v2h5v6H22v2h3v2.142a4,4,0,1,0,2,0V20h2a2.0027,2.0027,0,0,0,2-2V12A2.0023,2.0023,0,0,0,29,10ZM28,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,28,26Z"/>
- <path
- d="M19,6H14V8h5v6H12v2h3v6.142a4,4,0,1,0,2,0V16h2a2.0023,2.0023,0,0,0,2-2V8A2.0023,2.0023,0,0,0,19,6ZM18,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,18,26Z"/>
- <path
- d="M9,2H3A2.002,2.002,0,0,0,1,4v6a2.002,2.002,0,0,0,2,2H5V22.142a4,4,0,1,0,2,0V12H9a2.002,2.002,0,0,0,2-2V4A2.002,2.002,0,0,0,9,2ZM8,26a2,2,0,1,1-2-2A2.0023,2.0023,0,0,1,8,26ZM3,10V4H9l.0015,6Z"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32"/>
- </svg>)
- if (icon === 'route') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <title>{"category"}</title>
- <path d="M27 22.141V18a2 2 0 0 0-2-2h-8v-4h2a2.002 2.002 0 0 0 2-2V4a2.002 2.002 0 0 0-2-2h-6a2.002 2.002 0 0 0-2 2v6a2.002 2.002 0 0 0 2 2h2v4H7a2 2 0 0 0-2 2v4.142a4 4 0 1 0 2 0V18h8v4.142a4 4 0 1 0 2 0V18h8v4.141a4 4 0 1 0 2 0ZM13 4h6l.001 6H13ZM8 26a2 2 0 1 1-2-2 2.002 2.002 0 0 1 2 2Zm10 0a2 2 0 1 1-2-2 2.003 2.003 0 0 1 2 2Zm8 2a2 2 0 1 1 2-2 2.002 2.002 0 0 1-2 2Z" />
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- )
- if (icon === 'rest') return (
- <svg className="top-icon" viewBox="0 0 32 32" width="32px" height="32px">
- <g className="layer">
- <title>Layer 1</title>
- <path
- d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
- id="svg_1"/>
- <path
- d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1.414 [...]
- id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
- </g>
- </svg>
- )
- if (icon === 'beans') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>data--1</title>
- <rect x="15" y="6" width="13" height="2"/>
- <rect x="15" y="24" width="13" height="2"/>
- <rect x="4" y="15" width="13" height="2"/>
- <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z" transform="translate(0 0)"/>
- <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z" transform="translate(0 0)"/>
- <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- if (icon === 'dependencies') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>application</title>
- <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
- transform="translate(0 0)"/>
- <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- if (icon === 'error') return (
- <svg className="top-icon" width="36px" height="36px" viewBox="0 0 36 36" version="1.1"
- preserveAspectRatio="xMidYMid meet">
- <circle className="clr-i-outline clr-i-outline-path-1" cx="18" cy="26.06" r="1.33"/>
- <path className="clr-i-outline clr-i-outline-path-2"
- d="M18,22.61a1,1,0,0,1-1-1v-12a1,1,0,1,1,2,0v12A1,1,0,0,1,18,22.61Z"/>
- <path className="clr-i-outline clr-i-outline-path-3"
- d="M18,34A16,16,0,1,1,34,18,16,16,0,0,1,18,34ZM18,4A14,14,0,1,0,32,18,14,14,0,0,0,18,4Z"/>
- <rect x="0" y="0" width="36" height="36" fillOpacity="0"/>
- </svg>)
- if (icon === 'exception') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <title>misuse--alt</title>
- <polygon
- points="21.41 23 16 17.591 10.59 23 9 21.41 14.409 16 9 10.591 10.591 9 16 14.409 21.409 9 23 10.591 17.591 16 23 21.41 21.41 23"/>
- <path d="M16,4A12,12,0,1,1,4,16,12.0136,12.0136,0,0,1,16,4m0-2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Z"
- transform="translate(0)"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32"/>
- </svg>)
- if (icon === 'routeConfiguration') return (
- <svg className="top-icon" width="32" height="32" viewBox="0 0 32 32">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <path
- d="M28.83 21.17L25 17.37l.67-.67a1 1 0 000-1.41l-6-6a1 1 0 00-1.41 0l-.79.79-6.76-6.79a1 1 0 00-1.41 0l-4 4-.12.15-4 6a1 1 0 00.12 1.26l3 3a1 1 0 001.42 0L10 13.41l2.09 2.09-4.8 4.79a1 1 0 000 1.41l2 2a1 1 0 00.71.3 1 1 0 00.52-.15l4.33-2.6 2.44 2.45a1 1 0 001.41 0l.67-.7 3.79 3.83a4 4 0 005.66-5.66zM10 10.58l-5 5-1.71-1.71 3.49-5.24L10 5.41l6.09 6.09-2.59 2.58zm8 11l-2.84-2.84-5 3-.74-.74L19 11.41 23.59 16zm9.42 3.83a2 2 0 01-2.83 0l-3.8-3.79 2.83-2.83 3.8 3.79a2 2 0 010 [...]
- <path
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>)
- if (icon === 'yaml') return (
- <svg className="top-icon" x="0px" y="0px" width="32px" height="32px"
- viewBox="0 0 32 32">
- <style type="text/css">{".st0{fill:none;}"}</style>
- <title>document</title>
- <path
- d="M25.7,9.3l-7-7C18.5,2.1,18.3,2,18,2H8C6.9,2,6,2.9,6,4v24c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V10C26,9.7,25.9,9.5,25.7,9.3 z M18,4.4l5.6,5.6H18V4.4z M24,28H8V4h8v6c0,1.1,0.9,2,2,2h6V28z"/>
- <rect x="10" y="22" width="12" height="2"/>
- <rect x="10" y="16" width="12" height="2"/>
- <rect className="st0" width="32" height="32"/>
- </svg>)
- if (icon === 'code') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <title>code</title>
- <polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/>
- <polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/>
- <rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32" transform="translate(0 32) rotate(-90)"/>
- </svg>)
-}
-
-
-export class BeanIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>data--1</title>
- <rect x="15" y="6" width="13" height="2"/>
- <rect x="15" y="24" width="13" height="2"/>
- <rect x="4" y="15" width="13" height="2"/>
- <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z"
- transform="translate(0 0)"/>
- <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z"
- transform="translate(0 0)"/>
- <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- }
-}
-
-export class DependencyIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>application</title>
- <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
- transform="translate(0 0)"/>
- <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- }
-}
-
-export class RestIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" viewBox="0 0 32 32">
- <g className="layer">
- <title>Layer 1</title>
- <path
- d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
- id="svg_1"/>
- <path
- d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1 [...]
- id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
- </g>
- </svg>
- )
- }
-}
-
-export class ConceptIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>concept</title>
- <path
- d="M20.8851,19.4711a5.9609,5.9609,0,0,0,0-6.9422L23,10.4141l1.293,1.2929a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414l-4-4a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414L21.5859,9l-2.1148,2.1149a5.9609,5.9609,0,0,0-6.9422,0L10,8.5859V2H2v8H8.5859l2.529,2.5289a5.9609,5.9609,0,0,0,0,6.9422L9,21.5859,7.707,20.293a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414l4,4a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414L10.4141,23l2.1148-2.1149a5.960 [...]
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1"
- width="32" height="32"/>
- </svg>
- )
- }
-}
-
-export function AggregateIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M496.2 417.71l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 417.71h292.4z"></path>
- <path
- d="M516.1 426.23v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V426.22l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM247.14 358.45l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-. [...]
- <path
- d="M277.46 154.15V264.2c0 5.52-4.48 10-10 10H82.69c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- <g>
- <path d="M610.57 145.6l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
- <path
- d="M627.5 154.15V264.2c0 5.52-4.48 10-10 10H432.73c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- </g>
- </svg>
- );
-}
-
-export function ToIcon() {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
- viewBox="0 0 32 32"
- className="icon"
- >
- <path
- d="M24 22v-1h6v-2h-6v-6h6v-2h-6v-1a2 2 0 0 0-2-2h-6a8.007 8.007 0 0 0-7.93 7v2A8.007 8.007 0 0 0 16 24h6a2 2 0 0 0 2-2zm-8 0a6 6 0 1 1 0-12h6v12z"/>
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- );
-}
-
-export function ChoiceIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M407.33 113.97V609.2c0 2.75-1.9 5-4.22 5H291.55c-2.33 0-4.22-2.25-4.22-5V113.97c0-2.76 1.89-5 4.22-5h111.56c2.32 0 4.22 2.24 4.22 5zM27.1 437.55l60.87-57.64c.95-.9 2.32-1.41 3.76-1.41H258.2c2.76 0 5 1.87 5 4.17v111.65c0 2.3-2.24 4.17-5 4.17H91.54c-1.38 0-2.7-.48-3.65-1.32L27.2 443.15c-1.77-1.58-1.81-3.99-.1-5.61zM667.57 285.62l-60.87 57.64c-.95.9-2.32 1.41-3.76 1.41H436.47c-2.76 0-5-1.87-5-4.17V228.85c0-2.3 2.24-4.17 5-4.17h166.66c1.38 0 2.7.48 3.65 1.32l60.69 54.02c1. [...]
- </svg>
- );
-}
-
-
-export function SplitIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M496.2 83.65l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 83.65h292.4z"></path>
- <path
- d="M516.1 92.17v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V92.16l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM524.34 397.22l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-.42 [...]
- <path
- d="M277.36 476.26v110.05c0 5.52-4.48 10-10 10H82.59c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- <g>
- <path d="M610.48 467.71l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
- <path
- d="M627.41 476.26v110.05c0 5.52-4.48 10-10 10H432.64c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- </g>
- </svg>
- );
-}
-
-export function SagaIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M626.41 255.77c-.56-4.77-2.95-9.03-6.71-11.99l-46.46-36.64-1.06-1.09-.8-.28c-.81-.52-1.67-.98-2.56-1.36-.43-.19-.85-.36-1.25-.5-.47-.16-.96-.31-1.51-.45-.47-.11-.96-.22-1.45-.3-.49-.08-.97-.14-1.43-.18-.96-.08-1.95-.08-2.91-.01-.41.03-.83.08-1.23.14-.41.06-.82.14-1.25.23l-.58.14c-.1.03-.2.05-.31.08-.11.03-.21.06-.3.09-.29.08-.57.18-.86.28-.49.17-.99.37-1.53.61l-.16.08c-.32.15-.65.31-.97.49-.49.26-.93.53-1.34.81-.39.26-.76.52-1.12.8l-46.96 37.05a17.823 17.823 0 00-6.72 [...]
- </svg>
- );
-}
-
-export function TransformIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M441.77 277.51l-82.73 64.23c-.07.05-.13.09-.19.13-5.37 3.48-12.33 3.48-17.69.01-.07-.05-.13-.09-.18-.13l-82.76-64.24h183.54z"></path>
- <path
- d="M462.2 287.02V420.7c0 .98-.79 1.77-1.77 1.77H239.57c-.98 0-1.77-.79-1.77-1.77V287.02l90.91 70.56c.54.44 1.06.8 1.57 1.12 5.99 3.88 12.86 5.81 19.72 5.81s13.73-1.94 19.73-5.81c.49-.32 1.01-.68 1.58-1.13l90.89-70.55zM622.28 330.68l-35.89 31.78a1.48 1.48 0 01-1.98 0l-35.89-31.78c-.3-.26-.48-.63-.51-1.03-.02-.4.11-.79.38-1.09l11.28-12.73c.55-.61 1.49-.67 2.11-.12l12.44 11.02c-5.24-51.26-28.18-99.47-64.84-136.12-35.82-35.82-81.13-58.05-131.04-64.27-.1 0-.19-.03-.28-.06v.09s [...]
- </svg>
- );
-}
-
-export function FilterIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 700 700" className="icon">
- <path
- d="M565.62 156.56L413.36 350.33a10.032 10.032 0 00-2.14 6.18v190.52c0 19.05-25.01 34.49-55.86 34.49s-55.86-15.44-55.86-34.49V356.51c0-2.24-.75-4.42-2.14-6.18L145.1 156.56c-5.15-6.56-.48-16.18 7.87-16.18h404.79c8.34 0 13.02 9.62 7.86 16.18z"></path>
- </svg>
- );
-}
-
-export function SortIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <defs>
- <style>{".b{stroke-linejoin: round;}.b,.c {stroke-linecap: round;}.b,.c,.d {fill: none;stroke: #000;stroke-width: 35px;}.c,.d {stroke-miterlimit: 10;}"}</style>
- </defs>
- <path d="M160.63 168.63L160.63 531.37" className="d"></path>
- <path d="M576.31 170.27L269.3 170.27" className="c"></path>
- <path d="M517.53 290.64L269.3 290.64" className="c"></path>
- <path d="M458.75 411L269.3 411" className="c"></path>
- <path d="M399.97 531.37L269.3 531.37" className="c"></path>
- <path d="M197.7 197.95L160.63 168.71 123.55 197.95" className="b"></path>
- <path d="M123.55 502.12L160.62 531.37 197.7 502.12" className="b"></path>
- </svg>
- );
-}
-
-export function OnCompletion() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M22 26.59L19.41 24 18 25.41 22 29.41 30 21.41 28.59 20 22 26.59z"></path>
- <circle cx="16" cy="16" r="2"></circle>
- <path d="M16 22a6 6 0 116-6 6.007 6.007 0 01-6 6zm0-10a4 4 0 104 4 4.005 4.005 0 00-4-4z"></path>
- <path d="M28 16a12 12 0 10-12 12v-2a10 10 0 1110-10z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function Intercept() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M15 4H17V28H15z"></path>
- <path
- d="M10 7v18H4V7h6m0-2H4a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2zM28 7v18h-6V7h6m0-2h-6a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function InterceptFrom() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M26 30H14a2 2 0 01-2-2v-3h2v3h12V4H14v3h-2V4a2 2 0 012-2h12a2 2 0 012 2v24a2 2 0 01-2 2z"></path>
- <path d="M14.59 20.59L18.17 17 4 17 4 15 18.17 15 14.59 11.41 16 10 22 16 16 22 14.59 20.59z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function InterceptSendToEndpoint() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path
- d="M6 30h12a2.002 2.002 0 002-2v-3h-2v3H6V4h12v3h2V4a2.002 2.002 0 00-2-2H6a2.002 2.002 0 00-2 2v24a2.002 2.002 0 002 2z"></path>
- <path
- d="M20.586 20.586L24.172 17 10 17 10 15 24.172 15 20.586 11.414 22 10 28 16 22 22 20.586 20.586z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-
export function SpringIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<g fill="none" fillRule="evenodd">
<path d="M0 0h32v32H0z"></path>
<path
@@ -761,11 +37,9 @@ export function QuarkusIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
preserveAspectRatio="xMidYMid"
viewBox="-0.5 0 257 257"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#4695EB"
d="M213.554 0c23.418.08 42.377 19.052 42.443 42.47v171.084c-.066 23.428-19.042 42.404-42.47 42.47h-25.439l-11.661-28.318h37.127c7.774-.1 14.051-6.378 14.152-14.152V42.47c-.1-7.774-6.378-14.051-14.152-14.152H42.47c-7.774.1-14.051 6.378-14.152 14.152v171.084c.1 7.774 6.378 14.051 14.152 14.152h62.607l22.935-48.494 31.625 76.812H42.47C19.042 255.958.066 236.982 0 213.554V42.47C.066 19.042 19.042.066 42.47 0h171.084zm-43.983 139.727v45.51l-39.417-22.748 39.417-22.762zM86.453 [...]
@@ -786,10 +60,8 @@ export function DatabaseIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="800"
- height="800"
viewBox="0 0 24 24"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fillRule="evenodd"
d="M12 1.25c-2.487 0-4.774.402-6.466 1.079-.844.337-1.577.758-2.112 1.264C2.886 4.1 2.5 4.744 2.5 5.5v12.987l.026.013H2.5c0 .756.386 1.4.922 1.907.535.506 1.268.927 2.112 1.264 1.692.677 3.979 1.079 6.466 1.079s4.773-.402 6.466-1.079c.844-.337 1.577-.758 2.112-1.264.536-.507.922-1.151.922-1.907h-.026l.026-.013V5.5c0-.756-.386-1.4-.922-1.907-.535-.506-1.268-.927-2.112-1.264C16.773 1.652 14.487 1.25 12 1.25zM4 5.5c0-.21.104-.487.453-.817.35-.332.899-.666 1.638-.962C7.566 3. [...]
@@ -802,10 +74,8 @@ export function CloudIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M16 7a7.66 7.66 0 0 1 1.51.15 8 8 0 0 1 6.35 6.34l.26 1.35 1.35.24a5.5 5.5 0 0 1-1 10.92H7.5a5.5 5.5 0 0 1-1-10.92l1.34-.24.26-1.35A8 8 0 0 1 16 7m0-2a10 10 0 0 0-9.83 8.12A7.5 7.5 0 0 0 7.49 28h17a7.5 7.5 0 0 0 1.32-14.88 10 10 0 0 0-7.94-7.94A10.27 10.27 0 0 0 16 5Z"/>
<path
@@ -823,10 +93,8 @@ export function FileIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"document"}</title>
<path
d="m25.7 9.3-7-7c-.2-.2-.4-.3-.7-.3H8c-1.1 0-2 .9-2 2v24c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V10c0-.3-.1-.5-.3-.7zM18 4.4l5.6 5.6H18V4.4zM24 28H8V4h8v6c0 1.1.9 2 2 2h6v16z"/>
@@ -845,10 +113,8 @@ export function MessagingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M28 28H4a2.002 2.002 0 0 1-2-2v-5h2v5h24v-5h2v5a2.002 2.002 0 0 1-2 2Z"/>
<path d="M7 21h18v2H7zM7 16h18v2H7zM7 11h18v2H7zM7 6h18v2H7z"/>
<path
@@ -866,10 +132,8 @@ export function SchedulingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M16 30a14 14 0 1 1 14-14 14 14 0 0 1-14 14Zm0-26a12 12 0 1 0 12 12A12 12 0 0 0 16 4Z"/>
<path d="M20.59 22 15 16.41V7h2v8.58l5 5.01L20.59 22z"/>
<path
@@ -887,10 +151,8 @@ export function HttpIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M30 11h-5v10h2v-3h3a2.003 2.003 0 0 0 2-2v-3a2.002 2.002 0 0 0-2-2Zm-3 5v-3h3l.001 3ZM10 13h2v8h2v-8h2v-2h-6v2zM23 11h-6v2h2v8h2v-8h2v-2zM6 11v4H3v-4H1v10h2v-4h3v4h2V11H6z"/>
<path
@@ -908,11 +170,9 @@ export function GoogleCloudIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -25 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#EA4335"
d="m170.252 56.819 22.253-22.253 1.483-9.37C153.437-11.677 88.976-7.496 52.42 33.92 42.267 45.423 34.734 59.764 30.717 74.573l7.97-1.123 44.505-7.34 3.436-3.513c19.797-21.742 53.27-24.667 76.128-6.168l7.496.39Z"
@@ -937,11 +197,9 @@ export function AwsIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
fill="none"
viewBox="0 0 16 16"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#252F3E"
d="M4.51 7.687c0 .197.02.357.058.475.042.117.096.245.17.384a.233.233 0 0 1 .037.123c0 .053-.032.107-.1.16l-.336.224a.255.255 0 0 1-.138.048c-.054 0-.107-.026-.16-.074a1.652 1.652 0 0 1-.192-.251 4.137 4.137 0 0 1-.165-.315c-.415.491-.936.737-1.564.737-.447 0-.804-.129-1.064-.385-.261-.256-.394-.598-.394-1.025 0-.454.16-.822.484-1.1.325-.278.756-.416 1.304-.416.18 0 .367.016.564.042.197.027.4.07.612.118v-.39c0-.406-.085-.689-.25-.854-.17-.166-.458-.246-.868-.246-.186 0-.37 [...]
@@ -960,10 +218,8 @@ export function MailIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"email"}</title>
<path
d="M28 6H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h24a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2Zm-2.2 2L16 14.78 6.2 8ZM4 24V8.91l11.43 7.91a1 1 0 0 0 1.14 0L28 8.91V24Z"/>
@@ -982,10 +238,8 @@ export function IotIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"iot--platform"}</title>
<path
d="M30 19h-4v-4h-2v9H8V8h9V6h-4V2h-2v4H8a2.002 2.002 0 0 0-2 2v3H2v2h4v6H2v2h4v3a2.002 2.002 0 0 0 2 2h3v4h2v-4h6v4h2v-4h3a2.003 2.003 0 0 0 2-2v-3h4Z"/>
@@ -1005,12 +259,10 @@ export function IotIcon() {
export function GithubIcon() {
return (
<svg
- width={32}
- height={32}
aria-hidden="true"
data-view-component="true"
viewBox="0 0 16 16"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45 [...]
</svg>
@@ -1022,10 +274,8 @@ export function CassandraIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
- width={113.636}
- height={58.899}
viewBox="0 0 113.63554 58.899029"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<path id="a" d="M24.216.082v24.141H.053V.082z"/>
</defs>
@@ -1112,10 +362,8 @@ export function ActivemqIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={116.42}
- height={167.526}
viewBox="0 0 30.803 44.324"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<filter
id="a"
@@ -1400,11 +648,9 @@ export function KafkaIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="-78.5 0 413 413"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#1A1919"
d="M87.932 36.714c-4.55-4.571-10.896-7.394-17.951-7.394-7.029 0-13.326 2.823-17.822 7.394h-.13c-4.535 4.55-7.358 10.9-7.358 17.93 0 7.055 2.823 13.352 7.359 17.875l.129.102c4.496 4.55 10.793 7.346 17.822 7.346 7.055 0 13.402-2.797 17.951-7.346L88 72.52c4.558-4.523 7.354-10.82 7.354-17.876 0-7.029-2.796-13.38-7.354-17.929h-.067Zm-17.951 346.64a25.504 25.504 0 0 0 17.951-7.368l.067-.134c4.558-4.487 7.354-10.838 7.354-17.817 0-7.056-2.796-13.38-7.354-17.952h-.067c-4.55-4.625 [...]
@@ -1419,7 +665,7 @@ export function GrapeIcon() {
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
viewBox="0 0 512 512"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M438.557 512H19.785c-8.216 0-14.876-6.66-14.876-14.876V256.916c0-8.216 6.66-14.876 14.876-14.876s14.876 6.66 14.876 14.876v225.332h389.021v-32.833c0-8.216 6.661-14.876 14.876-14.876s14.876 6.66 14.876 14.876v47.709c-.001 8.216-6.662 14.876-14.877 14.876z"
style={{
@@ -1452,10 +698,8 @@ export function MachineLearningIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M27 24a2.96 2.96 0 0 0-1.285.3l-4.3-4.3H18v2h2.586l3.715 3.715A2.966 2.966 0 0 0 24 27a3 3 0 1 0 3-3Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1ZM27 13a2.995 2.995 0 0 0-2.816 2H18v2h6.184A2.995 2.995 0 1 0 27 13Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1ZM27 2a3.003 3.003 0 0 0-3 3 2.966 2.966 0 0 0 .348 1.373L20.596 10H18v2h3.404l4.4-4.252A2.999 2.999 0 1 0 27 2Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1Z"/>
<path
@@ -1475,10 +719,8 @@ export function TerminalIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"terminal"}</title>
<path
d="M26 4.01H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2v-20a2 2 0 0 0-2-2Zm0 2v4H6v-4Zm-20 20v-14h20v14Z"/>
@@ -1498,10 +740,8 @@ export function SapIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<circle
cx={512}
cy={512}
@@ -1524,10 +764,8 @@ export function ScriptIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"script"}</title>
<path
d="m18.83 26 2.58-2.58L20 22l-4 4 4 4 1.42-1.41L18.83 26zM27.17 26l-2.58 2.58L26 30l4-4-4-4-1.42 1.41L27.17 26z"/>
@@ -1548,10 +786,8 @@ export function ValidationIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="m22 27.18-2.59-2.59L18 26l4 4 8-8-1.41-1.41L22 27.18z"/>
<path
d="M15 28H8V4h8v6a2.006 2.006 0 0 0 2 2h6v6h2v-8a.91.91 0 0 0-.3-.7l-7-7A.909.909 0 0 0 18 2H8a2.006 2.006 0 0 0-2 2v24a2.006 2.006 0 0 0 2 2h7Zm3-23.6 5.6 5.6H18Z"/>
@@ -1570,11 +806,9 @@ export function OpenstackIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -2.5 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#DA1A32"
d="M57.82 170.723v9.156c0 7.104 5.756 12.86 12.86 12.86h114.65c7.104 0 12.86-5.756 12.86-12.86v-9.156H256v56.051c0 13.082-10.703 23.785-23.785 23.785H23.785C10.703 250.559 0 239.856 0 226.774v-56.051h57.82Zm-.01-74.353v57.809H0v-57.81h57.81Zm198.19 0v57.809h-57.81v-57.81H256ZM232.215 0C245.297 0 256 10.703 256 23.795v56.041h-57.81V70.68c0-7.104-5.756-12.86-12.86-12.86H70.67c-7.104 0-12.86 5.756-12.86 12.86v9.156H0V23.785C0 10.703 10.703 0 23.785 0Z"
@@ -1587,11 +821,9 @@ export function OpenshiftIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -9.5 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#DA2430"
d="m74.84 106.893-40.869 14.87c.525 6.552 1.652 13.024 3.24 19.366l38.818-14.137c-1.244-6.552-1.689-13.32-1.18-20.1M255.444 61.702c-2.85-5.879-6.147-11.561-9.966-16.916l-40.857 14.87c4.755 4.864 8.743 10.33 12.007 16.176L255.445 61.7v.002Z"
@@ -1632,10 +864,8 @@ export function RefIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M4 20v2h4.586L2 28.586 3.414 30 10 23.414V28h2v-8H4zM30 30h-8v-8h8Zm-6-2h4v-4h-4ZM20 20h-8v-8h8Zm-6-2h4v-4h-4Z"/>
<path d="M24 17h-2v-2h2a4 4 0 0 0 0-8H12V5h12a6 6 0 0 1 0 12ZM10 10H2V2h8ZM4 8h4V4H4Z"/>
@@ -1654,11 +884,9 @@ export function RedisIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -18 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#912626"
d="M245.97 168.943c-13.662 7.121-84.434 36.22-99.501 44.075-15.067 7.856-23.437 7.78-35.34 2.09-11.902-5.69-87.216-36.112-100.783-42.597C3.566 169.271 0 166.535 0 163.951v-25.876s98.05-21.345 113.879-27.024c15.828-5.679 21.32-5.884 34.79-.95 13.472 4.936 94.018 19.468 107.331 24.344l-.006 25.51c.002 2.558-3.07 5.364-10.024 8.988"
@@ -1703,10 +931,8 @@ export function SearchIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"/>
<path
@@ -1724,10 +950,8 @@ export function BlockchainIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"blockchain"}</title>
<path d="M6 24H4V8h2ZM28 8h-2v16h2Zm-4-2V4H8v2Zm0 22v-2H8v2Z"/>
<path
@@ -1745,10 +969,8 @@ export function ChatIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"chat"}</title>
<path
d="M17.74 30 16 29l4-7h6a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h9v2H6a4 4 0 0 1-4-4V8a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4v12a4 4 0 0 1-4 4h-4.84Z"/>
@@ -1769,10 +991,8 @@ export function WorkflowIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 512 512"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M445.66 49.341H340.206L294.008 3.143c-4.192-4.191-10.99-4.191-15.183 0l-49.341 49.342c-4.192 4.192-4.192 10.99 0 15.183l46.198 46.198v38.494h-80.516c-5.929 0-10.736 4.806-10.736 10.735v21.471h-42.942v-21.471c0-5.929-4.806-10.735-10.736-10.735H66.34c-5.929 0-10.735 4.806-10.735 10.735v64.413c0 5.929 4.806 10.735 10.735 10.735h20.755v93.798c0 5.929 4.806 10.736 10.735 10.736h95.437l-10.346 10.346c-4.192 4.192-4.193 10.99 0 15.182a10.7 10.7 0 0 0 7.591 3.144c2.747 0 5.495 [...]
</svg>
@@ -1783,10 +1003,8 @@ export function WebserviceIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"fog"}</title>
<path
d="M25.829 13.116A10.02 10.02 0 0 0 16 5v2a8.023 8.023 0 0 1 7.865 6.493l.259 1.346 1.349.245A5.502 5.502 0 0 1 24.508 26H16v2h8.508a7.502 7.502 0 0 0 1.32-14.884ZM8 24h6v2H8zM4 24h2v2H4zM6 20h8v2H6zM2 20h2v2H2zM8 16h6v2H8zM4 16h2v2H4zM10 12h4v2h-4zM6 12h2v2H6zM12 8h2v2h-2z"/>
@@ -1805,10 +1023,8 @@ export function MobileIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M23 7h4v4h-4zM23 13h4v4h-4zM17 7h4v4h-4zM17 13h4v4h-4z"/>
<circle cx={14.5} cy={24.5} r={1.5}/>
<path
@@ -1828,10 +1044,8 @@ export function ClusterIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M16 7a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM11 30a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM7 11a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM21 30a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM25 11a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM4 21a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 [...]
<path
@@ -1849,10 +1063,8 @@ export function RpcIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="m14 26 1.41-1.41L7.83 17H28v-2H7.83l7.58-7.59L14 6 4 16l10 10z"/>
<path
d="M0 0h32v32H0z"
@@ -1871,7 +1083,7 @@ export function InfinispanIcon() {
xmlns="http://www.w3.org/2000/svg"
id="artwork"
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<style>{".cls-2{fill:#fff}"}</style>
</defs>
@@ -1897,10 +1109,8 @@ export function TransformationIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"data-share"}</title>
<path
d="M5 25v-9.172l-3.586 3.586L0 18l6-6 6 6-1.414 1.414L7 15.828V25h12v2H7a2.002 2.002 0 0 1-2-2ZM24 22h4a2.002 2.002 0 0 1 2 2v4a2.002 2.002 0 0 1-2 2h-4a2.002 2.002 0 0 1-2-2v-4a2.002 2.002 0 0 1 2-2Zm4 6v-4h-4.002L24 28ZM27 6v9.172l3.586-3.586L32 13l-6 6-6-6 1.414-1.414L25 15.172V6H13V4h12a2.002 2.002 0 0 1 2 2ZM2 6h6v2H2zM2 2h8v2H2z"/>
@@ -1919,10 +1129,8 @@ export function TestingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M28 17v5H4V6h10V4H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v4H8v2h16v-2h-4v-4h8a2 2 0 0 0 2-2v-5ZM18 28h-4v-4h4Z"/>
<path
@@ -1942,10 +1150,8 @@ export function ApiIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"api"}</title>
<path
d="M26 22a3.86 3.86 0 0 0-2 .57l-3.09-3.1a6 6 0 0 0 0-6.94L24 9.43a3.86 3.86 0 0 0 2 .57 4 4 0 1 0-4-4 3.86 3.86 0 0 0 .57 2l-3.1 3.09a6 6 0 0 0-6.94 0L9.43 8A3.86 3.86 0 0 0 10 6a4 4 0 1 0-4 4 3.86 3.86 0 0 0 2-.57l3.09 3.1a6 6 0 0 0 0 6.94L8 22.57A3.86 3.86 0 0 0 6 22a4 4 0 1 0 4 4 3.86 3.86 0 0 0-.57-2l3.1-3.09a6 6 0 0 0 6.94 0l3.1 3.09a3.86 3.86 0 0 0-.57 2 4 4 0 1 0 4-4Zm0-18a2 2 0 1 1-2 2 2 2 0 0 1 2-2ZM4 6a2 2 0 1 1 2 2 2 2 0 0 1-2-2Zm2 22a2 2 0 1 1 2-2 2 2 0 0 1-2 [...]
@@ -1963,10 +1169,8 @@ export function MonitoringIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M28 16v6H4V6h7V4H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v4H8v2h16v-2h-4v-4h8a2 2 0 0 0 2-2v-6ZM18 28h-4v-4h4Z"/>
<path
@@ -1987,10 +1191,8 @@ export function NetworkingIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 511.984 511.984"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M207.29 287.991H48.735C30.687 287.991 16 302.375 16 320.054v111.868c0 17.679 14.688 32.063 32.735 32.063H207.29c18.031 0 32.703-14.384 32.703-32.063V320.054c0-17.679-14.672-32.063-32.703-32.063zm0 143.996-159.291-.064.736-111.932 159.259.064.048 111.645c0 .015-.192.287-.752.287z"/>
<path
@@ -2010,7 +1212,7 @@ export function HealthIcon() {
xmlSpace="preserve"
id="Icons"
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<style>
{
".st0{fill:none;stroke:#000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}"
@@ -2029,10 +1231,8 @@ export function KubernetesIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 -10.44 722.846 722.846"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#326ce5"
d="M358.986 10.06a46.725 46.342 0 0 0-17.906 4.531L96.736 131.341a46.725 46.342 0 0 0-25.28 31.438l-60.282 262.25a46.725 46.342 0 0 0 6.344 35.531 46.725 46.342 0 0 0 2.656 3.688l169.125 210.28a46.725 46.342 0 0 0 36.531 17.438l271.219-.062a46.725 46.342 0 0 0 36.531-17.406l169.063-210.313a46.725 46.342 0 0 0 9.03-39.219L651.3 162.716a46.725 46.342 0 0 0-25.281-31.437L381.643 14.59a46.725 46.342 0 0 0-22.657-4.53z"
@@ -2062,10 +1262,8 @@ export function DocumentIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"document--blank"}</title>
<path
d="m25.7 9.3-7-7A.908.908 0 0 0 18 2H8a2.006 2.006 0 0 0-2 2v24a2.006 2.006 0 0 0 2 2h16a2.006 2.006 0 0 0 2-2V10a.908.908 0 0 0-.3-.7ZM18 4.4l5.6 5.6H18ZM24 28H8V4h8v6a2.006 2.006 0 0 0 2 2h6Z"/>
@@ -2084,11 +1282,9 @@ export function GitIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
fill="none"
viewBox="0 0 24 24"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#000"
fillRule="evenodd"
@@ -2103,10 +1299,8 @@ export function SocialIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#FFB89A"
d="M570.2 842c-50.6 0-278.7-180-278.7-401.9 0-58.8-2.9-133.1-1-183.9-50.8 3.2-91.4 45.7-91.4 97.3v272.1c37.4 194.7 137.5 334 255.2 334 69.5 0 132.9-48.6 180.9-128.5-20.8 7.1-42.6 10.9-65 10.9z"
@@ -2133,7 +1327,7 @@ export function DebeziumIcon() {
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 130.93 130.93"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<linearGradient
id="linear-gradient"
@@ -2220,11 +1414,9 @@ export function IgniteIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={48}
- height={48}
fill="none"
viewBox="0 0 48 48"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#ED1C24"
d="M7.686 8.136S-8.95 18.28 6.73 28.355c3.016 1.962 13.956 7.418 13.644 12.466 0 0 6.631-9.81-3.064-15.983C7.351 18.52 4.862 11.772 7.686 8.135Z"
@@ -2239,7 +1431,7 @@ export function IgniteIcon() {
export function HazelcastIcon() {
return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.3 133.3" className="icon">
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.3 133.3" className="icon" width="32px" height="32px">
<defs>
<style>{".a{fill:#00e1e1}"}</style>
</defs>
@@ -2279,10 +1471,8 @@ export function AzureIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={150}
- height={150}
viewBox="0 0 96 96"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<linearGradient
id="a"
diff --git a/karavan-designer/src/designer/icons/EipIcons.tsx b/karavan-designer/src/designer/icons/EipIcons.tsx
new file mode 100644
index 00000000..6759e928
--- /dev/null
+++ b/karavan-designer/src/designer/icons/EipIcons.tsx
@@ -0,0 +1,230 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 React from 'react';
+
+export function AggregateIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M496.2 417.71l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 417.71h292.4z"></path>
+ <path
+ d="M516.1 426.23v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V426.22l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM247.14 358.45l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-. [...]
+ <path
+ d="M277.46 154.15V264.2c0 5.52-4.48 10-10 10H82.69c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ <g>
+ <path d="M610.57 145.6l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
+ <path
+ d="M627.5 154.15V264.2c0 5.52-4.48 10-10 10H432.73c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ </g>
+ </svg>
+ );
+}
+
+export function ToIcon() {
+ return (
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 32 32"
+ className="icon" width="32px" height="32px"
+ >
+ <path
+ d="M24 22v-1h6v-2h-6v-6h6v-2h-6v-1a2 2 0 0 0-2-2h-6a8.007 8.007 0 0 0-7.93 7v2A8.007 8.007 0 0 0 16 24h6a2 2 0 0 0 2-2zm-8 0a6 6 0 1 1 0-12h6v12z"/>
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ );
+}
+
+export function ChoiceIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M407.33 113.97V609.2c0 2.75-1.9 5-4.22 5H291.55c-2.33 0-4.22-2.25-4.22-5V113.97c0-2.76 1.89-5 4.22-5h111.56c2.32 0 4.22 2.24 4.22 5zM27.1 437.55l60.87-57.64c.95-.9 2.32-1.41 3.76-1.41H258.2c2.76 0 5 1.87 5 4.17v111.65c0 2.3-2.24 4.17-5 4.17H91.54c-1.38 0-2.7-.48-3.65-1.32L27.2 443.15c-1.77-1.58-1.81-3.99-.1-5.61zM667.57 285.62l-60.87 57.64c-.95.9-2.32 1.41-3.76 1.41H436.47c-2.76 0-5-1.87-5-4.17V228.85c0-2.3 2.24-4.17 5-4.17h166.66c1.38 0 2.7.48 3.65 1.32l60.69 54.02c1. [...]
+ </svg>
+ );
+}
+
+
+export function SplitIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M496.2 83.65l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 83.65h292.4z"></path>
+ <path
+ d="M516.1 92.17v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V92.16l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM524.34 397.22l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-.42 [...]
+ <path
+ d="M277.36 476.26v110.05c0 5.52-4.48 10-10 10H82.59c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ <g>
+ <path d="M610.48 467.71l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
+ <path
+ d="M627.41 476.26v110.05c0 5.52-4.48 10-10 10H432.64c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ </g>
+ </svg>
+ );
+}
+
+export function SagaIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M626.41 255.77c-.56-4.77-2.95-9.03-6.71-11.99l-46.46-36.64-1.06-1.09-.8-.28c-.81-.52-1.67-.98-2.56-1.36-.43-.19-.85-.36-1.25-.5-.47-.16-.96-.31-1.51-.45-.47-.11-.96-.22-1.45-.3-.49-.08-.97-.14-1.43-.18-.96-.08-1.95-.08-2.91-.01-.41.03-.83.08-1.23.14-.41.06-.82.14-1.25.23l-.58.14c-.1.03-.2.05-.31.08-.11.03-.21.06-.3.09-.29.08-.57.18-.86.28-.49.17-.99.37-1.53.61l-.16.08c-.32.15-.65.31-.97.49-.49.26-.93.53-1.34.81-.39.26-.76.52-1.12.8l-46.96 37.05a17.823 17.823 0 00-6.72 [...]
+ </svg>
+ );
+}
+
+export function TransformIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M441.77 277.51l-82.73 64.23c-.07.05-.13.09-.19.13-5.37 3.48-12.33 3.48-17.69.01-.07-.05-.13-.09-.18-.13l-82.76-64.24h183.54z"></path>
+ <path
+ d="M462.2 287.02V420.7c0 .98-.79 1.77-1.77 1.77H239.57c-.98 0-1.77-.79-1.77-1.77V287.02l90.91 70.56c.54.44 1.06.8 1.57 1.12 5.99 3.88 12.86 5.81 19.72 5.81s13.73-1.94 19.73-5.81c.49-.32 1.01-.68 1.58-1.13l90.89-70.55zM622.28 330.68l-35.89 31.78a1.48 1.48 0 01-1.98 0l-35.89-31.78c-.3-.26-.48-.63-.51-1.03-.02-.4.11-.79.38-1.09l11.28-12.73c.55-.61 1.49-.67 2.11-.12l12.44 11.02c-5.24-51.26-28.18-99.47-64.84-136.12-35.82-35.82-81.13-58.05-131.04-64.27-.1 0-.19-.03-.28-.06v.09s [...]
+ </svg>
+ );
+}
+
+export function FilterIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M565.62 156.56L413.36 350.33a10.032 10.032 0 00-2.14 6.18v190.52c0 19.05-25.01 34.49-55.86 34.49s-55.86-15.44-55.86-34.49V356.51c0-2.24-.75-4.42-2.14-6.18L145.1 156.56c-5.15-6.56-.48-16.18 7.87-16.18h404.79c8.34 0 13.02 9.62 7.86 16.18z"></path>
+ </svg>
+ );
+}
+
+export function SortIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <defs>
+ <style>{".b{stroke-linejoin: round;}.b,.c {stroke-linecap: round;}.b,.c,.d {fill: none;stroke: #000;stroke-width: 35px;}.c,.d {stroke-miterlimit: 10;}"}</style>
+ </defs>
+ <path d="M160.63 168.63L160.63 531.37" className="d"></path>
+ <path d="M576.31 170.27L269.3 170.27" className="c"></path>
+ <path d="M517.53 290.64L269.3 290.64" className="c"></path>
+ <path d="M458.75 411L269.3 411" className="c"></path>
+ <path d="M399.97 531.37L269.3 531.37" className="c"></path>
+ <path d="M197.7 197.95L160.63 168.71 123.55 197.95" className="b"></path>
+ <path d="M123.55 502.12L160.62 531.37 197.7 502.12" className="b"></path>
+ </svg>
+ );
+}
+
+export function OnCompletion() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M22 26.59L19.41 24 18 25.41 22 29.41 30 21.41 28.59 20 22 26.59z"></path>
+ <circle cx="16" cy="16" r="2"></circle>
+ <path d="M16 22a6 6 0 116-6 6.007 6.007 0 01-6 6zm0-10a4 4 0 104 4 4.005 4.005 0 00-4-4z"></path>
+ <path d="M28 16a12 12 0 10-12 12v-2a10 10 0 1110-10z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function Intercept() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M15 4H17V28H15z"></path>
+ <path
+ d="M10 7v18H4V7h6m0-2H4a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2zM28 7v18h-6V7h6m0-2h-6a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function InterceptFrom() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M26 30H14a2 2 0 01-2-2v-3h2v3h12V4H14v3h-2V4a2 2 0 012-2h12a2 2 0 012 2v24a2 2 0 01-2 2z"></path>
+ <path d="M14.59 20.59L18.17 17 4 17 4 15 18.17 15 14.59 11.41 16 10 22 16 16 22 14.59 20.59z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function InterceptSendToEndpoint() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path
+ d="M6 30h12a2.002 2.002 0 002-2v-3h-2v3H6V4h12v3h2V4a2.002 2.002 0 00-2-2H6a2.002 2.002 0 00-2 2v24a2.002 2.002 0 002 2z"></path>
+ <path
+ d="M20.586 20.586L24.172 17 10 17 10 15 24.172 15 20.586 11.414 22 10 28 16 22 22 20.586 20.586z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
\ No newline at end of file
diff --git a/karavan-designer/src/designer/icons/KaravanIcons.tsx b/karavan-designer/src/designer/icons/KaravanIcons.tsx
new file mode 100644
index 00000000..b7165b93
--- /dev/null
+++ b/karavan-designer/src/designer/icons/KaravanIcons.tsx
@@ -0,0 +1,521 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 React from 'react';
+
+export function KaravanIcon(className?: string) {
+ return (
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ id="svg50"
+ width={32}
+ height={32}
+ preserveAspectRatio="xMidYMid"
+ version="1.1"
+ viewBox="0 0 256 256"
+ className={className ? className : "logo"}
+ >
+ <defs id="defs31">
+ <linearGradient id="linearGradient1351">
+ <stop
+ id="stop1347"
+ offset="0"
+ stopColor="#dcffff"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop1349"
+ offset="1"
+ stopColor="#96d2e6"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <circle id="path-1" cx="128" cy="128" r="128"></circle>
+ <linearGradient
+ id="linearGradient-3"
+ x1="-26.051"
+ x2="254.316"
+ y1="271.331"
+ y2="0.048"
+ gradientUnits="userSpaceOnUse"
+ >
+ <stop
+ id="stop10"
+ offset="0%"
+ stopColor="#4790bb"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop12"
+ offset="10.996%"
+ stopColor="#64b7db"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop14"
+ offset="94.502%"
+ stopColor="#326ea0"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <linearGradient
+ id="linearGradient-4"
+ x1="-32.163"
+ x2="259.338"
+ y1="277.029"
+ y2="-5.028"
+ gradientUnits="userSpaceOnUse"
+ >
+ <stop id="stop17" offset="0%" stopColor="#F69923"></stop>
+ <stop id="stop19" offset="8.048%" stopColor="#F79A23"></stop>
+ <stop id="stop21" offset="41.874%" stopColor="#E97826"></stop>
+ </linearGradient>
+ <linearGradient
+ id="linearGradient-5"
+ x1="217.945"
+ x2="99.459"
+ y1="67.505"
+ y2="247.005"
+ gradientTransform="scale(.96442 1.0369)"
+ gradientUnits="userSpaceOnUse"
+ xlinkHref="#linearGradient-4"
+ >
+ <stop
+ id="stop24"
+ offset="0%"
+ stopColor="#92d6d5"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop26"
+ offset="41.191%"
+ stopColor="#79b7cc"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop28"
+ offset="73.271%"
+ stopColor="#5891c5"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <mask id="mask-2" fill="#fff">
+ <use id="use33" xlinkHref="#path-1"></use>
+ </mask>
+ <mask id="mask-2-7" fill="#fff">
+ <use id="use137" xlinkHref="#path-1"></use>
+ </mask>
+ <linearGradient
+ id="linearGradient1345"
+ x1="233.122"
+ x2="2.24"
+ y1="56.015"
+ y2="242.78"
+ gradientUnits="userSpaceOnUse"
+ xlinkHref="#linearGradient1351"
+ ></linearGradient>
+ </defs>
+ <circle
+ id="circle38"
+ cx="127.994"
+ cy="127.994"
+ r="123.111"
+ fill="url(#linearGradient-3)"
+ fillRule="nonzero"
+ mask="url(#mask-2)"
+ ></circle>
+ <g id="g2266">
+ <path
+ id="path42"
+ fill="url(#linearGradient-5)"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412z"
+ mask="url(#mask-2)"
+ opacity="0.75"
+ ></path>
+ </g>
+ <path
+ id="path44"
+ fill="#1e4b7b"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513z"
+ mask="url(#mask-2)"
+ opacity="0.75"
+ ></path>
+ <path
+ id="path150"
+ fill="url(#linearGradient1345)"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488z"
+ mask="url(#mask-2-7)"
+ transform="translate(-.769 -.133)"
+ ></path>
+ <path
+ id="path40"
+ fill="#2d4150"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232z"
+ mask="url(#mask-2)"
+ transform="translate(-.59) scale(1.00078)"
+ ></path>
+ </svg>
+ );
+}
+
+export function CamelIcon(props?: (JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>) | undefined) {
+ return (<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ preserveAspectRatio="xMidYMid"
+ viewBox="0 0 256 256"
+ {...props}
+ className="icon" width="32px" height="32px">
+ <defs>
+ <linearGradient
+ id="b"
+ x1="-12.564%"
+ x2="101.304%"
+ y1="108.214%"
+ y2="-1.964%"
+ >
+ <stop offset="0%" stopColor="#F69923"/>
+ <stop offset="10.996%" stopColor="#F79A23"/>
+ <stop offset="94.502%" stopColor="#E97826"/>
+ </linearGradient>
+ <linearGradient
+ id="d"
+ x1="-12.564%"
+ x2="101.304%"
+ y1="108.214%"
+ y2="-1.964%"
+ >
+ <stop offset="0%" stopColor="#F69923"/>
+ <stop offset="8.048%" stopColor="#F79A23"/>
+ <stop offset="41.874%" stopColor="#E97826"/>
+ </linearGradient>
+ <linearGradient
+ id="e"
+ x1="74.724%"
+ x2="6.653%"
+ y1="-3.059%"
+ y2="100.066%"
+ >
+ <stop offset="0%" stopColor="#F6E423"/>
+ <stop offset="41.191%" stopColor="#F79A23"/>
+ <stop offset="73.271%" stopColor="#E97826"/>
+ </linearGradient>
+ <circle id="a" cx={128} cy={128} r={128}/>
+ </defs>
+ <mask id="c" fill="#fff">
+ <use xlinkHref="#a"/>
+ </mask>
+ <circle
+ cx={127.994}
+ cy={127.994}
+ r={123.111}
+ fill="url(#b)"
+ mask="url(#c)"
+ />
+ <path
+ fill="url(#d)"
+ d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128Zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232Z"
+ mask="url(#c)"
+ />
+ <path
+ fill="url(#e)"
+ d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412Z"
+ mask="url(#c)"
+ opacity={0.75}
+ />
+ <path
+ fill="#28170B"
+ d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513Z"
+ mask="url(#c)"
+ opacity={0.75}
+ />
+ <path
+ fill="#FFF"
+ d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488Z"
+ mask="url(#c)"
+ />
+ </svg>
+ );
+}
+
+export function getDesignerIcon(icon: string) {
+ if (icon === 'kamelet') return (
+ <svg
+ className="top-icon" id="icon"
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 32 32"
+ >
+ <title>{"application"}</title>
+ <path d="M16 18H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2ZM6 6v10h10V6ZM26 12v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM26 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM16 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2Z" />
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ )
+ if (icon === 'code') return (
+ <svg
+
+ xmlns="http://www.w3.org/2000/svg"
+ width="24"
+ height="24"
+ fill="none"
+ viewBox="0 0 24 24"
+ >
+ <path
+ fill="#000000"
+ d="M8.502 5.387a.75.75 0 00-1.004-1.115L5.761 5.836c-.737.663-1.347 1.212-1.767 1.71-.44.525-.754 1.088-.754 1.784 0 .695.313 1.258.754 1.782.42.499 1.03 1.049 1.767 1.711l1.737 1.564a.75.75 0 101.004-1.115l-1.697-1.527c-.788-.709-1.319-1.19-1.663-1.598-.33-.393-.402-.622-.402-.817 0-.196.072-.425.402-.818.344-.409.875-.889 1.663-1.598l1.697-1.527zM14.18 4.275a.75.75 0 01.532.918l-3.987 15a.75.75 0 11-1.45-.386l3.987-15a.75.75 0 01.918-.532zM15.443 10.498a.75.75 0 011.059 [...]
+ ></path>
+ </svg>
+ )
+ if (icon === 'routes') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <path
+ d="M29,10H24v2h5v6H22v2h3v2.142a4,4,0,1,0,2,0V20h2a2.0027,2.0027,0,0,0,2-2V12A2.0023,2.0023,0,0,0,29,10ZM28,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,28,26Z"/>
+ <path
+ d="M19,6H14V8h5v6H12v2h3v6.142a4,4,0,1,0,2,0V16h2a2.0023,2.0023,0,0,0,2-2V8A2.0023,2.0023,0,0,0,19,6ZM18,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,18,26Z"/>
+ <path
+ d="M9,2H3A2.002,2.002,0,0,0,1,4v6a2.002,2.002,0,0,0,2,2H5V22.142a4,4,0,1,0,2,0V12H9a2.002,2.002,0,0,0,2-2V4A2.002,2.002,0,0,0,9,2ZM8,26a2,2,0,1,1-2-2A2.0023,2.0023,0,0,1,8,26ZM3,10V4H9l.0015,6Z"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32"/>
+ </svg>)
+ if (icon === 'route') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <title>{"category"}</title>
+ <path d="M27 22.141V18a2 2 0 0 0-2-2h-8v-4h2a2.002 2.002 0 0 0 2-2V4a2.002 2.002 0 0 0-2-2h-6a2.002 2.002 0 0 0-2 2v6a2.002 2.002 0 0 0 2 2h2v4H7a2 2 0 0 0-2 2v4.142a4 4 0 1 0 2 0V18h8v4.142a4 4 0 1 0 2 0V18h8v4.141a4 4 0 1 0 2 0ZM13 4h6l.001 6H13ZM8 26a2 2 0 1 1-2-2 2.002 2.002 0 0 1 2 2Zm10 0a2 2 0 1 1-2-2 2.003 2.003 0 0 1 2 2Zm8 2a2 2 0 1 1 2-2 2.002 2.002 0 0 1-2 2Z" />
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ )
+ if (icon === 'rest') return (
+ <svg className="top-icon" viewBox="0 0 32 32" width="32px" height="32px">
+ <g className="layer">
+ <title>Layer 1</title>
+ <path
+ d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
+ id="svg_1"/>
+ <path
+ d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1.414 [...]
+ id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'beans') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>data--1</title>
+ <rect x="15" y="6" width="13" height="2"/>
+ <rect x="15" y="24" width="13" height="2"/>
+ <rect x="4" y="15" width="13" height="2"/>
+ <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z" transform="translate(0 0)"/>
+ <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z" transform="translate(0 0)"/>
+ <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'dependencies') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>application</title>
+ <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
+ transform="translate(0 0)"/>
+ <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'error') return (
+ <svg className="top-icon" width="36px" height="36px" viewBox="0 0 36 36" version="1.1"
+ preserveAspectRatio="xMidYMid meet">
+ <circle className="clr-i-outline clr-i-outline-path-1" cx="18" cy="26.06" r="1.33"/>
+ <path className="clr-i-outline clr-i-outline-path-2"
+ d="M18,22.61a1,1,0,0,1-1-1v-12a1,1,0,1,1,2,0v12A1,1,0,0,1,18,22.61Z"/>
+ <path className="clr-i-outline clr-i-outline-path-3"
+ d="M18,34A16,16,0,1,1,34,18,16,16,0,0,1,18,34ZM18,4A14,14,0,1,0,32,18,14,14,0,0,0,18,4Z"/>
+ <rect x="0" y="0" width="36" height="36" fillOpacity="0"/>
+ </svg>)
+ if (icon === 'exception') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <title>misuse--alt</title>
+ <polygon
+ points="21.41 23 16 17.591 10.59 23 9 21.41 14.409 16 9 10.591 10.591 9 16 14.409 21.409 9 23 10.591 17.591 16 23 21.41 21.41 23"/>
+ <path d="M16,4A12,12,0,1,1,4,16,12.0136,12.0136,0,0,1,16,4m0-2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Z"
+ transform="translate(0)"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32"/>
+ </svg>)
+ if (icon === 'routeConfiguration') return (
+ <svg className="top-icon" width="32" height="32" viewBox="0 0 32 32">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <path
+ d="M28.83 21.17L25 17.37l.67-.67a1 1 0 000-1.41l-6-6a1 1 0 00-1.41 0l-.79.79-6.76-6.79a1 1 0 00-1.41 0l-4 4-.12.15-4 6a1 1 0 00.12 1.26l3 3a1 1 0 001.42 0L10 13.41l2.09 2.09-4.8 4.79a1 1 0 000 1.41l2 2a1 1 0 00.71.3 1 1 0 00.52-.15l4.33-2.6 2.44 2.45a1 1 0 001.41 0l.67-.7 3.79 3.83a4 4 0 005.66-5.66zM10 10.58l-5 5-1.71-1.71 3.49-5.24L10 5.41l6.09 6.09-2.59 2.58zm8 11l-2.84-2.84-5 3-.74-.74L19 11.41 23.59 16zm9.42 3.83a2 2 0 01-2.83 0l-3.8-3.79 2.83-2.83 3.8 3.79a2 2 0 010 [...]
+ <path
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>)
+ if (icon === 'yaml') return (
+ <svg className="top-icon" x="0px" y="0px" width="32px" height="32px"
+ viewBox="0 0 32 32">
+ <style type="text/css">{".st0{fill:none;}"}</style>
+ <title>document</title>
+ <path
+ d="M25.7,9.3l-7-7C18.5,2.1,18.3,2,18,2H8C6.9,2,6,2.9,6,4v24c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V10C26,9.7,25.9,9.5,25.7,9.3 z M18,4.4l5.6,5.6H18V4.4z M24,28H8V4h8v6c0,1.1,0.9,2,2,2h6V28z"/>
+ <rect x="10" y="22" width="12" height="2"/>
+ <rect x="10" y="16" width="12" height="2"/>
+ <rect className="st0" width="32" height="32"/>
+ </svg>)
+ if (icon === 'code') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <title>code</title>
+ <polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/>
+ <polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/>
+ <rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32" transform="translate(0 32) rotate(-90)"/>
+ </svg>)
+}
+
+
+export class BeanIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>data--1</title>
+ <rect x="15" y="6" width="13" height="2"/>
+ <rect x="15" y="24" width="13" height="2"/>
+ <rect x="4" y="15" width="13" height="2"/>
+ <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z"
+ transform="translate(0 0)"/>
+ <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z"
+ transform="translate(0 0)"/>
+ <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class DependencyIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>application</title>
+ <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
+ transform="translate(0 0)"/>
+ <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class RestIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
+ <g className="layer">
+ <title>Layer 1</title>
+ <path
+ d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
+ id="svg_1"/>
+ <path
+ d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1 [...]
+ id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class ConceptIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>concept</title>
+ <path
+ d="M20.8851,19.4711a5.9609,5.9609,0,0,0,0-6.9422L23,10.4141l1.293,1.2929a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414l-4-4a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414L21.5859,9l-2.1148,2.1149a5.9609,5.9609,0,0,0-6.9422,0L10,8.5859V2H2v8H8.5859l2.529,2.5289a5.9609,5.9609,0,0,0,0,6.9422L9,21.5859,7.707,20.293a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414l4,4a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414L10.4141,23l2.1148-2.1149a5.960 [...]
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1"
+ width="32" height="32"/>
+ </svg>
+ )
+ }
+}
\ No newline at end of file
diff --git a/karavan-designer/src/designer/utils/CamelUi.tsx b/karavan-designer/src/designer/utils/CamelUi.tsx
index ac791920..86dc6c58 100644
--- a/karavan-designer/src/designer/utils/CamelUi.tsx
+++ b/karavan-designer/src/designer/utils/CamelUi.tsx
@@ -29,22 +29,18 @@ import {
} from "karavan-core/lib/model/CamelDefinition";
import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefinition";
import {
- ActivemqIcon,
- AggregateIcon,
- ApiIcon,
+ ActivemqIcon, ApiIcon,
AwsIcon,
AzureIcon,
BlockchainIcon,
CassandraIcon,
ChatIcon,
- ChoiceIcon,
CloudIcon,
ClusterIcon,
DatabaseIcon,
DebeziumIcon,
DocumentIcon,
FileIcon,
- FilterIcon,
GithubIcon,
GitIcon,
GoogleCloudIcon,
@@ -54,9 +50,6 @@ import {
HttpIcon,
IgniteIcon,
InfinispanIcon,
- Intercept,
- InterceptFrom,
- InterceptSendToEndpoint,
IotIcon,
KafkaIcon,
KubernetesIcon,
@@ -66,29 +59,37 @@ import {
MobileIcon,
MonitoringIcon,
NetworkingIcon,
- OnCompletion,
OpenshiftIcon,
OpenstackIcon,
RedisIcon,
RefIcon,
RpcIcon,
- SagaIcon,
SapIcon,
SchedulingIcon,
ScriptIcon,
SearchIcon,
SocialIcon,
- SortIcon,
- SplitIcon,
SpringIcon,
TerminalIcon,
TestingIcon,
- ToIcon,
TransformationIcon,
ValidationIcon,
WebserviceIcon,
WorkflowIcon
-} from "./KaravanIcons";
+} from "../icons/ComponentIcons";
+import {
+ AggregateIcon,
+ ChoiceIcon,
+ FilterIcon,
+ Intercept,
+ InterceptFrom,
+ InterceptSendToEndpoint,
+ OnCompletion,
+ SagaIcon,
+ SortIcon,
+ SplitIcon,
+ ToIcon,
+} from "../icons/EipIcons";
import React from "react";
import {TopologyUtils} from "karavan-core/lib/api/TopologyUtils";
import {CamelDisplayUtil} from "karavan-core/lib/api/CamelDisplayUtil";
diff --git a/karavan-designer/src/topology/CustomNode.tsx b/karavan-designer/src/topology/CustomNode.tsx
index 2d87457d..fb517ae9 100644
--- a/karavan-designer/src/topology/CustomNode.tsx
+++ b/karavan-designer/src/topology/CustomNode.tsx
@@ -19,7 +19,7 @@ import * as React from 'react';
import {RegionsIcon} from '@patternfly/react-icons';
import {DefaultNode, observer} from '@patternfly/react-topology';
-import {getDesignerIcon} from "../designer/utils/KaravanIcons";
+import {getDesignerIcon} from "../designer/icons/KaravanIcons";
import {CamelUi} from "../designer/utils/CamelUi";
import './topology.css';
diff --git a/karavan-designer/src/topology/TopologyTab.tsx b/karavan-designer/src/topology/TopologyTab.tsx
index 520bf8d2..306ca8fb 100644
--- a/karavan-designer/src/topology/TopologyTab.tsx
+++ b/karavan-designer/src/topology/TopologyTab.tsx
@@ -68,6 +68,7 @@ export function TopologyTab (props: Props) {
}
const controller = React.useMemo(() => {
+ console.log(props.files)
const model = getModel(props.files);
const newController = new Visualization();
newController.registerLayoutFactory((_, graph) => new DagreLayout(graph));
diff --git a/karavan-space/src/designer/KaravanDesigner.tsx b/karavan-space/src/designer/KaravanDesigner.tsx
index 766b4e1f..4b7b3c7a 100644
--- a/karavan-space/src/designer/KaravanDesigner.tsx
+++ b/karavan-space/src/designer/KaravanDesigner.tsx
@@ -35,7 +35,7 @@ import {CamelUtil} from "karavan-core/lib/api/CamelUtil";
import {CamelUi} from "./utils/CamelUi";
import {useDesignerStore, useIntegrationStore} from "./DesignerStore";
import {shallow} from "zustand/shallow";
-import {getDesignerIcon} from "./utils/KaravanIcons";
+import {getDesignerIcon} from "./icons/KaravanIcons";
import {InfrastructureAPI} from "./utils/InfrastructureAPI";
import {EventBus, IntegrationUpdate} from "./utils/EventBus";
import {RestDesigner} from "./rest/RestDesigner";
diff --git a/karavan-designer/src/designer/utils/KaravanIcons.tsx b/karavan-space/src/designer/icons/ComponentIcons.tsx
similarity index 74%
rename from karavan-designer/src/designer/utils/KaravanIcons.tsx
rename to karavan-space/src/designer/icons/ComponentIcons.tsx
index 906ba86e..a05f5e70 100644
--- a/karavan-designer/src/designer/utils/KaravanIcons.tsx
+++ b/karavan-space/src/designer/icons/ComponentIcons.tsx
@@ -16,736 +16,12 @@
*/
import React from 'react';
-export function KaravanIcon(className?: string) {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- xmlnsXlink="http://www.w3.org/1999/xlink"
- id="svg50"
- width="256"
- height="256"
- preserveAspectRatio="xMidYMid"
- version="1.1"
- viewBox="0 0 256 256"
- className={className ? className : "logo"}
- >
- <defs id="defs31">
- <linearGradient id="linearGradient1351">
- <stop
- id="stop1347"
- offset="0"
- stopColor="#dcffff"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop1349"
- offset="1"
- stopColor="#96d2e6"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <circle id="path-1" cx="128" cy="128" r="128"></circle>
- <linearGradient
- id="linearGradient-3"
- x1="-26.051"
- x2="254.316"
- y1="271.331"
- y2="0.048"
- gradientUnits="userSpaceOnUse"
- >
- <stop
- id="stop10"
- offset="0%"
- stopColor="#4790bb"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop12"
- offset="10.996%"
- stopColor="#64b7db"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop14"
- offset="94.502%"
- stopColor="#326ea0"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <linearGradient
- id="linearGradient-4"
- x1="-32.163"
- x2="259.338"
- y1="277.029"
- y2="-5.028"
- gradientUnits="userSpaceOnUse"
- >
- <stop id="stop17" offset="0%" stopColor="#F69923"></stop>
- <stop id="stop19" offset="8.048%" stopColor="#F79A23"></stop>
- <stop id="stop21" offset="41.874%" stopColor="#E97826"></stop>
- </linearGradient>
- <linearGradient
- id="linearGradient-5"
- x1="217.945"
- x2="99.459"
- y1="67.505"
- y2="247.005"
- gradientTransform="scale(.96442 1.0369)"
- gradientUnits="userSpaceOnUse"
- xlinkHref="#linearGradient-4"
- >
- <stop
- id="stop24"
- offset="0%"
- stopColor="#92d6d5"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop26"
- offset="41.191%"
- stopColor="#79b7cc"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop28"
- offset="73.271%"
- stopColor="#5891c5"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <mask id="mask-2" fill="#fff">
- <use id="use33" xlinkHref="#path-1"></use>
- </mask>
- <mask id="mask-2-7" fill="#fff">
- <use id="use137" xlinkHref="#path-1"></use>
- </mask>
- <linearGradient
- id="linearGradient1345"
- x1="233.122"
- x2="2.24"
- y1="56.015"
- y2="242.78"
- gradientUnits="userSpaceOnUse"
- xlinkHref="#linearGradient1351"
- ></linearGradient>
- </defs>
- <circle
- id="circle38"
- cx="127.994"
- cy="127.994"
- r="123.111"
- fill="url(#linearGradient-3)"
- fillRule="nonzero"
- mask="url(#mask-2)"
- ></circle>
- <g id="g2266">
- <path
- id="path42"
- fill="url(#linearGradient-5)"
- fillOpacity="1"
- fillRule="nonzero"
- d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412z"
- mask="url(#mask-2)"
- opacity="0.75"
- ></path>
- </g>
- <path
- id="path44"
- fill="#1e4b7b"
- fillOpacity="1"
- fillRule="nonzero"
- d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513z"
- mask="url(#mask-2)"
- opacity="0.75"
- ></path>
- <path
- id="path150"
- fill="url(#linearGradient1345)"
- fillOpacity="1"
- fillRule="nonzero"
- d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488z"
- mask="url(#mask-2-7)"
- transform="translate(-.769 -.133)"
- ></path>
- <path
- id="path40"
- fill="#2d4150"
- fillOpacity="1"
- fillRule="nonzero"
- d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232z"
- mask="url(#mask-2)"
- transform="translate(-.59) scale(1.00078)"
- ></path>
- </svg>
- );
-}
-
-export function CamelIcon(props?: (JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>) | undefined) {
- return (<svg
- xmlns="http://www.w3.org/2000/svg"
- xmlnsXlink="http://www.w3.org/1999/xlink"
- width={24}
- height={24}
- preserveAspectRatio="xMidYMid"
- viewBox="0 0 256 256"
- {...props}
- className="icon">
- <defs>
- <linearGradient
- id="b"
- x1="-12.564%"
- x2="101.304%"
- y1="108.214%"
- y2="-1.964%"
- >
- <stop offset="0%" stopColor="#F69923"/>
- <stop offset="10.996%" stopColor="#F79A23"/>
- <stop offset="94.502%" stopColor="#E97826"/>
- </linearGradient>
- <linearGradient
- id="d"
- x1="-12.564%"
- x2="101.304%"
- y1="108.214%"
- y2="-1.964%"
- >
- <stop offset="0%" stopColor="#F69923"/>
- <stop offset="8.048%" stopColor="#F79A23"/>
- <stop offset="41.874%" stopColor="#E97826"/>
- </linearGradient>
- <linearGradient
- id="e"
- x1="74.724%"
- x2="6.653%"
- y1="-3.059%"
- y2="100.066%"
- >
- <stop offset="0%" stopColor="#F6E423"/>
- <stop offset="41.191%" stopColor="#F79A23"/>
- <stop offset="73.271%" stopColor="#E97826"/>
- </linearGradient>
- <circle id="a" cx={128} cy={128} r={128}/>
- </defs>
- <mask id="c" fill="#fff">
- <use xlinkHref="#a"/>
- </mask>
- <circle
- cx={127.994}
- cy={127.994}
- r={123.111}
- fill="url(#b)"
- mask="url(#c)"
- />
- <path
- fill="url(#d)"
- d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128Zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232Z"
- mask="url(#c)"
- />
- <path
- fill="url(#e)"
- d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412Z"
- mask="url(#c)"
- opacity={0.75}
- />
- <path
- fill="#28170B"
- d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513Z"
- mask="url(#c)"
- opacity={0.75}
- />
- <path
- fill="#FFF"
- d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488Z"
- mask="url(#c)"
- />
- </svg>
- );
-}
-
-export function getDesignerIcon(icon: string) {
- if (icon === 'kamelet') return (
- <svg
- className="top-icon" id="icon"
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 32 32"
- >
- <title>{"application"}</title>
- <path d="M16 18H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2ZM6 6v10h10V6ZM26 12v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM26 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM16 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2Z" />
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- )
- if (icon === 'code') return (
- <svg
-
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- fill="none"
- viewBox="0 0 24 24"
- >
- <path
- fill="#000000"
- d="M8.502 5.387a.75.75 0 00-1.004-1.115L5.761 5.836c-.737.663-1.347 1.212-1.767 1.71-.44.525-.754 1.088-.754 1.784 0 .695.313 1.258.754 1.782.42.499 1.03 1.049 1.767 1.711l1.737 1.564a.75.75 0 101.004-1.115l-1.697-1.527c-.788-.709-1.319-1.19-1.663-1.598-.33-.393-.402-.622-.402-.817 0-.196.072-.425.402-.818.344-.409.875-.889 1.663-1.598l1.697-1.527zM14.18 4.275a.75.75 0 01.532.918l-3.987 15a.75.75 0 11-1.45-.386l3.987-15a.75.75 0 01.918-.532zM15.443 10.498a.75.75 0 011.059 [...]
- ></path>
- </svg>
- )
- if (icon === 'routes') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <path
- d="M29,10H24v2h5v6H22v2h3v2.142a4,4,0,1,0,2,0V20h2a2.0027,2.0027,0,0,0,2-2V12A2.0023,2.0023,0,0,0,29,10ZM28,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,28,26Z"/>
- <path
- d="M19,6H14V8h5v6H12v2h3v6.142a4,4,0,1,0,2,0V16h2a2.0023,2.0023,0,0,0,2-2V8A2.0023,2.0023,0,0,0,19,6ZM18,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,18,26Z"/>
- <path
- d="M9,2H3A2.002,2.002,0,0,0,1,4v6a2.002,2.002,0,0,0,2,2H5V22.142a4,4,0,1,0,2,0V12H9a2.002,2.002,0,0,0,2-2V4A2.002,2.002,0,0,0,9,2ZM8,26a2,2,0,1,1-2-2A2.0023,2.0023,0,0,1,8,26ZM3,10V4H9l.0015,6Z"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32"/>
- </svg>)
- if (icon === 'route') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <title>{"category"}</title>
- <path d="M27 22.141V18a2 2 0 0 0-2-2h-8v-4h2a2.002 2.002 0 0 0 2-2V4a2.002 2.002 0 0 0-2-2h-6a2.002 2.002 0 0 0-2 2v6a2.002 2.002 0 0 0 2 2h2v4H7a2 2 0 0 0-2 2v4.142a4 4 0 1 0 2 0V18h8v4.142a4 4 0 1 0 2 0V18h8v4.141a4 4 0 1 0 2 0ZM13 4h6l.001 6H13ZM8 26a2 2 0 1 1-2-2 2.002 2.002 0 0 1 2 2Zm10 0a2 2 0 1 1-2-2 2.003 2.003 0 0 1 2 2Zm8 2a2 2 0 1 1 2-2 2.002 2.002 0 0 1-2 2Z" />
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- )
- if (icon === 'rest') return (
- <svg className="top-icon" viewBox="0 0 32 32" width="32px" height="32px">
- <g className="layer">
- <title>Layer 1</title>
- <path
- d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
- id="svg_1"/>
- <path
- d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1.414 [...]
- id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
- </g>
- </svg>
- )
- if (icon === 'beans') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>data--1</title>
- <rect x="15" y="6" width="13" height="2"/>
- <rect x="15" y="24" width="13" height="2"/>
- <rect x="4" y="15" width="13" height="2"/>
- <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z" transform="translate(0 0)"/>
- <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z" transform="translate(0 0)"/>
- <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- if (icon === 'dependencies') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>application</title>
- <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
- transform="translate(0 0)"/>
- <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- if (icon === 'error') return (
- <svg className="top-icon" width="36px" height="36px" viewBox="0 0 36 36" version="1.1"
- preserveAspectRatio="xMidYMid meet">
- <circle className="clr-i-outline clr-i-outline-path-1" cx="18" cy="26.06" r="1.33"/>
- <path className="clr-i-outline clr-i-outline-path-2"
- d="M18,22.61a1,1,0,0,1-1-1v-12a1,1,0,1,1,2,0v12A1,1,0,0,1,18,22.61Z"/>
- <path className="clr-i-outline clr-i-outline-path-3"
- d="M18,34A16,16,0,1,1,34,18,16,16,0,0,1,18,34ZM18,4A14,14,0,1,0,32,18,14,14,0,0,0,18,4Z"/>
- <rect x="0" y="0" width="36" height="36" fillOpacity="0"/>
- </svg>)
- if (icon === 'exception') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <title>misuse--alt</title>
- <polygon
- points="21.41 23 16 17.591 10.59 23 9 21.41 14.409 16 9 10.591 10.591 9 16 14.409 21.409 9 23 10.591 17.591 16 23 21.41 21.41 23"/>
- <path d="M16,4A12,12,0,1,1,4,16,12.0136,12.0136,0,0,1,16,4m0-2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Z"
- transform="translate(0)"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32"/>
- </svg>)
- if (icon === 'routeConfiguration') return (
- <svg className="top-icon" width="32" height="32" viewBox="0 0 32 32">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <path
- d="M28.83 21.17L25 17.37l.67-.67a1 1 0 000-1.41l-6-6a1 1 0 00-1.41 0l-.79.79-6.76-6.79a1 1 0 00-1.41 0l-4 4-.12.15-4 6a1 1 0 00.12 1.26l3 3a1 1 0 001.42 0L10 13.41l2.09 2.09-4.8 4.79a1 1 0 000 1.41l2 2a1 1 0 00.71.3 1 1 0 00.52-.15l4.33-2.6 2.44 2.45a1 1 0 001.41 0l.67-.7 3.79 3.83a4 4 0 005.66-5.66zM10 10.58l-5 5-1.71-1.71 3.49-5.24L10 5.41l6.09 6.09-2.59 2.58zm8 11l-2.84-2.84-5 3-.74-.74L19 11.41 23.59 16zm9.42 3.83a2 2 0 01-2.83 0l-3.8-3.79 2.83-2.83 3.8 3.79a2 2 0 010 [...]
- <path
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>)
- if (icon === 'yaml') return (
- <svg className="top-icon" x="0px" y="0px" width="32px" height="32px"
- viewBox="0 0 32 32">
- <style type="text/css">{".st0{fill:none;}"}</style>
- <title>document</title>
- <path
- d="M25.7,9.3l-7-7C18.5,2.1,18.3,2,18,2H8C6.9,2,6,2.9,6,4v24c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V10C26,9.7,25.9,9.5,25.7,9.3 z M18,4.4l5.6,5.6H18V4.4z M24,28H8V4h8v6c0,1.1,0.9,2,2,2h6V28z"/>
- <rect x="10" y="22" width="12" height="2"/>
- <rect x="10" y="16" width="12" height="2"/>
- <rect className="st0" width="32" height="32"/>
- </svg>)
- if (icon === 'code') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <title>code</title>
- <polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/>
- <polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/>
- <rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32" transform="translate(0 32) rotate(-90)"/>
- </svg>)
-}
-
-
-export class BeanIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>data--1</title>
- <rect x="15" y="6" width="13" height="2"/>
- <rect x="15" y="24" width="13" height="2"/>
- <rect x="4" y="15" width="13" height="2"/>
- <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z"
- transform="translate(0 0)"/>
- <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z"
- transform="translate(0 0)"/>
- <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- }
-}
-
-export class DependencyIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>application</title>
- <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
- transform="translate(0 0)"/>
- <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- }
-}
-
-export class RestIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" viewBox="0 0 32 32">
- <g className="layer">
- <title>Layer 1</title>
- <path
- d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
- id="svg_1"/>
- <path
- d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1 [...]
- id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
- </g>
- </svg>
- )
- }
-}
-
-export class ConceptIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>concept</title>
- <path
- d="M20.8851,19.4711a5.9609,5.9609,0,0,0,0-6.9422L23,10.4141l1.293,1.2929a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414l-4-4a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414L21.5859,9l-2.1148,2.1149a5.9609,5.9609,0,0,0-6.9422,0L10,8.5859V2H2v8H8.5859l2.529,2.5289a5.9609,5.9609,0,0,0,0,6.9422L9,21.5859,7.707,20.293a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414l4,4a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414L10.4141,23l2.1148-2.1149a5.960 [...]
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1"
- width="32" height="32"/>
- </svg>
- )
- }
-}
-
-export function AggregateIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M496.2 417.71l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 417.71h292.4z"></path>
- <path
- d="M516.1 426.23v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V426.22l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM247.14 358.45l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-. [...]
- <path
- d="M277.46 154.15V264.2c0 5.52-4.48 10-10 10H82.69c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- <g>
- <path d="M610.57 145.6l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
- <path
- d="M627.5 154.15V264.2c0 5.52-4.48 10-10 10H432.73c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- </g>
- </svg>
- );
-}
-
-export function ToIcon() {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
- viewBox="0 0 32 32"
- className="icon"
- >
- <path
- d="M24 22v-1h6v-2h-6v-6h6v-2h-6v-1a2 2 0 0 0-2-2h-6a8.007 8.007 0 0 0-7.93 7v2A8.007 8.007 0 0 0 16 24h6a2 2 0 0 0 2-2zm-8 0a6 6 0 1 1 0-12h6v12z"/>
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- );
-}
-
-export function ChoiceIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M407.33 113.97V609.2c0 2.75-1.9 5-4.22 5H291.55c-2.33 0-4.22-2.25-4.22-5V113.97c0-2.76 1.89-5 4.22-5h111.56c2.32 0 4.22 2.24 4.22 5zM27.1 437.55l60.87-57.64c.95-.9 2.32-1.41 3.76-1.41H258.2c2.76 0 5 1.87 5 4.17v111.65c0 2.3-2.24 4.17-5 4.17H91.54c-1.38 0-2.7-.48-3.65-1.32L27.2 443.15c-1.77-1.58-1.81-3.99-.1-5.61zM667.57 285.62l-60.87 57.64c-.95.9-2.32 1.41-3.76 1.41H436.47c-2.76 0-5-1.87-5-4.17V228.85c0-2.3 2.24-4.17 5-4.17h166.66c1.38 0 2.7.48 3.65 1.32l60.69 54.02c1. [...]
- </svg>
- );
-}
-
-
-export function SplitIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M496.2 83.65l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 83.65h292.4z"></path>
- <path
- d="M516.1 92.17v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V92.16l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM524.34 397.22l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-.42 [...]
- <path
- d="M277.36 476.26v110.05c0 5.52-4.48 10-10 10H82.59c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- <g>
- <path d="M610.48 467.71l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
- <path
- d="M627.41 476.26v110.05c0 5.52-4.48 10-10 10H432.64c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- </g>
- </svg>
- );
-}
-
-export function SagaIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M626.41 255.77c-.56-4.77-2.95-9.03-6.71-11.99l-46.46-36.64-1.06-1.09-.8-.28c-.81-.52-1.67-.98-2.56-1.36-.43-.19-.85-.36-1.25-.5-.47-.16-.96-.31-1.51-.45-.47-.11-.96-.22-1.45-.3-.49-.08-.97-.14-1.43-.18-.96-.08-1.95-.08-2.91-.01-.41.03-.83.08-1.23.14-.41.06-.82.14-1.25.23l-.58.14c-.1.03-.2.05-.31.08-.11.03-.21.06-.3.09-.29.08-.57.18-.86.28-.49.17-.99.37-1.53.61l-.16.08c-.32.15-.65.31-.97.49-.49.26-.93.53-1.34.81-.39.26-.76.52-1.12.8l-46.96 37.05a17.823 17.823 0 00-6.72 [...]
- </svg>
- );
-}
-
-export function TransformIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M441.77 277.51l-82.73 64.23c-.07.05-.13.09-.19.13-5.37 3.48-12.33 3.48-17.69.01-.07-.05-.13-.09-.18-.13l-82.76-64.24h183.54z"></path>
- <path
- d="M462.2 287.02V420.7c0 .98-.79 1.77-1.77 1.77H239.57c-.98 0-1.77-.79-1.77-1.77V287.02l90.91 70.56c.54.44 1.06.8 1.57 1.12 5.99 3.88 12.86 5.81 19.72 5.81s13.73-1.94 19.73-5.81c.49-.32 1.01-.68 1.58-1.13l90.89-70.55zM622.28 330.68l-35.89 31.78a1.48 1.48 0 01-1.98 0l-35.89-31.78c-.3-.26-.48-.63-.51-1.03-.02-.4.11-.79.38-1.09l11.28-12.73c.55-.61 1.49-.67 2.11-.12l12.44 11.02c-5.24-51.26-28.18-99.47-64.84-136.12-35.82-35.82-81.13-58.05-131.04-64.27-.1 0-.19-.03-.28-.06v.09s [...]
- </svg>
- );
-}
-
-export function FilterIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 700 700" className="icon">
- <path
- d="M565.62 156.56L413.36 350.33a10.032 10.032 0 00-2.14 6.18v190.52c0 19.05-25.01 34.49-55.86 34.49s-55.86-15.44-55.86-34.49V356.51c0-2.24-.75-4.42-2.14-6.18L145.1 156.56c-5.15-6.56-.48-16.18 7.87-16.18h404.79c8.34 0 13.02 9.62 7.86 16.18z"></path>
- </svg>
- );
-}
-
-export function SortIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <defs>
- <style>{".b{stroke-linejoin: round;}.b,.c {stroke-linecap: round;}.b,.c,.d {fill: none;stroke: #000;stroke-width: 35px;}.c,.d {stroke-miterlimit: 10;}"}</style>
- </defs>
- <path d="M160.63 168.63L160.63 531.37" className="d"></path>
- <path d="M576.31 170.27L269.3 170.27" className="c"></path>
- <path d="M517.53 290.64L269.3 290.64" className="c"></path>
- <path d="M458.75 411L269.3 411" className="c"></path>
- <path d="M399.97 531.37L269.3 531.37" className="c"></path>
- <path d="M197.7 197.95L160.63 168.71 123.55 197.95" className="b"></path>
- <path d="M123.55 502.12L160.62 531.37 197.7 502.12" className="b"></path>
- </svg>
- );
-}
-
-export function OnCompletion() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M22 26.59L19.41 24 18 25.41 22 29.41 30 21.41 28.59 20 22 26.59z"></path>
- <circle cx="16" cy="16" r="2"></circle>
- <path d="M16 22a6 6 0 116-6 6.007 6.007 0 01-6 6zm0-10a4 4 0 104 4 4.005 4.005 0 00-4-4z"></path>
- <path d="M28 16a12 12 0 10-12 12v-2a10 10 0 1110-10z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function Intercept() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M15 4H17V28H15z"></path>
- <path
- d="M10 7v18H4V7h6m0-2H4a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2zM28 7v18h-6V7h6m0-2h-6a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function InterceptFrom() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M26 30H14a2 2 0 01-2-2v-3h2v3h12V4H14v3h-2V4a2 2 0 012-2h12a2 2 0 012 2v24a2 2 0 01-2 2z"></path>
- <path d="M14.59 20.59L18.17 17 4 17 4 15 18.17 15 14.59 11.41 16 10 22 16 16 22 14.59 20.59z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function InterceptSendToEndpoint() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path
- d="M6 30h12a2.002 2.002 0 002-2v-3h-2v3H6V4h12v3h2V4a2.002 2.002 0 00-2-2H6a2.002 2.002 0 00-2 2v24a2.002 2.002 0 002 2z"></path>
- <path
- d="M20.586 20.586L24.172 17 10 17 10 15 24.172 15 20.586 11.414 22 10 28 16 22 22 20.586 20.586z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-
export function SpringIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<g fill="none" fillRule="evenodd">
<path d="M0 0h32v32H0z"></path>
<path
@@ -761,11 +37,9 @@ export function QuarkusIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
preserveAspectRatio="xMidYMid"
viewBox="-0.5 0 257 257"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#4695EB"
d="M213.554 0c23.418.08 42.377 19.052 42.443 42.47v171.084c-.066 23.428-19.042 42.404-42.47 42.47h-25.439l-11.661-28.318h37.127c7.774-.1 14.051-6.378 14.152-14.152V42.47c-.1-7.774-6.378-14.051-14.152-14.152H42.47c-7.774.1-14.051 6.378-14.152 14.152v171.084c.1 7.774 6.378 14.051 14.152 14.152h62.607l22.935-48.494 31.625 76.812H42.47C19.042 255.958.066 236.982 0 213.554V42.47C.066 19.042 19.042.066 42.47 0h171.084zm-43.983 139.727v45.51l-39.417-22.748 39.417-22.762zM86.453 [...]
@@ -786,10 +60,8 @@ export function DatabaseIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="800"
- height="800"
viewBox="0 0 24 24"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fillRule="evenodd"
d="M12 1.25c-2.487 0-4.774.402-6.466 1.079-.844.337-1.577.758-2.112 1.264C2.886 4.1 2.5 4.744 2.5 5.5v12.987l.026.013H2.5c0 .756.386 1.4.922 1.907.535.506 1.268.927 2.112 1.264 1.692.677 3.979 1.079 6.466 1.079s4.773-.402 6.466-1.079c.844-.337 1.577-.758 2.112-1.264.536-.507.922-1.151.922-1.907h-.026l.026-.013V5.5c0-.756-.386-1.4-.922-1.907-.535-.506-1.268-.927-2.112-1.264C16.773 1.652 14.487 1.25 12 1.25zM4 5.5c0-.21.104-.487.453-.817.35-.332.899-.666 1.638-.962C7.566 3. [...]
@@ -802,10 +74,8 @@ export function CloudIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M16 7a7.66 7.66 0 0 1 1.51.15 8 8 0 0 1 6.35 6.34l.26 1.35 1.35.24a5.5 5.5 0 0 1-1 10.92H7.5a5.5 5.5 0 0 1-1-10.92l1.34-.24.26-1.35A8 8 0 0 1 16 7m0-2a10 10 0 0 0-9.83 8.12A7.5 7.5 0 0 0 7.49 28h17a7.5 7.5 0 0 0 1.32-14.88 10 10 0 0 0-7.94-7.94A10.27 10.27 0 0 0 16 5Z"/>
<path
@@ -823,10 +93,8 @@ export function FileIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"document"}</title>
<path
d="m25.7 9.3-7-7c-.2-.2-.4-.3-.7-.3H8c-1.1 0-2 .9-2 2v24c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V10c0-.3-.1-.5-.3-.7zM18 4.4l5.6 5.6H18V4.4zM24 28H8V4h8v6c0 1.1.9 2 2 2h6v16z"/>
@@ -845,10 +113,8 @@ export function MessagingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M28 28H4a2.002 2.002 0 0 1-2-2v-5h2v5h24v-5h2v5a2.002 2.002 0 0 1-2 2Z"/>
<path d="M7 21h18v2H7zM7 16h18v2H7zM7 11h18v2H7zM7 6h18v2H7z"/>
<path
@@ -866,10 +132,8 @@ export function SchedulingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M16 30a14 14 0 1 1 14-14 14 14 0 0 1-14 14Zm0-26a12 12 0 1 0 12 12A12 12 0 0 0 16 4Z"/>
<path d="M20.59 22 15 16.41V7h2v8.58l5 5.01L20.59 22z"/>
<path
@@ -887,10 +151,8 @@ export function HttpIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M30 11h-5v10h2v-3h3a2.003 2.003 0 0 0 2-2v-3a2.002 2.002 0 0 0-2-2Zm-3 5v-3h3l.001 3ZM10 13h2v8h2v-8h2v-2h-6v2zM23 11h-6v2h2v8h2v-8h2v-2zM6 11v4H3v-4H1v10h2v-4h3v4h2V11H6z"/>
<path
@@ -908,11 +170,9 @@ export function GoogleCloudIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -25 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#EA4335"
d="m170.252 56.819 22.253-22.253 1.483-9.37C153.437-11.677 88.976-7.496 52.42 33.92 42.267 45.423 34.734 59.764 30.717 74.573l7.97-1.123 44.505-7.34 3.436-3.513c19.797-21.742 53.27-24.667 76.128-6.168l7.496.39Z"
@@ -937,11 +197,9 @@ export function AwsIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
fill="none"
viewBox="0 0 16 16"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#252F3E"
d="M4.51 7.687c0 .197.02.357.058.475.042.117.096.245.17.384a.233.233 0 0 1 .037.123c0 .053-.032.107-.1.16l-.336.224a.255.255 0 0 1-.138.048c-.054 0-.107-.026-.16-.074a1.652 1.652 0 0 1-.192-.251 4.137 4.137 0 0 1-.165-.315c-.415.491-.936.737-1.564.737-.447 0-.804-.129-1.064-.385-.261-.256-.394-.598-.394-1.025 0-.454.16-.822.484-1.1.325-.278.756-.416 1.304-.416.18 0 .367.016.564.042.197.027.4.07.612.118v-.39c0-.406-.085-.689-.25-.854-.17-.166-.458-.246-.868-.246-.186 0-.37 [...]
@@ -960,10 +218,8 @@ export function MailIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"email"}</title>
<path
d="M28 6H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h24a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2Zm-2.2 2L16 14.78 6.2 8ZM4 24V8.91l11.43 7.91a1 1 0 0 0 1.14 0L28 8.91V24Z"/>
@@ -982,10 +238,8 @@ export function IotIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"iot--platform"}</title>
<path
d="M30 19h-4v-4h-2v9H8V8h9V6h-4V2h-2v4H8a2.002 2.002 0 0 0-2 2v3H2v2h4v6H2v2h4v3a2.002 2.002 0 0 0 2 2h3v4h2v-4h6v4h2v-4h3a2.003 2.003 0 0 0 2-2v-3h4Z"/>
@@ -1005,12 +259,10 @@ export function IotIcon() {
export function GithubIcon() {
return (
<svg
- width={32}
- height={32}
aria-hidden="true"
data-view-component="true"
viewBox="0 0 16 16"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45 [...]
</svg>
@@ -1022,10 +274,8 @@ export function CassandraIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
- width={113.636}
- height={58.899}
viewBox="0 0 113.63554 58.899029"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<path id="a" d="M24.216.082v24.141H.053V.082z"/>
</defs>
@@ -1112,10 +362,8 @@ export function ActivemqIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={116.42}
- height={167.526}
viewBox="0 0 30.803 44.324"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<filter
id="a"
@@ -1400,11 +648,9 @@ export function KafkaIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="-78.5 0 413 413"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#1A1919"
d="M87.932 36.714c-4.55-4.571-10.896-7.394-17.951-7.394-7.029 0-13.326 2.823-17.822 7.394h-.13c-4.535 4.55-7.358 10.9-7.358 17.93 0 7.055 2.823 13.352 7.359 17.875l.129.102c4.496 4.55 10.793 7.346 17.822 7.346 7.055 0 13.402-2.797 17.951-7.346L88 72.52c4.558-4.523 7.354-10.82 7.354-17.876 0-7.029-2.796-13.38-7.354-17.929h-.067Zm-17.951 346.64a25.504 25.504 0 0 0 17.951-7.368l.067-.134c4.558-4.487 7.354-10.838 7.354-17.817 0-7.056-2.796-13.38-7.354-17.952h-.067c-4.55-4.625 [...]
@@ -1419,7 +665,7 @@ export function GrapeIcon() {
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
viewBox="0 0 512 512"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M438.557 512H19.785c-8.216 0-14.876-6.66-14.876-14.876V256.916c0-8.216 6.66-14.876 14.876-14.876s14.876 6.66 14.876 14.876v225.332h389.021v-32.833c0-8.216 6.661-14.876 14.876-14.876s14.876 6.66 14.876 14.876v47.709c-.001 8.216-6.662 14.876-14.877 14.876z"
style={{
@@ -1452,10 +698,8 @@ export function MachineLearningIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M27 24a2.96 2.96 0 0 0-1.285.3l-4.3-4.3H18v2h2.586l3.715 3.715A2.966 2.966 0 0 0 24 27a3 3 0 1 0 3-3Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1ZM27 13a2.995 2.995 0 0 0-2.816 2H18v2h6.184A2.995 2.995 0 1 0 27 13Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1ZM27 2a3.003 3.003 0 0 0-3 3 2.966 2.966 0 0 0 .348 1.373L20.596 10H18v2h3.404l4.4-4.252A2.999 2.999 0 1 0 27 2Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1Z"/>
<path
@@ -1475,10 +719,8 @@ export function TerminalIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"terminal"}</title>
<path
d="M26 4.01H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2v-20a2 2 0 0 0-2-2Zm0 2v4H6v-4Zm-20 20v-14h20v14Z"/>
@@ -1498,10 +740,8 @@ export function SapIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<circle
cx={512}
cy={512}
@@ -1524,10 +764,8 @@ export function ScriptIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"script"}</title>
<path
d="m18.83 26 2.58-2.58L20 22l-4 4 4 4 1.42-1.41L18.83 26zM27.17 26l-2.58 2.58L26 30l4-4-4-4-1.42 1.41L27.17 26z"/>
@@ -1548,10 +786,8 @@ export function ValidationIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="m22 27.18-2.59-2.59L18 26l4 4 8-8-1.41-1.41L22 27.18z"/>
<path
d="M15 28H8V4h8v6a2.006 2.006 0 0 0 2 2h6v6h2v-8a.91.91 0 0 0-.3-.7l-7-7A.909.909 0 0 0 18 2H8a2.006 2.006 0 0 0-2 2v24a2.006 2.006 0 0 0 2 2h7Zm3-23.6 5.6 5.6H18Z"/>
@@ -1570,11 +806,9 @@ export function OpenstackIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -2.5 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#DA1A32"
d="M57.82 170.723v9.156c0 7.104 5.756 12.86 12.86 12.86h114.65c7.104 0 12.86-5.756 12.86-12.86v-9.156H256v56.051c0 13.082-10.703 23.785-23.785 23.785H23.785C10.703 250.559 0 239.856 0 226.774v-56.051h57.82Zm-.01-74.353v57.809H0v-57.81h57.81Zm198.19 0v57.809h-57.81v-57.81H256ZM232.215 0C245.297 0 256 10.703 256 23.795v56.041h-57.81V70.68c0-7.104-5.756-12.86-12.86-12.86H70.67c-7.104 0-12.86 5.756-12.86 12.86v9.156H0V23.785C0 10.703 10.703 0 23.785 0Z"
@@ -1587,11 +821,9 @@ export function OpenshiftIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -9.5 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#DA2430"
d="m74.84 106.893-40.869 14.87c.525 6.552 1.652 13.024 3.24 19.366l38.818-14.137c-1.244-6.552-1.689-13.32-1.18-20.1M255.444 61.702c-2.85-5.879-6.147-11.561-9.966-16.916l-40.857 14.87c4.755 4.864 8.743 10.33 12.007 16.176L255.445 61.7v.002Z"
@@ -1632,10 +864,8 @@ export function RefIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M4 20v2h4.586L2 28.586 3.414 30 10 23.414V28h2v-8H4zM30 30h-8v-8h8Zm-6-2h4v-4h-4ZM20 20h-8v-8h8Zm-6-2h4v-4h-4Z"/>
<path d="M24 17h-2v-2h2a4 4 0 0 0 0-8H12V5h12a6 6 0 0 1 0 12ZM10 10H2V2h8ZM4 8h4V4H4Z"/>
@@ -1654,11 +884,9 @@ export function RedisIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -18 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#912626"
d="M245.97 168.943c-13.662 7.121-84.434 36.22-99.501 44.075-15.067 7.856-23.437 7.78-35.34 2.09-11.902-5.69-87.216-36.112-100.783-42.597C3.566 169.271 0 166.535 0 163.951v-25.876s98.05-21.345 113.879-27.024c15.828-5.679 21.32-5.884 34.79-.95 13.472 4.936 94.018 19.468 107.331 24.344l-.006 25.51c.002 2.558-3.07 5.364-10.024 8.988"
@@ -1703,10 +931,8 @@ export function SearchIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"/>
<path
@@ -1724,10 +950,8 @@ export function BlockchainIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"blockchain"}</title>
<path d="M6 24H4V8h2ZM28 8h-2v16h2Zm-4-2V4H8v2Zm0 22v-2H8v2Z"/>
<path
@@ -1745,10 +969,8 @@ export function ChatIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"chat"}</title>
<path
d="M17.74 30 16 29l4-7h6a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h9v2H6a4 4 0 0 1-4-4V8a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4v12a4 4 0 0 1-4 4h-4.84Z"/>
@@ -1769,10 +991,8 @@ export function WorkflowIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 512 512"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M445.66 49.341H340.206L294.008 3.143c-4.192-4.191-10.99-4.191-15.183 0l-49.341 49.342c-4.192 4.192-4.192 10.99 0 15.183l46.198 46.198v38.494h-80.516c-5.929 0-10.736 4.806-10.736 10.735v21.471h-42.942v-21.471c0-5.929-4.806-10.735-10.736-10.735H66.34c-5.929 0-10.735 4.806-10.735 10.735v64.413c0 5.929 4.806 10.735 10.735 10.735h20.755v93.798c0 5.929 4.806 10.736 10.735 10.736h95.437l-10.346 10.346c-4.192 4.192-4.193 10.99 0 15.182a10.7 10.7 0 0 0 7.591 3.144c2.747 0 5.495 [...]
</svg>
@@ -1783,10 +1003,8 @@ export function WebserviceIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"fog"}</title>
<path
d="M25.829 13.116A10.02 10.02 0 0 0 16 5v2a8.023 8.023 0 0 1 7.865 6.493l.259 1.346 1.349.245A5.502 5.502 0 0 1 24.508 26H16v2h8.508a7.502 7.502 0 0 0 1.32-14.884ZM8 24h6v2H8zM4 24h2v2H4zM6 20h8v2H6zM2 20h2v2H2zM8 16h6v2H8zM4 16h2v2H4zM10 12h4v2h-4zM6 12h2v2H6zM12 8h2v2h-2z"/>
@@ -1805,10 +1023,8 @@ export function MobileIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M23 7h4v4h-4zM23 13h4v4h-4zM17 7h4v4h-4zM17 13h4v4h-4z"/>
<circle cx={14.5} cy={24.5} r={1.5}/>
<path
@@ -1828,10 +1044,8 @@ export function ClusterIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M16 7a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM11 30a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM7 11a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM21 30a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM25 11a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM4 21a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 [...]
<path
@@ -1849,10 +1063,8 @@ export function RpcIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="m14 26 1.41-1.41L7.83 17H28v-2H7.83l7.58-7.59L14 6 4 16l10 10z"/>
<path
d="M0 0h32v32H0z"
@@ -1871,7 +1083,7 @@ export function InfinispanIcon() {
xmlns="http://www.w3.org/2000/svg"
id="artwork"
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<style>{".cls-2{fill:#fff}"}</style>
</defs>
@@ -1897,10 +1109,8 @@ export function TransformationIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"data-share"}</title>
<path
d="M5 25v-9.172l-3.586 3.586L0 18l6-6 6 6-1.414 1.414L7 15.828V25h12v2H7a2.002 2.002 0 0 1-2-2ZM24 22h4a2.002 2.002 0 0 1 2 2v4a2.002 2.002 0 0 1-2 2h-4a2.002 2.002 0 0 1-2-2v-4a2.002 2.002 0 0 1 2-2Zm4 6v-4h-4.002L24 28ZM27 6v9.172l3.586-3.586L32 13l-6 6-6-6 1.414-1.414L25 15.172V6H13V4h12a2.002 2.002 0 0 1 2 2ZM2 6h6v2H2zM2 2h8v2H2z"/>
@@ -1919,10 +1129,8 @@ export function TestingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M28 17v5H4V6h10V4H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v4H8v2h16v-2h-4v-4h8a2 2 0 0 0 2-2v-5ZM18 28h-4v-4h4Z"/>
<path
@@ -1942,10 +1150,8 @@ export function ApiIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"api"}</title>
<path
d="M26 22a3.86 3.86 0 0 0-2 .57l-3.09-3.1a6 6 0 0 0 0-6.94L24 9.43a3.86 3.86 0 0 0 2 .57 4 4 0 1 0-4-4 3.86 3.86 0 0 0 .57 2l-3.1 3.09a6 6 0 0 0-6.94 0L9.43 8A3.86 3.86 0 0 0 10 6a4 4 0 1 0-4 4 3.86 3.86 0 0 0 2-.57l3.09 3.1a6 6 0 0 0 0 6.94L8 22.57A3.86 3.86 0 0 0 6 22a4 4 0 1 0 4 4 3.86 3.86 0 0 0-.57-2l3.1-3.09a6 6 0 0 0 6.94 0l3.1 3.09a3.86 3.86 0 0 0-.57 2 4 4 0 1 0 4-4Zm0-18a2 2 0 1 1-2 2 2 2 0 0 1 2-2ZM4 6a2 2 0 1 1 2 2 2 2 0 0 1-2-2Zm2 22a2 2 0 1 1 2-2 2 2 0 0 1-2 [...]
@@ -1963,10 +1169,8 @@ export function MonitoringIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M28 16v6H4V6h7V4H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v4H8v2h16v-2h-4v-4h8a2 2 0 0 0 2-2v-6ZM18 28h-4v-4h4Z"/>
<path
@@ -1987,10 +1191,8 @@ export function NetworkingIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 511.984 511.984"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M207.29 287.991H48.735C30.687 287.991 16 302.375 16 320.054v111.868c0 17.679 14.688 32.063 32.735 32.063H207.29c18.031 0 32.703-14.384 32.703-32.063V320.054c0-17.679-14.672-32.063-32.703-32.063zm0 143.996-159.291-.064.736-111.932 159.259.064.048 111.645c0 .015-.192.287-.752.287z"/>
<path
@@ -2010,7 +1212,7 @@ export function HealthIcon() {
xmlSpace="preserve"
id="Icons"
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<style>
{
".st0{fill:none;stroke:#000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}"
@@ -2029,10 +1231,8 @@ export function KubernetesIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 -10.44 722.846 722.846"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#326ce5"
d="M358.986 10.06a46.725 46.342 0 0 0-17.906 4.531L96.736 131.341a46.725 46.342 0 0 0-25.28 31.438l-60.282 262.25a46.725 46.342 0 0 0 6.344 35.531 46.725 46.342 0 0 0 2.656 3.688l169.125 210.28a46.725 46.342 0 0 0 36.531 17.438l271.219-.062a46.725 46.342 0 0 0 36.531-17.406l169.063-210.313a46.725 46.342 0 0 0 9.03-39.219L651.3 162.716a46.725 46.342 0 0 0-25.281-31.437L381.643 14.59a46.725 46.342 0 0 0-22.657-4.53z"
@@ -2062,10 +1262,8 @@ export function DocumentIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"document--blank"}</title>
<path
d="m25.7 9.3-7-7A.908.908 0 0 0 18 2H8a2.006 2.006 0 0 0-2 2v24a2.006 2.006 0 0 0 2 2h16a2.006 2.006 0 0 0 2-2V10a.908.908 0 0 0-.3-.7ZM18 4.4l5.6 5.6H18ZM24 28H8V4h8v6a2.006 2.006 0 0 0 2 2h6Z"/>
@@ -2084,11 +1282,9 @@ export function GitIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
fill="none"
viewBox="0 0 24 24"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#000"
fillRule="evenodd"
@@ -2103,10 +1299,8 @@ export function SocialIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#FFB89A"
d="M570.2 842c-50.6 0-278.7-180-278.7-401.9 0-58.8-2.9-133.1-1-183.9-50.8 3.2-91.4 45.7-91.4 97.3v272.1c37.4 194.7 137.5 334 255.2 334 69.5 0 132.9-48.6 180.9-128.5-20.8 7.1-42.6 10.9-65 10.9z"
@@ -2133,7 +1327,7 @@ export function DebeziumIcon() {
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 130.93 130.93"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<linearGradient
id="linear-gradient"
@@ -2220,11 +1414,9 @@ export function IgniteIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={48}
- height={48}
fill="none"
viewBox="0 0 48 48"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#ED1C24"
d="M7.686 8.136S-8.95 18.28 6.73 28.355c3.016 1.962 13.956 7.418 13.644 12.466 0 0 6.631-9.81-3.064-15.983C7.351 18.52 4.862 11.772 7.686 8.135Z"
@@ -2239,7 +1431,7 @@ export function IgniteIcon() {
export function HazelcastIcon() {
return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.3 133.3" className="icon">
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.3 133.3" className="icon" width="32px" height="32px">
<defs>
<style>{".a{fill:#00e1e1}"}</style>
</defs>
@@ -2279,10 +1471,8 @@ export function AzureIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={150}
- height={150}
viewBox="0 0 96 96"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<linearGradient
id="a"
diff --git a/karavan-space/src/designer/icons/EipIcons.tsx b/karavan-space/src/designer/icons/EipIcons.tsx
new file mode 100644
index 00000000..6759e928
--- /dev/null
+++ b/karavan-space/src/designer/icons/EipIcons.tsx
@@ -0,0 +1,230 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 React from 'react';
+
+export function AggregateIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M496.2 417.71l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 417.71h292.4z"></path>
+ <path
+ d="M516.1 426.23v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V426.22l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM247.14 358.45l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-. [...]
+ <path
+ d="M277.46 154.15V264.2c0 5.52-4.48 10-10 10H82.69c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ <g>
+ <path d="M610.57 145.6l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
+ <path
+ d="M627.5 154.15V264.2c0 5.52-4.48 10-10 10H432.73c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ </g>
+ </svg>
+ );
+}
+
+export function ToIcon() {
+ return (
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 32 32"
+ className="icon" width="32px" height="32px"
+ >
+ <path
+ d="M24 22v-1h6v-2h-6v-6h6v-2h-6v-1a2 2 0 0 0-2-2h-6a8.007 8.007 0 0 0-7.93 7v2A8.007 8.007 0 0 0 16 24h6a2 2 0 0 0 2-2zm-8 0a6 6 0 1 1 0-12h6v12z"/>
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ );
+}
+
+export function ChoiceIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M407.33 113.97V609.2c0 2.75-1.9 5-4.22 5H291.55c-2.33 0-4.22-2.25-4.22-5V113.97c0-2.76 1.89-5 4.22-5h111.56c2.32 0 4.22 2.24 4.22 5zM27.1 437.55l60.87-57.64c.95-.9 2.32-1.41 3.76-1.41H258.2c2.76 0 5 1.87 5 4.17v111.65c0 2.3-2.24 4.17-5 4.17H91.54c-1.38 0-2.7-.48-3.65-1.32L27.2 443.15c-1.77-1.58-1.81-3.99-.1-5.61zM667.57 285.62l-60.87 57.64c-.95.9-2.32 1.41-3.76 1.41H436.47c-2.76 0-5-1.87-5-4.17V228.85c0-2.3 2.24-4.17 5-4.17h166.66c1.38 0 2.7.48 3.65 1.32l60.69 54.02c1. [...]
+ </svg>
+ );
+}
+
+
+export function SplitIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M496.2 83.65l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 83.65h292.4z"></path>
+ <path
+ d="M516.1 92.17v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V92.16l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM524.34 397.22l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-.42 [...]
+ <path
+ d="M277.36 476.26v110.05c0 5.52-4.48 10-10 10H82.59c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ <g>
+ <path d="M610.48 467.71l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
+ <path
+ d="M627.41 476.26v110.05c0 5.52-4.48 10-10 10H432.64c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ </g>
+ </svg>
+ );
+}
+
+export function SagaIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M626.41 255.77c-.56-4.77-2.95-9.03-6.71-11.99l-46.46-36.64-1.06-1.09-.8-.28c-.81-.52-1.67-.98-2.56-1.36-.43-.19-.85-.36-1.25-.5-.47-.16-.96-.31-1.51-.45-.47-.11-.96-.22-1.45-.3-.49-.08-.97-.14-1.43-.18-.96-.08-1.95-.08-2.91-.01-.41.03-.83.08-1.23.14-.41.06-.82.14-1.25.23l-.58.14c-.1.03-.2.05-.31.08-.11.03-.21.06-.3.09-.29.08-.57.18-.86.28-.49.17-.99.37-1.53.61l-.16.08c-.32.15-.65.31-.97.49-.49.26-.93.53-1.34.81-.39.26-.76.52-1.12.8l-46.96 37.05a17.823 17.823 0 00-6.72 [...]
+ </svg>
+ );
+}
+
+export function TransformIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M441.77 277.51l-82.73 64.23c-.07.05-.13.09-.19.13-5.37 3.48-12.33 3.48-17.69.01-.07-.05-.13-.09-.18-.13l-82.76-64.24h183.54z"></path>
+ <path
+ d="M462.2 287.02V420.7c0 .98-.79 1.77-1.77 1.77H239.57c-.98 0-1.77-.79-1.77-1.77V287.02l90.91 70.56c.54.44 1.06.8 1.57 1.12 5.99 3.88 12.86 5.81 19.72 5.81s13.73-1.94 19.73-5.81c.49-.32 1.01-.68 1.58-1.13l90.89-70.55zM622.28 330.68l-35.89 31.78a1.48 1.48 0 01-1.98 0l-35.89-31.78c-.3-.26-.48-.63-.51-1.03-.02-.4.11-.79.38-1.09l11.28-12.73c.55-.61 1.49-.67 2.11-.12l12.44 11.02c-5.24-51.26-28.18-99.47-64.84-136.12-35.82-35.82-81.13-58.05-131.04-64.27-.1 0-.19-.03-.28-.06v.09s [...]
+ </svg>
+ );
+}
+
+export function FilterIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M565.62 156.56L413.36 350.33a10.032 10.032 0 00-2.14 6.18v190.52c0 19.05-25.01 34.49-55.86 34.49s-55.86-15.44-55.86-34.49V356.51c0-2.24-.75-4.42-2.14-6.18L145.1 156.56c-5.15-6.56-.48-16.18 7.87-16.18h404.79c8.34 0 13.02 9.62 7.86 16.18z"></path>
+ </svg>
+ );
+}
+
+export function SortIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <defs>
+ <style>{".b{stroke-linejoin: round;}.b,.c {stroke-linecap: round;}.b,.c,.d {fill: none;stroke: #000;stroke-width: 35px;}.c,.d {stroke-miterlimit: 10;}"}</style>
+ </defs>
+ <path d="M160.63 168.63L160.63 531.37" className="d"></path>
+ <path d="M576.31 170.27L269.3 170.27" className="c"></path>
+ <path d="M517.53 290.64L269.3 290.64" className="c"></path>
+ <path d="M458.75 411L269.3 411" className="c"></path>
+ <path d="M399.97 531.37L269.3 531.37" className="c"></path>
+ <path d="M197.7 197.95L160.63 168.71 123.55 197.95" className="b"></path>
+ <path d="M123.55 502.12L160.62 531.37 197.7 502.12" className="b"></path>
+ </svg>
+ );
+}
+
+export function OnCompletion() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M22 26.59L19.41 24 18 25.41 22 29.41 30 21.41 28.59 20 22 26.59z"></path>
+ <circle cx="16" cy="16" r="2"></circle>
+ <path d="M16 22a6 6 0 116-6 6.007 6.007 0 01-6 6zm0-10a4 4 0 104 4 4.005 4.005 0 00-4-4z"></path>
+ <path d="M28 16a12 12 0 10-12 12v-2a10 10 0 1110-10z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function Intercept() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M15 4H17V28H15z"></path>
+ <path
+ d="M10 7v18H4V7h6m0-2H4a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2zM28 7v18h-6V7h6m0-2h-6a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function InterceptFrom() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M26 30H14a2 2 0 01-2-2v-3h2v3h12V4H14v3h-2V4a2 2 0 012-2h12a2 2 0 012 2v24a2 2 0 01-2 2z"></path>
+ <path d="M14.59 20.59L18.17 17 4 17 4 15 18.17 15 14.59 11.41 16 10 22 16 16 22 14.59 20.59z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function InterceptSendToEndpoint() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path
+ d="M6 30h12a2.002 2.002 0 002-2v-3h-2v3H6V4h12v3h2V4a2.002 2.002 0 00-2-2H6a2.002 2.002 0 00-2 2v24a2.002 2.002 0 002 2z"></path>
+ <path
+ d="M20.586 20.586L24.172 17 10 17 10 15 24.172 15 20.586 11.414 22 10 28 16 22 22 20.586 20.586z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
\ No newline at end of file
diff --git a/karavan-space/src/designer/icons/KaravanIcons.tsx b/karavan-space/src/designer/icons/KaravanIcons.tsx
new file mode 100644
index 00000000..b7165b93
--- /dev/null
+++ b/karavan-space/src/designer/icons/KaravanIcons.tsx
@@ -0,0 +1,521 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 React from 'react';
+
+export function KaravanIcon(className?: string) {
+ return (
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ id="svg50"
+ width={32}
+ height={32}
+ preserveAspectRatio="xMidYMid"
+ version="1.1"
+ viewBox="0 0 256 256"
+ className={className ? className : "logo"}
+ >
+ <defs id="defs31">
+ <linearGradient id="linearGradient1351">
+ <stop
+ id="stop1347"
+ offset="0"
+ stopColor="#dcffff"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop1349"
+ offset="1"
+ stopColor="#96d2e6"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <circle id="path-1" cx="128" cy="128" r="128"></circle>
+ <linearGradient
+ id="linearGradient-3"
+ x1="-26.051"
+ x2="254.316"
+ y1="271.331"
+ y2="0.048"
+ gradientUnits="userSpaceOnUse"
+ >
+ <stop
+ id="stop10"
+ offset="0%"
+ stopColor="#4790bb"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop12"
+ offset="10.996%"
+ stopColor="#64b7db"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop14"
+ offset="94.502%"
+ stopColor="#326ea0"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <linearGradient
+ id="linearGradient-4"
+ x1="-32.163"
+ x2="259.338"
+ y1="277.029"
+ y2="-5.028"
+ gradientUnits="userSpaceOnUse"
+ >
+ <stop id="stop17" offset="0%" stopColor="#F69923"></stop>
+ <stop id="stop19" offset="8.048%" stopColor="#F79A23"></stop>
+ <stop id="stop21" offset="41.874%" stopColor="#E97826"></stop>
+ </linearGradient>
+ <linearGradient
+ id="linearGradient-5"
+ x1="217.945"
+ x2="99.459"
+ y1="67.505"
+ y2="247.005"
+ gradientTransform="scale(.96442 1.0369)"
+ gradientUnits="userSpaceOnUse"
+ xlinkHref="#linearGradient-4"
+ >
+ <stop
+ id="stop24"
+ offset="0%"
+ stopColor="#92d6d5"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop26"
+ offset="41.191%"
+ stopColor="#79b7cc"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop28"
+ offset="73.271%"
+ stopColor="#5891c5"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <mask id="mask-2" fill="#fff">
+ <use id="use33" xlinkHref="#path-1"></use>
+ </mask>
+ <mask id="mask-2-7" fill="#fff">
+ <use id="use137" xlinkHref="#path-1"></use>
+ </mask>
+ <linearGradient
+ id="linearGradient1345"
+ x1="233.122"
+ x2="2.24"
+ y1="56.015"
+ y2="242.78"
+ gradientUnits="userSpaceOnUse"
+ xlinkHref="#linearGradient1351"
+ ></linearGradient>
+ </defs>
+ <circle
+ id="circle38"
+ cx="127.994"
+ cy="127.994"
+ r="123.111"
+ fill="url(#linearGradient-3)"
+ fillRule="nonzero"
+ mask="url(#mask-2)"
+ ></circle>
+ <g id="g2266">
+ <path
+ id="path42"
+ fill="url(#linearGradient-5)"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412z"
+ mask="url(#mask-2)"
+ opacity="0.75"
+ ></path>
+ </g>
+ <path
+ id="path44"
+ fill="#1e4b7b"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513z"
+ mask="url(#mask-2)"
+ opacity="0.75"
+ ></path>
+ <path
+ id="path150"
+ fill="url(#linearGradient1345)"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488z"
+ mask="url(#mask-2-7)"
+ transform="translate(-.769 -.133)"
+ ></path>
+ <path
+ id="path40"
+ fill="#2d4150"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232z"
+ mask="url(#mask-2)"
+ transform="translate(-.59) scale(1.00078)"
+ ></path>
+ </svg>
+ );
+}
+
+export function CamelIcon(props?: (JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>) | undefined) {
+ return (<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ preserveAspectRatio="xMidYMid"
+ viewBox="0 0 256 256"
+ {...props}
+ className="icon" width="32px" height="32px">
+ <defs>
+ <linearGradient
+ id="b"
+ x1="-12.564%"
+ x2="101.304%"
+ y1="108.214%"
+ y2="-1.964%"
+ >
+ <stop offset="0%" stopColor="#F69923"/>
+ <stop offset="10.996%" stopColor="#F79A23"/>
+ <stop offset="94.502%" stopColor="#E97826"/>
+ </linearGradient>
+ <linearGradient
+ id="d"
+ x1="-12.564%"
+ x2="101.304%"
+ y1="108.214%"
+ y2="-1.964%"
+ >
+ <stop offset="0%" stopColor="#F69923"/>
+ <stop offset="8.048%" stopColor="#F79A23"/>
+ <stop offset="41.874%" stopColor="#E97826"/>
+ </linearGradient>
+ <linearGradient
+ id="e"
+ x1="74.724%"
+ x2="6.653%"
+ y1="-3.059%"
+ y2="100.066%"
+ >
+ <stop offset="0%" stopColor="#F6E423"/>
+ <stop offset="41.191%" stopColor="#F79A23"/>
+ <stop offset="73.271%" stopColor="#E97826"/>
+ </linearGradient>
+ <circle id="a" cx={128} cy={128} r={128}/>
+ </defs>
+ <mask id="c" fill="#fff">
+ <use xlinkHref="#a"/>
+ </mask>
+ <circle
+ cx={127.994}
+ cy={127.994}
+ r={123.111}
+ fill="url(#b)"
+ mask="url(#c)"
+ />
+ <path
+ fill="url(#d)"
+ d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128Zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232Z"
+ mask="url(#c)"
+ />
+ <path
+ fill="url(#e)"
+ d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412Z"
+ mask="url(#c)"
+ opacity={0.75}
+ />
+ <path
+ fill="#28170B"
+ d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513Z"
+ mask="url(#c)"
+ opacity={0.75}
+ />
+ <path
+ fill="#FFF"
+ d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488Z"
+ mask="url(#c)"
+ />
+ </svg>
+ );
+}
+
+export function getDesignerIcon(icon: string) {
+ if (icon === 'kamelet') return (
+ <svg
+ className="top-icon" id="icon"
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 32 32"
+ >
+ <title>{"application"}</title>
+ <path d="M16 18H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2ZM6 6v10h10V6ZM26 12v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM26 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM16 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2Z" />
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ )
+ if (icon === 'code') return (
+ <svg
+
+ xmlns="http://www.w3.org/2000/svg"
+ width="24"
+ height="24"
+ fill="none"
+ viewBox="0 0 24 24"
+ >
+ <path
+ fill="#000000"
+ d="M8.502 5.387a.75.75 0 00-1.004-1.115L5.761 5.836c-.737.663-1.347 1.212-1.767 1.71-.44.525-.754 1.088-.754 1.784 0 .695.313 1.258.754 1.782.42.499 1.03 1.049 1.767 1.711l1.737 1.564a.75.75 0 101.004-1.115l-1.697-1.527c-.788-.709-1.319-1.19-1.663-1.598-.33-.393-.402-.622-.402-.817 0-.196.072-.425.402-.818.344-.409.875-.889 1.663-1.598l1.697-1.527zM14.18 4.275a.75.75 0 01.532.918l-3.987 15a.75.75 0 11-1.45-.386l3.987-15a.75.75 0 01.918-.532zM15.443 10.498a.75.75 0 011.059 [...]
+ ></path>
+ </svg>
+ )
+ if (icon === 'routes') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <path
+ d="M29,10H24v2h5v6H22v2h3v2.142a4,4,0,1,0,2,0V20h2a2.0027,2.0027,0,0,0,2-2V12A2.0023,2.0023,0,0,0,29,10ZM28,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,28,26Z"/>
+ <path
+ d="M19,6H14V8h5v6H12v2h3v6.142a4,4,0,1,0,2,0V16h2a2.0023,2.0023,0,0,0,2-2V8A2.0023,2.0023,0,0,0,19,6ZM18,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,18,26Z"/>
+ <path
+ d="M9,2H3A2.002,2.002,0,0,0,1,4v6a2.002,2.002,0,0,0,2,2H5V22.142a4,4,0,1,0,2,0V12H9a2.002,2.002,0,0,0,2-2V4A2.002,2.002,0,0,0,9,2ZM8,26a2,2,0,1,1-2-2A2.0023,2.0023,0,0,1,8,26ZM3,10V4H9l.0015,6Z"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32"/>
+ </svg>)
+ if (icon === 'route') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <title>{"category"}</title>
+ <path d="M27 22.141V18a2 2 0 0 0-2-2h-8v-4h2a2.002 2.002 0 0 0 2-2V4a2.002 2.002 0 0 0-2-2h-6a2.002 2.002 0 0 0-2 2v6a2.002 2.002 0 0 0 2 2h2v4H7a2 2 0 0 0-2 2v4.142a4 4 0 1 0 2 0V18h8v4.142a4 4 0 1 0 2 0V18h8v4.141a4 4 0 1 0 2 0ZM13 4h6l.001 6H13ZM8 26a2 2 0 1 1-2-2 2.002 2.002 0 0 1 2 2Zm10 0a2 2 0 1 1-2-2 2.003 2.003 0 0 1 2 2Zm8 2a2 2 0 1 1 2-2 2.002 2.002 0 0 1-2 2Z" />
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ )
+ if (icon === 'rest') return (
+ <svg className="top-icon" viewBox="0 0 32 32" width="32px" height="32px">
+ <g className="layer">
+ <title>Layer 1</title>
+ <path
+ d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
+ id="svg_1"/>
+ <path
+ d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1.414 [...]
+ id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'beans') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>data--1</title>
+ <rect x="15" y="6" width="13" height="2"/>
+ <rect x="15" y="24" width="13" height="2"/>
+ <rect x="4" y="15" width="13" height="2"/>
+ <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z" transform="translate(0 0)"/>
+ <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z" transform="translate(0 0)"/>
+ <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'dependencies') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>application</title>
+ <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
+ transform="translate(0 0)"/>
+ <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'error') return (
+ <svg className="top-icon" width="36px" height="36px" viewBox="0 0 36 36" version="1.1"
+ preserveAspectRatio="xMidYMid meet">
+ <circle className="clr-i-outline clr-i-outline-path-1" cx="18" cy="26.06" r="1.33"/>
+ <path className="clr-i-outline clr-i-outline-path-2"
+ d="M18,22.61a1,1,0,0,1-1-1v-12a1,1,0,1,1,2,0v12A1,1,0,0,1,18,22.61Z"/>
+ <path className="clr-i-outline clr-i-outline-path-3"
+ d="M18,34A16,16,0,1,1,34,18,16,16,0,0,1,18,34ZM18,4A14,14,0,1,0,32,18,14,14,0,0,0,18,4Z"/>
+ <rect x="0" y="0" width="36" height="36" fillOpacity="0"/>
+ </svg>)
+ if (icon === 'exception') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <title>misuse--alt</title>
+ <polygon
+ points="21.41 23 16 17.591 10.59 23 9 21.41 14.409 16 9 10.591 10.591 9 16 14.409 21.409 9 23 10.591 17.591 16 23 21.41 21.41 23"/>
+ <path d="M16,4A12,12,0,1,1,4,16,12.0136,12.0136,0,0,1,16,4m0-2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Z"
+ transform="translate(0)"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32"/>
+ </svg>)
+ if (icon === 'routeConfiguration') return (
+ <svg className="top-icon" width="32" height="32" viewBox="0 0 32 32">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <path
+ d="M28.83 21.17L25 17.37l.67-.67a1 1 0 000-1.41l-6-6a1 1 0 00-1.41 0l-.79.79-6.76-6.79a1 1 0 00-1.41 0l-4 4-.12.15-4 6a1 1 0 00.12 1.26l3 3a1 1 0 001.42 0L10 13.41l2.09 2.09-4.8 4.79a1 1 0 000 1.41l2 2a1 1 0 00.71.3 1 1 0 00.52-.15l4.33-2.6 2.44 2.45a1 1 0 001.41 0l.67-.7 3.79 3.83a4 4 0 005.66-5.66zM10 10.58l-5 5-1.71-1.71 3.49-5.24L10 5.41l6.09 6.09-2.59 2.58zm8 11l-2.84-2.84-5 3-.74-.74L19 11.41 23.59 16zm9.42 3.83a2 2 0 01-2.83 0l-3.8-3.79 2.83-2.83 3.8 3.79a2 2 0 010 [...]
+ <path
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>)
+ if (icon === 'yaml') return (
+ <svg className="top-icon" x="0px" y="0px" width="32px" height="32px"
+ viewBox="0 0 32 32">
+ <style type="text/css">{".st0{fill:none;}"}</style>
+ <title>document</title>
+ <path
+ d="M25.7,9.3l-7-7C18.5,2.1,18.3,2,18,2H8C6.9,2,6,2.9,6,4v24c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V10C26,9.7,25.9,9.5,25.7,9.3 z M18,4.4l5.6,5.6H18V4.4z M24,28H8V4h8v6c0,1.1,0.9,2,2,2h6V28z"/>
+ <rect x="10" y="22" width="12" height="2"/>
+ <rect x="10" y="16" width="12" height="2"/>
+ <rect className="st0" width="32" height="32"/>
+ </svg>)
+ if (icon === 'code') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <title>code</title>
+ <polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/>
+ <polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/>
+ <rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32" transform="translate(0 32) rotate(-90)"/>
+ </svg>)
+}
+
+
+export class BeanIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>data--1</title>
+ <rect x="15" y="6" width="13" height="2"/>
+ <rect x="15" y="24" width="13" height="2"/>
+ <rect x="4" y="15" width="13" height="2"/>
+ <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z"
+ transform="translate(0 0)"/>
+ <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z"
+ transform="translate(0 0)"/>
+ <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class DependencyIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>application</title>
+ <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
+ transform="translate(0 0)"/>
+ <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class RestIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
+ <g className="layer">
+ <title>Layer 1</title>
+ <path
+ d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
+ id="svg_1"/>
+ <path
+ d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1 [...]
+ id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class ConceptIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>concept</title>
+ <path
+ d="M20.8851,19.4711a5.9609,5.9609,0,0,0,0-6.9422L23,10.4141l1.293,1.2929a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414l-4-4a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414L21.5859,9l-2.1148,2.1149a5.9609,5.9609,0,0,0-6.9422,0L10,8.5859V2H2v8H8.5859l2.529,2.5289a5.9609,5.9609,0,0,0,0,6.9422L9,21.5859,7.707,20.293a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414l4,4a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414L10.4141,23l2.1148-2.1149a5.960 [...]
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1"
+ width="32" height="32"/>
+ </svg>
+ )
+ }
+}
\ No newline at end of file
diff --git a/karavan-space/src/designer/utils/CamelUi.tsx b/karavan-space/src/designer/utils/CamelUi.tsx
index ac791920..86dc6c58 100644
--- a/karavan-space/src/designer/utils/CamelUi.tsx
+++ b/karavan-space/src/designer/utils/CamelUi.tsx
@@ -29,22 +29,18 @@ import {
} from "karavan-core/lib/model/CamelDefinition";
import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefinition";
import {
- ActivemqIcon,
- AggregateIcon,
- ApiIcon,
+ ActivemqIcon, ApiIcon,
AwsIcon,
AzureIcon,
BlockchainIcon,
CassandraIcon,
ChatIcon,
- ChoiceIcon,
CloudIcon,
ClusterIcon,
DatabaseIcon,
DebeziumIcon,
DocumentIcon,
FileIcon,
- FilterIcon,
GithubIcon,
GitIcon,
GoogleCloudIcon,
@@ -54,9 +50,6 @@ import {
HttpIcon,
IgniteIcon,
InfinispanIcon,
- Intercept,
- InterceptFrom,
- InterceptSendToEndpoint,
IotIcon,
KafkaIcon,
KubernetesIcon,
@@ -66,29 +59,37 @@ import {
MobileIcon,
MonitoringIcon,
NetworkingIcon,
- OnCompletion,
OpenshiftIcon,
OpenstackIcon,
RedisIcon,
RefIcon,
RpcIcon,
- SagaIcon,
SapIcon,
SchedulingIcon,
ScriptIcon,
SearchIcon,
SocialIcon,
- SortIcon,
- SplitIcon,
SpringIcon,
TerminalIcon,
TestingIcon,
- ToIcon,
TransformationIcon,
ValidationIcon,
WebserviceIcon,
WorkflowIcon
-} from "./KaravanIcons";
+} from "../icons/ComponentIcons";
+import {
+ AggregateIcon,
+ ChoiceIcon,
+ FilterIcon,
+ Intercept,
+ InterceptFrom,
+ InterceptSendToEndpoint,
+ OnCompletion,
+ SagaIcon,
+ SortIcon,
+ SplitIcon,
+ ToIcon,
+} from "../icons/EipIcons";
import React from "react";
import {TopologyUtils} from "karavan-core/lib/api/TopologyUtils";
import {CamelDisplayUtil} from "karavan-core/lib/api/CamelDisplayUtil";
diff --git a/karavan-space/src/topology/CustomNode.tsx b/karavan-space/src/topology/CustomNode.tsx
index 2d87457d..fb517ae9 100644
--- a/karavan-space/src/topology/CustomNode.tsx
+++ b/karavan-space/src/topology/CustomNode.tsx
@@ -19,7 +19,7 @@ import * as React from 'react';
import {RegionsIcon} from '@patternfly/react-icons';
import {DefaultNode, observer} from '@patternfly/react-topology';
-import {getDesignerIcon} from "../designer/utils/KaravanIcons";
+import {getDesignerIcon} from "../designer/icons/KaravanIcons";
import {CamelUi} from "../designer/utils/CamelUi";
import './topology.css';
diff --git a/karavan-space/src/topology/TopologyTab.tsx b/karavan-space/src/topology/TopologyTab.tsx
index 520bf8d2..306ca8fb 100644
--- a/karavan-space/src/topology/TopologyTab.tsx
+++ b/karavan-space/src/topology/TopologyTab.tsx
@@ -68,6 +68,7 @@ export function TopologyTab (props: Props) {
}
const controller = React.useMemo(() => {
+ console.log(props.files)
const model = getModel(props.files);
const newController = new Visualization();
newController.registerLayoutFactory((_, graph) => new DagreLayout(graph));
diff --git a/karavan-vscode/webview/topology/CustomNode.tsx b/karavan-vscode/webview/topology/CustomNode.tsx
index 2d87457d..fb517ae9 100644
--- a/karavan-vscode/webview/topology/CustomNode.tsx
+++ b/karavan-vscode/webview/topology/CustomNode.tsx
@@ -19,7 +19,7 @@ import * as React from 'react';
import {RegionsIcon} from '@patternfly/react-icons';
import {DefaultNode, observer} from '@patternfly/react-topology';
-import {getDesignerIcon} from "../designer/utils/KaravanIcons";
+import {getDesignerIcon} from "../designer/icons/KaravanIcons";
import {CamelUi} from "../designer/utils/CamelUi";
import './topology.css';
diff --git a/karavan-vscode/webview/topology/TopologyTab.tsx b/karavan-vscode/webview/topology/TopologyTab.tsx
index 520bf8d2..306ca8fb 100644
--- a/karavan-vscode/webview/topology/TopologyTab.tsx
+++ b/karavan-vscode/webview/topology/TopologyTab.tsx
@@ -68,6 +68,7 @@ export function TopologyTab (props: Props) {
}
const controller = React.useMemo(() => {
+ console.log(props.files)
const model = getModel(props.files);
const newController = new Visualization();
newController.registerLayoutFactory((_, graph) => new DagreLayout(graph));
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/KaravanDesigner.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/KaravanDesigner.tsx
index 766b4e1f..4b7b3c7a 100644
--- a/karavan-web/karavan-app/src/main/webui/src/designer/KaravanDesigner.tsx
+++ b/karavan-web/karavan-app/src/main/webui/src/designer/KaravanDesigner.tsx
@@ -35,7 +35,7 @@ import {CamelUtil} from "karavan-core/lib/api/CamelUtil";
import {CamelUi} from "./utils/CamelUi";
import {useDesignerStore, useIntegrationStore} from "./DesignerStore";
import {shallow} from "zustand/shallow";
-import {getDesignerIcon} from "./utils/KaravanIcons";
+import {getDesignerIcon} from "./icons/KaravanIcons";
import {InfrastructureAPI} from "./utils/InfrastructureAPI";
import {EventBus, IntegrationUpdate} from "./utils/EventBus";
import {RestDesigner} from "./rest/RestDesigner";
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanIcons.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/icons/ComponentIcons.tsx
similarity index 74%
rename from karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanIcons.tsx
rename to karavan-web/karavan-app/src/main/webui/src/designer/icons/ComponentIcons.tsx
index 906ba86e..a05f5e70 100644
--- a/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanIcons.tsx
+++ b/karavan-web/karavan-app/src/main/webui/src/designer/icons/ComponentIcons.tsx
@@ -16,736 +16,12 @@
*/
import React from 'react';
-export function KaravanIcon(className?: string) {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- xmlnsXlink="http://www.w3.org/1999/xlink"
- id="svg50"
- width="256"
- height="256"
- preserveAspectRatio="xMidYMid"
- version="1.1"
- viewBox="0 0 256 256"
- className={className ? className : "logo"}
- >
- <defs id="defs31">
- <linearGradient id="linearGradient1351">
- <stop
- id="stop1347"
- offset="0"
- stopColor="#dcffff"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop1349"
- offset="1"
- stopColor="#96d2e6"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <circle id="path-1" cx="128" cy="128" r="128"></circle>
- <linearGradient
- id="linearGradient-3"
- x1="-26.051"
- x2="254.316"
- y1="271.331"
- y2="0.048"
- gradientUnits="userSpaceOnUse"
- >
- <stop
- id="stop10"
- offset="0%"
- stopColor="#4790bb"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop12"
- offset="10.996%"
- stopColor="#64b7db"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop14"
- offset="94.502%"
- stopColor="#326ea0"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <linearGradient
- id="linearGradient-4"
- x1="-32.163"
- x2="259.338"
- y1="277.029"
- y2="-5.028"
- gradientUnits="userSpaceOnUse"
- >
- <stop id="stop17" offset="0%" stopColor="#F69923"></stop>
- <stop id="stop19" offset="8.048%" stopColor="#F79A23"></stop>
- <stop id="stop21" offset="41.874%" stopColor="#E97826"></stop>
- </linearGradient>
- <linearGradient
- id="linearGradient-5"
- x1="217.945"
- x2="99.459"
- y1="67.505"
- y2="247.005"
- gradientTransform="scale(.96442 1.0369)"
- gradientUnits="userSpaceOnUse"
- xlinkHref="#linearGradient-4"
- >
- <stop
- id="stop24"
- offset="0%"
- stopColor="#92d6d5"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop26"
- offset="41.191%"
- stopColor="#79b7cc"
- stopOpacity="1"
- ></stop>
- <stop
- id="stop28"
- offset="73.271%"
- stopColor="#5891c5"
- stopOpacity="1"
- ></stop>
- </linearGradient>
- <mask id="mask-2" fill="#fff">
- <use id="use33" xlinkHref="#path-1"></use>
- </mask>
- <mask id="mask-2-7" fill="#fff">
- <use id="use137" xlinkHref="#path-1"></use>
- </mask>
- <linearGradient
- id="linearGradient1345"
- x1="233.122"
- x2="2.24"
- y1="56.015"
- y2="242.78"
- gradientUnits="userSpaceOnUse"
- xlinkHref="#linearGradient1351"
- ></linearGradient>
- </defs>
- <circle
- id="circle38"
- cx="127.994"
- cy="127.994"
- r="123.111"
- fill="url(#linearGradient-3)"
- fillRule="nonzero"
- mask="url(#mask-2)"
- ></circle>
- <g id="g2266">
- <path
- id="path42"
- fill="url(#linearGradient-5)"
- fillOpacity="1"
- fillRule="nonzero"
- d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412z"
- mask="url(#mask-2)"
- opacity="0.75"
- ></path>
- </g>
- <path
- id="path44"
- fill="#1e4b7b"
- fillOpacity="1"
- fillRule="nonzero"
- d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513z"
- mask="url(#mask-2)"
- opacity="0.75"
- ></path>
- <path
- id="path150"
- fill="url(#linearGradient1345)"
- fillOpacity="1"
- fillRule="nonzero"
- d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488z"
- mask="url(#mask-2-7)"
- transform="translate(-.769 -.133)"
- ></path>
- <path
- id="path40"
- fill="#2d4150"
- fillOpacity="1"
- fillRule="nonzero"
- d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232z"
- mask="url(#mask-2)"
- transform="translate(-.59) scale(1.00078)"
- ></path>
- </svg>
- );
-}
-
-export function CamelIcon(props?: (JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>) | undefined) {
- return (<svg
- xmlns="http://www.w3.org/2000/svg"
- xmlnsXlink="http://www.w3.org/1999/xlink"
- width={24}
- height={24}
- preserveAspectRatio="xMidYMid"
- viewBox="0 0 256 256"
- {...props}
- className="icon">
- <defs>
- <linearGradient
- id="b"
- x1="-12.564%"
- x2="101.304%"
- y1="108.214%"
- y2="-1.964%"
- >
- <stop offset="0%" stopColor="#F69923"/>
- <stop offset="10.996%" stopColor="#F79A23"/>
- <stop offset="94.502%" stopColor="#E97826"/>
- </linearGradient>
- <linearGradient
- id="d"
- x1="-12.564%"
- x2="101.304%"
- y1="108.214%"
- y2="-1.964%"
- >
- <stop offset="0%" stopColor="#F69923"/>
- <stop offset="8.048%" stopColor="#F79A23"/>
- <stop offset="41.874%" stopColor="#E97826"/>
- </linearGradient>
- <linearGradient
- id="e"
- x1="74.724%"
- x2="6.653%"
- y1="-3.059%"
- y2="100.066%"
- >
- <stop offset="0%" stopColor="#F6E423"/>
- <stop offset="41.191%" stopColor="#F79A23"/>
- <stop offset="73.271%" stopColor="#E97826"/>
- </linearGradient>
- <circle id="a" cx={128} cy={128} r={128}/>
- </defs>
- <mask id="c" fill="#fff">
- <use xlinkHref="#a"/>
- </mask>
- <circle
- cx={127.994}
- cy={127.994}
- r={123.111}
- fill="url(#b)"
- mask="url(#c)"
- />
- <path
- fill="url(#d)"
- d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128Zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232Z"
- mask="url(#c)"
- />
- <path
- fill="url(#e)"
- d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412Z"
- mask="url(#c)"
- opacity={0.75}
- />
- <path
- fill="#28170B"
- d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513Z"
- mask="url(#c)"
- opacity={0.75}
- />
- <path
- fill="#FFF"
- d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488Z"
- mask="url(#c)"
- />
- </svg>
- );
-}
-
-export function getDesignerIcon(icon: string) {
- if (icon === 'kamelet') return (
- <svg
- className="top-icon" id="icon"
- xmlns="http://www.w3.org/2000/svg"
- viewBox="0 0 32 32"
- >
- <title>{"application"}</title>
- <path d="M16 18H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2ZM6 6v10h10V6ZM26 12v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM26 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM16 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2Z" />
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- )
- if (icon === 'code') return (
- <svg
-
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- fill="none"
- viewBox="0 0 24 24"
- >
- <path
- fill="#000000"
- d="M8.502 5.387a.75.75 0 00-1.004-1.115L5.761 5.836c-.737.663-1.347 1.212-1.767 1.71-.44.525-.754 1.088-.754 1.784 0 .695.313 1.258.754 1.782.42.499 1.03 1.049 1.767 1.711l1.737 1.564a.75.75 0 101.004-1.115l-1.697-1.527c-.788-.709-1.319-1.19-1.663-1.598-.33-.393-.402-.622-.402-.817 0-.196.072-.425.402-.818.344-.409.875-.889 1.663-1.598l1.697-1.527zM14.18 4.275a.75.75 0 01.532.918l-3.987 15a.75.75 0 11-1.45-.386l3.987-15a.75.75 0 01.918-.532zM15.443 10.498a.75.75 0 011.059 [...]
- ></path>
- </svg>
- )
- if (icon === 'routes') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <path
- d="M29,10H24v2h5v6H22v2h3v2.142a4,4,0,1,0,2,0V20h2a2.0027,2.0027,0,0,0,2-2V12A2.0023,2.0023,0,0,0,29,10ZM28,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,28,26Z"/>
- <path
- d="M19,6H14V8h5v6H12v2h3v6.142a4,4,0,1,0,2,0V16h2a2.0023,2.0023,0,0,0,2-2V8A2.0023,2.0023,0,0,0,19,6ZM18,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,18,26Z"/>
- <path
- d="M9,2H3A2.002,2.002,0,0,0,1,4v6a2.002,2.002,0,0,0,2,2H5V22.142a4,4,0,1,0,2,0V12H9a2.002,2.002,0,0,0,2-2V4A2.002,2.002,0,0,0,9,2ZM8,26a2,2,0,1,1-2-2A2.0023,2.0023,0,0,1,8,26ZM3,10V4H9l.0015,6Z"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32"/>
- </svg>)
- if (icon === 'route') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <title>{"category"}</title>
- <path d="M27 22.141V18a2 2 0 0 0-2-2h-8v-4h2a2.002 2.002 0 0 0 2-2V4a2.002 2.002 0 0 0-2-2h-6a2.002 2.002 0 0 0-2 2v6a2.002 2.002 0 0 0 2 2h2v4H7a2 2 0 0 0-2 2v4.142a4 4 0 1 0 2 0V18h8v4.142a4 4 0 1 0 2 0V18h8v4.141a4 4 0 1 0 2 0ZM13 4h6l.001 6H13ZM8 26a2 2 0 1 1-2-2 2.002 2.002 0 0 1 2 2Zm10 0a2 2 0 1 1-2-2 2.003 2.003 0 0 1 2 2Zm8 2a2 2 0 1 1 2-2 2.002 2.002 0 0 1-2 2Z" />
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- )
- if (icon === 'rest') return (
- <svg className="top-icon" viewBox="0 0 32 32" width="32px" height="32px">
- <g className="layer">
- <title>Layer 1</title>
- <path
- d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
- id="svg_1"/>
- <path
- d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1.414 [...]
- id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
- </g>
- </svg>
- )
- if (icon === 'beans') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>data--1</title>
- <rect x="15" y="6" width="13" height="2"/>
- <rect x="15" y="24" width="13" height="2"/>
- <rect x="4" y="15" width="13" height="2"/>
- <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z" transform="translate(0 0)"/>
- <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z" transform="translate(0 0)"/>
- <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- if (icon === 'dependencies') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>application</title>
- <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
- transform="translate(0 0)"/>
- <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- if (icon === 'error') return (
- <svg className="top-icon" width="36px" height="36px" viewBox="0 0 36 36" version="1.1"
- preserveAspectRatio="xMidYMid meet">
- <circle className="clr-i-outline clr-i-outline-path-1" cx="18" cy="26.06" r="1.33"/>
- <path className="clr-i-outline clr-i-outline-path-2"
- d="M18,22.61a1,1,0,0,1-1-1v-12a1,1,0,1,1,2,0v12A1,1,0,0,1,18,22.61Z"/>
- <path className="clr-i-outline clr-i-outline-path-3"
- d="M18,34A16,16,0,1,1,34,18,16,16,0,0,1,18,34ZM18,4A14,14,0,1,0,32,18,14,14,0,0,0,18,4Z"/>
- <rect x="0" y="0" width="36" height="36" fillOpacity="0"/>
- </svg>)
- if (icon === 'exception') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <title>misuse--alt</title>
- <polygon
- points="21.41 23 16 17.591 10.59 23 9 21.41 14.409 16 9 10.591 10.591 9 16 14.409 21.409 9 23 10.591 17.591 16 23 21.41 21.41 23"/>
- <path d="M16,4A12,12,0,1,1,4,16,12.0136,12.0136,0,0,1,16,4m0-2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Z"
- transform="translate(0)"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32"/>
- </svg>)
- if (icon === 'routeConfiguration') return (
- <svg className="top-icon" width="32" height="32" viewBox="0 0 32 32">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <path
- d="M28.83 21.17L25 17.37l.67-.67a1 1 0 000-1.41l-6-6a1 1 0 00-1.41 0l-.79.79-6.76-6.79a1 1 0 00-1.41 0l-4 4-.12.15-4 6a1 1 0 00.12 1.26l3 3a1 1 0 001.42 0L10 13.41l2.09 2.09-4.8 4.79a1 1 0 000 1.41l2 2a1 1 0 00.71.3 1 1 0 00.52-.15l4.33-2.6 2.44 2.45a1 1 0 001.41 0l.67-.7 3.79 3.83a4 4 0 005.66-5.66zM10 10.58l-5 5-1.71-1.71 3.49-5.24L10 5.41l6.09 6.09-2.59 2.58zm8 11l-2.84-2.84-5 3-.74-.74L19 11.41 23.59 16zm9.42 3.83a2 2 0 01-2.83 0l-3.8-3.79 2.83-2.83 3.8 3.79a2 2 0 010 [...]
- <path
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>)
- if (icon === 'yaml') return (
- <svg className="top-icon" x="0px" y="0px" width="32px" height="32px"
- viewBox="0 0 32 32">
- <style type="text/css">{".st0{fill:none;}"}</style>
- <title>document</title>
- <path
- d="M25.7,9.3l-7-7C18.5,2.1,18.3,2,18,2H8C6.9,2,6,2.9,6,4v24c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V10C26,9.7,25.9,9.5,25.7,9.3 z M18,4.4l5.6,5.6H18V4.4z M24,28H8V4h8v6c0,1.1,0.9,2,2,2h6V28z"/>
- <rect x="10" y="22" width="12" height="2"/>
- <rect x="10" y="16" width="12" height="2"/>
- <rect className="st0" width="32" height="32"/>
- </svg>)
- if (icon === 'code') return (
- <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1{fill:none;}"}</style>
- </defs>
- <title>code</title>
- <polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/>
- <polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/>
- <rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/>
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
- height="32" transform="translate(0 32) rotate(-90)"/>
- </svg>)
-}
-
-
-export class BeanIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>data--1</title>
- <rect x="15" y="6" width="13" height="2"/>
- <rect x="15" y="24" width="13" height="2"/>
- <rect x="4" y="15" width="13" height="2"/>
- <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z"
- transform="translate(0 0)"/>
- <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z"
- transform="translate(0 0)"/>
- <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- }
-}
-
-export class DependencyIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>application</title>
- <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
- transform="translate(0 0)"/>
- <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
- transform="translate(0 0)"/>
- <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
- <rect className="cls-1" width="32" height="32"/>
- </g>
- </svg>
- )
- }
-}
-
-export class RestIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" viewBox="0 0 32 32">
- <g className="layer">
- <title>Layer 1</title>
- <path
- d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
- id="svg_1"/>
- <path
- d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1 [...]
- id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
- </g>
- </svg>
- )
- }
-}
-
-export class ConceptIcon extends React.Component<any> {
-
- render() {
- return (
- <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
- <defs>
- <style>{".cls-1 {fill: none;}"}</style>
- </defs>
- <title>concept</title>
- <path
- d="M20.8851,19.4711a5.9609,5.9609,0,0,0,0-6.9422L23,10.4141l1.293,1.2929a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414l-4-4a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414L21.5859,9l-2.1148,2.1149a5.9609,5.9609,0,0,0-6.9422,0L10,8.5859V2H2v8H8.5859l2.529,2.5289a5.9609,5.9609,0,0,0,0,6.9422L9,21.5859,7.707,20.293a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414l4,4a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414L10.4141,23l2.1148-2.1149a5.960 [...]
- <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1"
- width="32" height="32"/>
- </svg>
- )
- }
-}
-
-export function AggregateIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M496.2 417.71l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 417.71h292.4z"></path>
- <path
- d="M516.1 426.23v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V426.22l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM247.14 358.45l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-. [...]
- <path
- d="M277.46 154.15V264.2c0 5.52-4.48 10-10 10H82.69c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- <g>
- <path d="M610.57 145.6l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
- <path
- d="M627.5 154.15V264.2c0 5.52-4.48 10-10 10H432.73c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- </g>
- </svg>
- );
-}
-
-export function ToIcon() {
- return (
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
- viewBox="0 0 32 32"
- className="icon"
- >
- <path
- d="M24 22v-1h6v-2h-6v-6h6v-2h-6v-1a2 2 0 0 0-2-2h-6a8.007 8.007 0 0 0-7.93 7v2A8.007 8.007 0 0 0 16 24h6a2 2 0 0 0 2-2zm-8 0a6 6 0 1 1 0-12h6v12z"/>
- <path
- d="M0 0h32v32H0z"
- data-name="<Transparent Rectangle>"
- style={{
- fill: "none",
- }}
- />
- </svg>
- );
-}
-
-export function ChoiceIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M407.33 113.97V609.2c0 2.75-1.9 5-4.22 5H291.55c-2.33 0-4.22-2.25-4.22-5V113.97c0-2.76 1.89-5 4.22-5h111.56c2.32 0 4.22 2.24 4.22 5zM27.1 437.55l60.87-57.64c.95-.9 2.32-1.41 3.76-1.41H258.2c2.76 0 5 1.87 5 4.17v111.65c0 2.3-2.24 4.17-5 4.17H91.54c-1.38 0-2.7-.48-3.65-1.32L27.2 443.15c-1.77-1.58-1.81-3.99-.1-5.61zM667.57 285.62l-60.87 57.64c-.95.9-2.32 1.41-3.76 1.41H436.47c-2.76 0-5-1.87-5-4.17V228.85c0-2.3 2.24-4.17 5-4.17h166.66c1.38 0 2.7.48 3.65 1.32l60.69 54.02c1. [...]
- </svg>
- );
-}
-
-
-export function SplitIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M496.2 83.65l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 83.65h292.4z"></path>
- <path
- d="M516.1 92.17v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V92.16l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM524.34 397.22l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-.42 [...]
- <path
- d="M277.36 476.26v110.05c0 5.52-4.48 10-10 10H82.59c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- <g>
- <path d="M610.48 467.71l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
- <path
- d="M627.41 476.26v110.05c0 5.52-4.48 10-10 10H432.64c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
- </g>
- </svg>
- );
-}
-
-export function SagaIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M626.41 255.77c-.56-4.77-2.95-9.03-6.71-11.99l-46.46-36.64-1.06-1.09-.8-.28c-.81-.52-1.67-.98-2.56-1.36-.43-.19-.85-.36-1.25-.5-.47-.16-.96-.31-1.51-.45-.47-.11-.96-.22-1.45-.3-.49-.08-.97-.14-1.43-.18-.96-.08-1.95-.08-2.91-.01-.41.03-.83.08-1.23.14-.41.06-.82.14-1.25.23l-.58.14c-.1.03-.2.05-.31.08-.11.03-.21.06-.3.09-.29.08-.57.18-.86.28-.49.17-.99.37-1.53.61l-.16.08c-.32.15-.65.31-.97.49-.49.26-.93.53-1.34.81-.39.26-.76.52-1.12.8l-46.96 37.05a17.823 17.823 0 00-6.72 [...]
- </svg>
- );
-}
-
-export function TransformIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <path
- d="M441.77 277.51l-82.73 64.23c-.07.05-.13.09-.19.13-5.37 3.48-12.33 3.48-17.69.01-.07-.05-.13-.09-.18-.13l-82.76-64.24h183.54z"></path>
- <path
- d="M462.2 287.02V420.7c0 .98-.79 1.77-1.77 1.77H239.57c-.98 0-1.77-.79-1.77-1.77V287.02l90.91 70.56c.54.44 1.06.8 1.57 1.12 5.99 3.88 12.86 5.81 19.72 5.81s13.73-1.94 19.73-5.81c.49-.32 1.01-.68 1.58-1.13l90.89-70.55zM622.28 330.68l-35.89 31.78a1.48 1.48 0 01-1.98 0l-35.89-31.78c-.3-.26-.48-.63-.51-1.03-.02-.4.11-.79.38-1.09l11.28-12.73c.55-.61 1.49-.67 2.11-.12l12.44 11.02c-5.24-51.26-28.18-99.47-64.84-136.12-35.82-35.82-81.13-58.05-131.04-64.27-.1 0-.19-.03-.28-.06v.09s [...]
- </svg>
- );
-}
-
-export function FilterIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 700 700" className="icon">
- <path
- d="M565.62 156.56L413.36 350.33a10.032 10.032 0 00-2.14 6.18v190.52c0 19.05-25.01 34.49-55.86 34.49s-55.86-15.44-55.86-34.49V356.51c0-2.24-.75-4.42-2.14-6.18L145.1 156.56c-5.15-6.56-.48-16.18 7.87-16.18h404.79c8.34 0 13.02 9.62 7.86 16.18z"></path>
- </svg>
- );
-}
-
-export function SortIcon() {
- return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon">
- <defs>
- <style>{".b{stroke-linejoin: round;}.b,.c {stroke-linecap: round;}.b,.c,.d {fill: none;stroke: #000;stroke-width: 35px;}.c,.d {stroke-miterlimit: 10;}"}</style>
- </defs>
- <path d="M160.63 168.63L160.63 531.37" className="d"></path>
- <path d="M576.31 170.27L269.3 170.27" className="c"></path>
- <path d="M517.53 290.64L269.3 290.64" className="c"></path>
- <path d="M458.75 411L269.3 411" className="c"></path>
- <path d="M399.97 531.37L269.3 531.37" className="c"></path>
- <path d="M197.7 197.95L160.63 168.71 123.55 197.95" className="b"></path>
- <path d="M123.55 502.12L160.62 531.37 197.7 502.12" className="b"></path>
- </svg>
- );
-}
-
-export function OnCompletion() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M22 26.59L19.41 24 18 25.41 22 29.41 30 21.41 28.59 20 22 26.59z"></path>
- <circle cx="16" cy="16" r="2"></circle>
- <path d="M16 22a6 6 0 116-6 6.007 6.007 0 01-6 6zm0-10a4 4 0 104 4 4.005 4.005 0 00-4-4z"></path>
- <path d="M28 16a12 12 0 10-12 12v-2a10 10 0 1110-10z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function Intercept() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M15 4H17V28H15z"></path>
- <path
- d="M10 7v18H4V7h6m0-2H4a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2zM28 7v18h-6V7h6m0-2h-6a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function InterceptFrom() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path d="M26 30H14a2 2 0 01-2-2v-3h2v3h12V4H14v3h-2V4a2 2 0 012-2h12a2 2 0 012 2v24a2 2 0 01-2 2z"></path>
- <path d="M14.59 20.59L18.17 17 4 17 4 15 18.17 15 14.59 11.41 16 10 22 16 16 22 14.59 20.59z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-export function InterceptSendToEndpoint() {
- return (
- <svg
- className="icon" width="32px" height="32px"
- xmlns="http://www.w3.org/2000/svg"
- id="icon"
- fill="#000"
- viewBox="0 0 32 32"
- >
- <defs>
- <style>{".cls-1 { fill: none; }"}</style>
- </defs>
- <path
- d="M6 30h12a2.002 2.002 0 002-2v-3h-2v3H6V4h12v3h2V4a2.002 2.002 0 00-2-2H6a2.002 2.002 0 00-2 2v24a2.002 2.002 0 002 2z"></path>
- <path
- d="M20.586 20.586L24.172 17 10 17 10 15 24.172 15 20.586 11.414 22 10 28 16 22 22 20.586 20.586z"></path>
- <path
- id="_Transparent_Rectangle_"
- d="M0 0H32V32H0z"
- className="cls-1"
- data-name="<Transparent Rectangle>"
- ></path>
- </svg>
- );
-}
-
-
export function SpringIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<g fill="none" fillRule="evenodd">
<path d="M0 0h32v32H0z"></path>
<path
@@ -761,11 +37,9 @@ export function QuarkusIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
preserveAspectRatio="xMidYMid"
viewBox="-0.5 0 257 257"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#4695EB"
d="M213.554 0c23.418.08 42.377 19.052 42.443 42.47v171.084c-.066 23.428-19.042 42.404-42.47 42.47h-25.439l-11.661-28.318h37.127c7.774-.1 14.051-6.378 14.152-14.152V42.47c-.1-7.774-6.378-14.051-14.152-14.152H42.47c-7.774.1-14.051 6.378-14.152 14.152v171.084c.1 7.774 6.378 14.051 14.152 14.152h62.607l22.935-48.494 31.625 76.812H42.47C19.042 255.958.066 236.982 0 213.554V42.47C.066 19.042 19.042.066 42.47 0h171.084zm-43.983 139.727v45.51l-39.417-22.748 39.417-22.762zM86.453 [...]
@@ -786,10 +60,8 @@ export function DatabaseIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width="800"
- height="800"
viewBox="0 0 24 24"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fillRule="evenodd"
d="M12 1.25c-2.487 0-4.774.402-6.466 1.079-.844.337-1.577.758-2.112 1.264C2.886 4.1 2.5 4.744 2.5 5.5v12.987l.026.013H2.5c0 .756.386 1.4.922 1.907.535.506 1.268.927 2.112 1.264 1.692.677 3.979 1.079 6.466 1.079s4.773-.402 6.466-1.079c.844-.337 1.577-.758 2.112-1.264.536-.507.922-1.151.922-1.907h-.026l.026-.013V5.5c0-.756-.386-1.4-.922-1.907-.535-.506-1.268-.927-2.112-1.264C16.773 1.652 14.487 1.25 12 1.25zM4 5.5c0-.21.104-.487.453-.817.35-.332.899-.666 1.638-.962C7.566 3. [...]
@@ -802,10 +74,8 @@ export function CloudIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M16 7a7.66 7.66 0 0 1 1.51.15 8 8 0 0 1 6.35 6.34l.26 1.35 1.35.24a5.5 5.5 0 0 1-1 10.92H7.5a5.5 5.5 0 0 1-1-10.92l1.34-.24.26-1.35A8 8 0 0 1 16 7m0-2a10 10 0 0 0-9.83 8.12A7.5 7.5 0 0 0 7.49 28h17a7.5 7.5 0 0 0 1.32-14.88 10 10 0 0 0-7.94-7.94A10.27 10.27 0 0 0 16 5Z"/>
<path
@@ -823,10 +93,8 @@ export function FileIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"document"}</title>
<path
d="m25.7 9.3-7-7c-.2-.2-.4-.3-.7-.3H8c-1.1 0-2 .9-2 2v24c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V10c0-.3-.1-.5-.3-.7zM18 4.4l5.6 5.6H18V4.4zM24 28H8V4h8v6c0 1.1.9 2 2 2h6v16z"/>
@@ -845,10 +113,8 @@ export function MessagingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M28 28H4a2.002 2.002 0 0 1-2-2v-5h2v5h24v-5h2v5a2.002 2.002 0 0 1-2 2Z"/>
<path d="M7 21h18v2H7zM7 16h18v2H7zM7 11h18v2H7zM7 6h18v2H7z"/>
<path
@@ -866,10 +132,8 @@ export function SchedulingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M16 30a14 14 0 1 1 14-14 14 14 0 0 1-14 14Zm0-26a12 12 0 1 0 12 12A12 12 0 0 0 16 4Z"/>
<path d="M20.59 22 15 16.41V7h2v8.58l5 5.01L20.59 22z"/>
<path
@@ -887,10 +151,8 @@ export function HttpIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M30 11h-5v10h2v-3h3a2.003 2.003 0 0 0 2-2v-3a2.002 2.002 0 0 0-2-2Zm-3 5v-3h3l.001 3ZM10 13h2v8h2v-8h2v-2h-6v2zM23 11h-6v2h2v8h2v-8h2v-2zM6 11v4H3v-4H1v10h2v-4h3v4h2V11H6z"/>
<path
@@ -908,11 +170,9 @@ export function GoogleCloudIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -25 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#EA4335"
d="m170.252 56.819 22.253-22.253 1.483-9.37C153.437-11.677 88.976-7.496 52.42 33.92 42.267 45.423 34.734 59.764 30.717 74.573l7.97-1.123 44.505-7.34 3.436-3.513c19.797-21.742 53.27-24.667 76.128-6.168l7.496.39Z"
@@ -937,11 +197,9 @@ export function AwsIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
fill="none"
viewBox="0 0 16 16"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#252F3E"
d="M4.51 7.687c0 .197.02.357.058.475.042.117.096.245.17.384a.233.233 0 0 1 .037.123c0 .053-.032.107-.1.16l-.336.224a.255.255 0 0 1-.138.048c-.054 0-.107-.026-.16-.074a1.652 1.652 0 0 1-.192-.251 4.137 4.137 0 0 1-.165-.315c-.415.491-.936.737-1.564.737-.447 0-.804-.129-1.064-.385-.261-.256-.394-.598-.394-1.025 0-.454.16-.822.484-1.1.325-.278.756-.416 1.304-.416.18 0 .367.016.564.042.197.027.4.07.612.118v-.39c0-.406-.085-.689-.25-.854-.17-.166-.458-.246-.868-.246-.186 0-.37 [...]
@@ -960,10 +218,8 @@ export function MailIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"email"}</title>
<path
d="M28 6H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h24a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2Zm-2.2 2L16 14.78 6.2 8ZM4 24V8.91l11.43 7.91a1 1 0 0 0 1.14 0L28 8.91V24Z"/>
@@ -982,10 +238,8 @@ export function IotIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"iot--platform"}</title>
<path
d="M30 19h-4v-4h-2v9H8V8h9V6h-4V2h-2v4H8a2.002 2.002 0 0 0-2 2v3H2v2h4v6H2v2h4v3a2.002 2.002 0 0 0 2 2h3v4h2v-4h6v4h2v-4h3a2.003 2.003 0 0 0 2-2v-3h4Z"/>
@@ -1005,12 +259,10 @@ export function IotIcon() {
export function GithubIcon() {
return (
<svg
- width={32}
- height={32}
aria-hidden="true"
data-view-component="true"
viewBox="0 0 16 16"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45 [...]
</svg>
@@ -1022,10 +274,8 @@ export function CassandraIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
- width={113.636}
- height={58.899}
viewBox="0 0 113.63554 58.899029"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<path id="a" d="M24.216.082v24.141H.053V.082z"/>
</defs>
@@ -1112,10 +362,8 @@ export function ActivemqIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={116.42}
- height={167.526}
viewBox="0 0 30.803 44.324"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<filter
id="a"
@@ -1400,11 +648,9 @@ export function KafkaIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="-78.5 0 413 413"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#1A1919"
d="M87.932 36.714c-4.55-4.571-10.896-7.394-17.951-7.394-7.029 0-13.326 2.823-17.822 7.394h-.13c-4.535 4.55-7.358 10.9-7.358 17.93 0 7.055 2.823 13.352 7.359 17.875l.129.102c4.496 4.55 10.793 7.346 17.822 7.346 7.055 0 13.402-2.797 17.951-7.346L88 72.52c4.558-4.523 7.354-10.82 7.354-17.876 0-7.029-2.796-13.38-7.354-17.929h-.067Zm-17.951 346.64a25.504 25.504 0 0 0 17.951-7.368l.067-.134c4.558-4.487 7.354-10.838 7.354-17.817 0-7.056-2.796-13.38-7.354-17.952h-.067c-4.55-4.625 [...]
@@ -1419,7 +665,7 @@ export function GrapeIcon() {
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
viewBox="0 0 512 512"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M438.557 512H19.785c-8.216 0-14.876-6.66-14.876-14.876V256.916c0-8.216 6.66-14.876 14.876-14.876s14.876 6.66 14.876 14.876v225.332h389.021v-32.833c0-8.216 6.661-14.876 14.876-14.876s14.876 6.66 14.876 14.876v47.709c-.001 8.216-6.662 14.876-14.877 14.876z"
style={{
@@ -1452,10 +698,8 @@ export function MachineLearningIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M27 24a2.96 2.96 0 0 0-1.285.3l-4.3-4.3H18v2h2.586l3.715 3.715A2.966 2.966 0 0 0 24 27a3 3 0 1 0 3-3Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1ZM27 13a2.995 2.995 0 0 0-2.816 2H18v2h6.184A2.995 2.995 0 1 0 27 13Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1ZM27 2a3.003 3.003 0 0 0-3 3 2.966 2.966 0 0 0 .348 1.373L20.596 10H18v2h3.404l4.4-4.252A2.999 2.999 0 1 0 27 2Zm0 4a1 1 0 1 1 1-1 1 1 0 0 1-1 1Z"/>
<path
@@ -1475,10 +719,8 @@ export function TerminalIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"terminal"}</title>
<path
d="M26 4.01H6a2 2 0 0 0-2 2v20a2 2 0 0 0 2 2h20a2 2 0 0 0 2-2v-20a2 2 0 0 0-2-2Zm0 2v4H6v-4Zm-20 20v-14h20v14Z"/>
@@ -1498,10 +740,8 @@ export function SapIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<circle
cx={512}
cy={512}
@@ -1524,10 +764,8 @@ export function ScriptIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"script"}</title>
<path
d="m18.83 26 2.58-2.58L20 22l-4 4 4 4 1.42-1.41L18.83 26zM27.17 26l-2.58 2.58L26 30l4-4-4-4-1.42 1.41L27.17 26z"/>
@@ -1548,10 +786,8 @@ export function ValidationIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="m22 27.18-2.59-2.59L18 26l4 4 8-8-1.41-1.41L22 27.18z"/>
<path
d="M15 28H8V4h8v6a2.006 2.006 0 0 0 2 2h6v6h2v-8a.91.91 0 0 0-.3-.7l-7-7A.909.909 0 0 0 18 2H8a2.006 2.006 0 0 0-2 2v24a2.006 2.006 0 0 0 2 2h7Zm3-23.6 5.6 5.6H18Z"/>
@@ -1570,11 +806,9 @@ export function OpenstackIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -2.5 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#DA1A32"
d="M57.82 170.723v9.156c0 7.104 5.756 12.86 12.86 12.86h114.65c7.104 0 12.86-5.756 12.86-12.86v-9.156H256v56.051c0 13.082-10.703 23.785-23.785 23.785H23.785C10.703 250.559 0 239.856 0 226.774v-56.051h57.82Zm-.01-74.353v57.809H0v-57.81h57.81Zm198.19 0v57.809h-57.81v-57.81H256ZM232.215 0C245.297 0 256 10.703 256 23.795v56.041h-57.81V70.68c0-7.104-5.756-12.86-12.86-12.86H70.67c-7.104 0-12.86 5.756-12.86 12.86v9.156H0V23.785C0 10.703 10.703 0 23.785 0Z"
@@ -1587,11 +821,9 @@ export function OpenshiftIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -9.5 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#DA2430"
d="m74.84 106.893-40.869 14.87c.525 6.552 1.652 13.024 3.24 19.366l38.818-14.137c-1.244-6.552-1.689-13.32-1.18-20.1M255.444 61.702c-2.85-5.879-6.147-11.561-9.966-16.916l-40.857 14.87c4.755 4.864 8.743 10.33 12.007 16.176L255.445 61.7v.002Z"
@@ -1632,10 +864,8 @@ export function RefIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M4 20v2h4.586L2 28.586 3.414 30 10 23.414V28h2v-8H4zM30 30h-8v-8h8Zm-6-2h4v-4h-4ZM20 20h-8v-8h8Zm-6-2h4v-4h-4Z"/>
<path d="M24 17h-2v-2h2a4 4 0 0 0 0-8H12V5h12a6 6 0 0 1 0 12ZM10 10H2V2h8ZM4 8h4V4H4Z"/>
@@ -1654,11 +884,9 @@ export function RedisIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
preserveAspectRatio="xMidYMid"
viewBox="0 -18 256 256"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#912626"
d="M245.97 168.943c-13.662 7.121-84.434 36.22-99.501 44.075-15.067 7.856-23.437 7.78-35.34 2.09-11.902-5.69-87.216-36.112-100.783-42.597C3.566 169.271 0 166.535 0 163.951v-25.876s98.05-21.345 113.879-27.024c15.828-5.679 21.32-5.884 34.79-.95 13.472 4.936 94.018 19.468 107.331 24.344l-.006 25.51c.002 2.558-3.07 5.364-10.024 8.988"
@@ -1703,10 +931,8 @@ export function SearchIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="m29 27.586-7.552-7.552a11.018 11.018 0 1 0-1.414 1.414L27.586 29ZM4 13a9 9 0 1 1 9 9 9.01 9.01 0 0 1-9-9Z"/>
<path
@@ -1724,10 +950,8 @@ export function BlockchainIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"blockchain"}</title>
<path d="M6 24H4V8h2ZM28 8h-2v16h2Zm-4-2V4H8v2Zm0 22v-2H8v2Z"/>
<path
@@ -1745,10 +969,8 @@ export function ChatIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"chat"}</title>
<path
d="M17.74 30 16 29l4-7h6a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h9v2H6a4 4 0 0 1-4-4V8a4 4 0 0 1 4-4h20a4 4 0 0 1 4 4v12a4 4 0 0 1-4 4h-4.84Z"/>
@@ -1769,10 +991,8 @@ export function WorkflowIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 512 512"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M445.66 49.341H340.206L294.008 3.143c-4.192-4.191-10.99-4.191-15.183 0l-49.341 49.342c-4.192 4.192-4.192 10.99 0 15.183l46.198 46.198v38.494h-80.516c-5.929 0-10.736 4.806-10.736 10.735v21.471h-42.942v-21.471c0-5.929-4.806-10.735-10.736-10.735H66.34c-5.929 0-10.735 4.806-10.735 10.735v64.413c0 5.929 4.806 10.735 10.735 10.735h20.755v93.798c0 5.929 4.806 10.736 10.735 10.736h95.437l-10.346 10.346c-4.192 4.192-4.193 10.99 0 15.182a10.7 10.7 0 0 0 7.591 3.144c2.747 0 5.495 [...]
</svg>
@@ -1783,10 +1003,8 @@ export function WebserviceIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"fog"}</title>
<path
d="M25.829 13.116A10.02 10.02 0 0 0 16 5v2a8.023 8.023 0 0 1 7.865 6.493l.259 1.346 1.349.245A5.502 5.502 0 0 1 24.508 26H16v2h8.508a7.502 7.502 0 0 0 1.32-14.884ZM8 24h6v2H8zM4 24h2v2H4zM6 20h8v2H6zM2 20h2v2H2zM8 16h6v2H8zM4 16h2v2H4zM10 12h4v2h-4zM6 12h2v2H6zM12 8h2v2h-2z"/>
@@ -1805,10 +1023,8 @@ export function MobileIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="M23 7h4v4h-4zM23 13h4v4h-4zM17 7h4v4h-4zM17 13h4v4h-4z"/>
<circle cx={14.5} cy={24.5} r={1.5}/>
<path
@@ -1828,10 +1044,8 @@ export function ClusterIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M16 7a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM11 30a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM7 11a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM21 30a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM25 11a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 0 1 1 1.001 1.001 0 0 0-1-1ZM4 21a3 3 0 1 1 3-3 3.003 3.003 0 0 1-3 3Zm0-4a1 1 0 1 [...]
<path
@@ -1849,10 +1063,8 @@ export function RpcIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path d="m14 26 1.41-1.41L7.83 17H28v-2H7.83l7.58-7.59L14 6 4 16l10 10z"/>
<path
d="M0 0h32v32H0z"
@@ -1871,7 +1083,7 @@ export function InfinispanIcon() {
xmlns="http://www.w3.org/2000/svg"
id="artwork"
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<style>{".cls-2{fill:#fff}"}</style>
</defs>
@@ -1897,10 +1109,8 @@ export function TransformationIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"data-share"}</title>
<path
d="M5 25v-9.172l-3.586 3.586L0 18l6-6 6 6-1.414 1.414L7 15.828V25h12v2H7a2.002 2.002 0 0 1-2-2ZM24 22h4a2.002 2.002 0 0 1 2 2v4a2.002 2.002 0 0 1-2 2h-4a2.002 2.002 0 0 1-2-2v-4a2.002 2.002 0 0 1 2-2Zm4 6v-4h-4.002L24 28ZM27 6v9.172l3.586-3.586L32 13l-6 6-6-6 1.414-1.414L25 15.172V6H13V4h12a2.002 2.002 0 0 1 2 2ZM2 6h6v2H2zM2 2h8v2H2z"/>
@@ -1919,10 +1129,8 @@ export function TestingIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M28 17v5H4V6h10V4H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v4H8v2h16v-2h-4v-4h8a2 2 0 0 0 2-2v-5ZM18 28h-4v-4h4Z"/>
<path
@@ -1942,10 +1150,8 @@ export function ApiIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"api"}</title>
<path
d="M26 22a3.86 3.86 0 0 0-2 .57l-3.09-3.1a6 6 0 0 0 0-6.94L24 9.43a3.86 3.86 0 0 0 2 .57 4 4 0 1 0-4-4 3.86 3.86 0 0 0 .57 2l-3.1 3.09a6 6 0 0 0-6.94 0L9.43 8A3.86 3.86 0 0 0 10 6a4 4 0 1 0-4 4 3.86 3.86 0 0 0 2-.57l3.09 3.1a6 6 0 0 0 0 6.94L8 22.57A3.86 3.86 0 0 0 6 22a4 4 0 1 0 4 4 3.86 3.86 0 0 0-.57-2l3.1-3.09a6 6 0 0 0 6.94 0l3.1 3.09a3.86 3.86 0 0 0-.57 2 4 4 0 1 0 4-4Zm0-18a2 2 0 1 1-2 2 2 2 0 0 1 2-2ZM4 6a2 2 0 1 1 2 2 2 2 0 0 1-2-2Zm2 22a2 2 0 1 1 2-2 2 2 0 0 1-2 [...]
@@ -1963,10 +1169,8 @@ export function MonitoringIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M28 16v6H4V6h7V4H4a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h8v4H8v2h16v-2h-4v-4h8a2 2 0 0 0 2-2v-6ZM18 28h-4v-4h4Z"/>
<path
@@ -1987,10 +1191,8 @@ export function NetworkingIcon() {
<svg
xmlns="http://www.w3.org/2000/svg"
xmlSpace="preserve"
- width={800}
- height={800}
viewBox="0 0 511.984 511.984"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
d="M207.29 287.991H48.735C30.687 287.991 16 302.375 16 320.054v111.868c0 17.679 14.688 32.063 32.735 32.063H207.29c18.031 0 32.703-14.384 32.703-32.063V320.054c0-17.679-14.672-32.063-32.703-32.063zm0 143.996-159.291-.064.736-111.932 159.259.064.048 111.645c0 .015-.192.287-.752.287z"/>
<path
@@ -2010,7 +1212,7 @@ export function HealthIcon() {
xmlSpace="preserve"
id="Icons"
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<style>
{
".st0{fill:none;stroke:#000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10}"
@@ -2029,10 +1231,8 @@ export function KubernetesIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 -10.44 722.846 722.846"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#326ce5"
d="M358.986 10.06a46.725 46.342 0 0 0-17.906 4.531L96.736 131.341a46.725 46.342 0 0 0-25.28 31.438l-60.282 262.25a46.725 46.342 0 0 0 6.344 35.531 46.725 46.342 0 0 0 2.656 3.688l169.125 210.28a46.725 46.342 0 0 0 36.531 17.438l271.219-.062a46.725 46.342 0 0 0 36.531-17.406l169.063-210.313a46.725 46.342 0 0 0 9.03-39.219L651.3 162.716a46.725 46.342 0 0 0-25.281-31.437L381.643 14.59a46.725 46.342 0 0 0-22.657-4.53z"
@@ -2062,10 +1262,8 @@ export function DocumentIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 32 32"
- className="icon">
+ className="icon" width="32px" height="32px">
<title>{"document--blank"}</title>
<path
d="m25.7 9.3-7-7A.908.908 0 0 0 18 2H8a2.006 2.006 0 0 0-2 2v24a2.006 2.006 0 0 0 2 2h16a2.006 2.006 0 0 0 2-2V10a.908.908 0 0 0-.3-.7ZM18 4.4l5.6 5.6H18ZM24 28H8V4h8v6a2.006 2.006 0 0 0 2 2h6Z"/>
@@ -2084,11 +1282,9 @@ export function GitIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
fill="none"
viewBox="0 0 24 24"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#000"
fillRule="evenodd"
@@ -2103,10 +1299,8 @@ export function SocialIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={800}
- height={800}
viewBox="0 0 1024 1024"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#FFB89A"
d="M570.2 842c-50.6 0-278.7-180-278.7-401.9 0-58.8-2.9-133.1-1-183.9-50.8 3.2-91.4 45.7-91.4 97.3v272.1c37.4 194.7 137.5 334 255.2 334 69.5 0 132.9-48.6 180.9-128.5-20.8 7.1-42.6 10.9-65 10.9z"
@@ -2133,7 +1327,7 @@ export function DebeziumIcon() {
xmlns="http://www.w3.org/2000/svg"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 130.93 130.93"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<linearGradient
id="linear-gradient"
@@ -2220,11 +1414,9 @@ export function IgniteIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={48}
- height={48}
fill="none"
viewBox="0 0 48 48"
- className="icon">
+ className="icon" width="32px" height="32px">
<path
fill="#ED1C24"
d="M7.686 8.136S-8.95 18.28 6.73 28.355c3.016 1.962 13.956 7.418 13.644 12.466 0 0 6.631-9.81-3.064-15.983C7.351 18.52 4.862 11.772 7.686 8.135Z"
@@ -2239,7 +1431,7 @@ export function IgniteIcon() {
export function HazelcastIcon() {
return (
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.3 133.3" className="icon">
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 133.3 133.3" className="icon" width="32px" height="32px">
<defs>
<style>{".a{fill:#00e1e1}"}</style>
</defs>
@@ -2279,10 +1471,8 @@ export function AzureIcon() {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
- width={150}
- height={150}
viewBox="0 0 96 96"
- className="icon">
+ className="icon" width="32px" height="32px">
<defs>
<linearGradient
id="a"
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/icons/EipIcons.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/icons/EipIcons.tsx
new file mode 100644
index 00000000..6759e928
--- /dev/null
+++ b/karavan-web/karavan-app/src/main/webui/src/designer/icons/EipIcons.tsx
@@ -0,0 +1,230 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 React from 'react';
+
+export function AggregateIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M496.2 417.71l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 417.71h292.4z"></path>
+ <path
+ d="M516.1 426.23v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V426.22l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM247.14 358.45l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-. [...]
+ <path
+ d="M277.46 154.15V264.2c0 5.52-4.48 10-10 10H82.69c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ <g>
+ <path d="M610.57 145.6l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
+ <path
+ d="M627.5 154.15V264.2c0 5.52-4.48 10-10 10H432.73c-5.52 0-10-4.48-10-10V154.14l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ </g>
+ </svg>
+ );
+}
+
+export function ToIcon() {
+ return (
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 32 32"
+ className="icon" width="32px" height="32px"
+ >
+ <path
+ d="M24 22v-1h6v-2h-6v-6h6v-2h-6v-1a2 2 0 0 0-2-2h-6a8.007 8.007 0 0 0-7.93 7v2A8.007 8.007 0 0 0 16 24h6a2 2 0 0 0 2-2zm-8 0a6 6 0 1 1 0-12h6v12z"/>
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ );
+}
+
+export function ChoiceIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M407.33 113.97V609.2c0 2.75-1.9 5-4.22 5H291.55c-2.33 0-4.22-2.25-4.22-5V113.97c0-2.76 1.89-5 4.22-5h111.56c2.32 0 4.22 2.24 4.22 5zM27.1 437.55l60.87-57.64c.95-.9 2.32-1.41 3.76-1.41H258.2c2.76 0 5 1.87 5 4.17v111.65c0 2.3-2.24 4.17-5 4.17H91.54c-1.38 0-2.7-.48-3.65-1.32L27.2 443.15c-1.77-1.58-1.81-3.99-.1-5.61zM667.57 285.62l-60.87 57.64c-.95.9-2.32 1.41-3.76 1.41H436.47c-2.76 0-5-1.87-5-4.17V228.85c0-2.3 2.24-4.17 5-4.17h166.66c1.38 0 2.7.48 3.65 1.32l60.69 54.02c1. [...]
+ </svg>
+ );
+}
+
+
+export function SplitIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M496.2 83.65l-130.22 101.1c-.19.14-.39.29-.59.42a28.39 28.39 0 01-30.77 0c-.21-.13-.4-.28-.59-.42L203.8 83.65h292.4z"></path>
+ <path
+ d="M516.1 92.17v202.1c0 4.12-3.34 7.46-7.45 7.46H191.36c-4.11 0-7.46-3.34-7.46-7.46V92.16l138.52 107.53c.68.53 1.31.98 1.94 1.38 7.79 5.04 16.72 7.55 25.66 7.55s17.86-2.52 25.66-7.55c.62-.4 1.25-.85 1.94-1.38l138.5-107.52zM524.34 397.22l-12.91 30.22-.03.06v.03c-.11.21-.21.43-.32.64s-.23.42-.36.61c-.08.14-.17.27-.27.4-.08.11-.16.21-.24.31-.1.13-.21.25-.31.36-.08.09-.16.18-.24.25-.05.06-.1.11-.16.15l-.27.25c-.17.15-.33.29-.51.42-.15.13-.3.23-.47.33-.19.13-.39.25-.59.36s-.42 [...]
+ <path
+ d="M277.36 476.26v110.05c0 5.52-4.48 10-10 10H82.59c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ <g>
+ <path d="M610.48 467.71l-76.07 57.24c-5.52 4.16-13.24 4.16-18.76 0l-76.08-57.24h170.91z"></path>
+ <path
+ d="M627.41 476.26v110.05c0 5.52-4.48 10-10 10H432.64c-5.52 0-10-4.48-10-10V476.25l82.79 62.29c5.77 4.34 12.69 6.51 19.6 6.51s13.83-2.17 19.6-6.51l82.78-62.28z"></path>
+ </g>
+ </svg>
+ );
+}
+
+export function SagaIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M626.41 255.77c-.56-4.77-2.95-9.03-6.71-11.99l-46.46-36.64-1.06-1.09-.8-.28c-.81-.52-1.67-.98-2.56-1.36-.43-.19-.85-.36-1.25-.5-.47-.16-.96-.31-1.51-.45-.47-.11-.96-.22-1.45-.3-.49-.08-.97-.14-1.43-.18-.96-.08-1.95-.08-2.91-.01-.41.03-.83.08-1.23.14-.41.06-.82.14-1.25.23l-.58.14c-.1.03-.2.05-.31.08-.11.03-.21.06-.3.09-.29.08-.57.18-.86.28-.49.17-.99.37-1.53.61l-.16.08c-.32.15-.65.31-.97.49-.49.26-.93.53-1.34.81-.39.26-.76.52-1.12.8l-46.96 37.05a17.823 17.823 0 00-6.72 [...]
+ </svg>
+ );
+}
+
+export function TransformIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M441.77 277.51l-82.73 64.23c-.07.05-.13.09-.19.13-5.37 3.48-12.33 3.48-17.69.01-.07-.05-.13-.09-.18-.13l-82.76-64.24h183.54z"></path>
+ <path
+ d="M462.2 287.02V420.7c0 .98-.79 1.77-1.77 1.77H239.57c-.98 0-1.77-.79-1.77-1.77V287.02l90.91 70.56c.54.44 1.06.8 1.57 1.12 5.99 3.88 12.86 5.81 19.72 5.81s13.73-1.94 19.73-5.81c.49-.32 1.01-.68 1.58-1.13l90.89-70.55zM622.28 330.68l-35.89 31.78a1.48 1.48 0 01-1.98 0l-35.89-31.78c-.3-.26-.48-.63-.51-1.03-.02-.4.11-.79.38-1.09l11.28-12.73c.55-.61 1.49-.67 2.11-.12l12.44 11.02c-5.24-51.26-28.18-99.47-64.84-136.12-35.82-35.82-81.13-58.05-131.04-64.27-.1 0-.19-.03-.28-.06v.09s [...]
+ </svg>
+ );
+}
+
+export function FilterIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" id="a" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <path
+ d="M565.62 156.56L413.36 350.33a10.032 10.032 0 00-2.14 6.18v190.52c0 19.05-25.01 34.49-55.86 34.49s-55.86-15.44-55.86-34.49V356.51c0-2.24-.75-4.42-2.14-6.18L145.1 156.56c-5.15-6.56-.48-16.18 7.87-16.18h404.79c8.34 0 13.02 9.62 7.86 16.18z"></path>
+ </svg>
+ );
+}
+
+export function SortIcon() {
+ return (
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 700 700" className="icon" width="32px" height="32px">
+ <defs>
+ <style>{".b{stroke-linejoin: round;}.b,.c {stroke-linecap: round;}.b,.c,.d {fill: none;stroke: #000;stroke-width: 35px;}.c,.d {stroke-miterlimit: 10;}"}</style>
+ </defs>
+ <path d="M160.63 168.63L160.63 531.37" className="d"></path>
+ <path d="M576.31 170.27L269.3 170.27" className="c"></path>
+ <path d="M517.53 290.64L269.3 290.64" className="c"></path>
+ <path d="M458.75 411L269.3 411" className="c"></path>
+ <path d="M399.97 531.37L269.3 531.37" className="c"></path>
+ <path d="M197.7 197.95L160.63 168.71 123.55 197.95" className="b"></path>
+ <path d="M123.55 502.12L160.62 531.37 197.7 502.12" className="b"></path>
+ </svg>
+ );
+}
+
+export function OnCompletion() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M22 26.59L19.41 24 18 25.41 22 29.41 30 21.41 28.59 20 22 26.59z"></path>
+ <circle cx="16" cy="16" r="2"></circle>
+ <path d="M16 22a6 6 0 116-6 6.007 6.007 0 01-6 6zm0-10a4 4 0 104 4 4.005 4.005 0 00-4-4z"></path>
+ <path d="M28 16a12 12 0 10-12 12v-2a10 10 0 1110-10z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function Intercept() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M15 4H17V28H15z"></path>
+ <path
+ d="M10 7v18H4V7h6m0-2H4a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2zM28 7v18h-6V7h6m0-2h-6a2 2 0 00-2 2v18a2 2 0 002 2h6a2 2 0 002-2V7a2 2 0 00-2-2z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function InterceptFrom() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path d="M26 30H14a2 2 0 01-2-2v-3h2v3h12V4H14v3h-2V4a2 2 0 012-2h12a2 2 0 012 2v24a2 2 0 01-2 2z"></path>
+ <path d="M14.59 20.59L18.17 17 4 17 4 15 18.17 15 14.59 11.41 16 10 22 16 16 22 14.59 20.59z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
+
+export function InterceptSendToEndpoint() {
+ return (
+ <svg
+ className="icon" width="32px" height="32px"
+ xmlns="http://www.w3.org/2000/svg"
+ id="icon"
+ fill="#000"
+ viewBox="0 0 32 32"
+ >
+ <defs>
+ <style>{".cls-1 { fill: none; }"}</style>
+ </defs>
+ <path
+ d="M6 30h12a2.002 2.002 0 002-2v-3h-2v3H6V4h12v3h2V4a2.002 2.002 0 00-2-2H6a2.002 2.002 0 00-2 2v24a2.002 2.002 0 002 2z"></path>
+ <path
+ d="M20.586 20.586L24.172 17 10 17 10 15 24.172 15 20.586 11.414 22 10 28 16 22 22 20.586 20.586z"></path>
+ <path
+ id="_Transparent_Rectangle_"
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>
+ );
+}
\ No newline at end of file
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/icons/KaravanIcons.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/icons/KaravanIcons.tsx
new file mode 100644
index 00000000..b7165b93
--- /dev/null
+++ b/karavan-web/karavan-app/src/main/webui/src/designer/icons/KaravanIcons.tsx
@@ -0,0 +1,521 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You 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 React from 'react';
+
+export function KaravanIcon(className?: string) {
+ return (
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ id="svg50"
+ width={32}
+ height={32}
+ preserveAspectRatio="xMidYMid"
+ version="1.1"
+ viewBox="0 0 256 256"
+ className={className ? className : "logo"}
+ >
+ <defs id="defs31">
+ <linearGradient id="linearGradient1351">
+ <stop
+ id="stop1347"
+ offset="0"
+ stopColor="#dcffff"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop1349"
+ offset="1"
+ stopColor="#96d2e6"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <circle id="path-1" cx="128" cy="128" r="128"></circle>
+ <linearGradient
+ id="linearGradient-3"
+ x1="-26.051"
+ x2="254.316"
+ y1="271.331"
+ y2="0.048"
+ gradientUnits="userSpaceOnUse"
+ >
+ <stop
+ id="stop10"
+ offset="0%"
+ stopColor="#4790bb"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop12"
+ offset="10.996%"
+ stopColor="#64b7db"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop14"
+ offset="94.502%"
+ stopColor="#326ea0"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <linearGradient
+ id="linearGradient-4"
+ x1="-32.163"
+ x2="259.338"
+ y1="277.029"
+ y2="-5.028"
+ gradientUnits="userSpaceOnUse"
+ >
+ <stop id="stop17" offset="0%" stopColor="#F69923"></stop>
+ <stop id="stop19" offset="8.048%" stopColor="#F79A23"></stop>
+ <stop id="stop21" offset="41.874%" stopColor="#E97826"></stop>
+ </linearGradient>
+ <linearGradient
+ id="linearGradient-5"
+ x1="217.945"
+ x2="99.459"
+ y1="67.505"
+ y2="247.005"
+ gradientTransform="scale(.96442 1.0369)"
+ gradientUnits="userSpaceOnUse"
+ xlinkHref="#linearGradient-4"
+ >
+ <stop
+ id="stop24"
+ offset="0%"
+ stopColor="#92d6d5"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop26"
+ offset="41.191%"
+ stopColor="#79b7cc"
+ stopOpacity="1"
+ ></stop>
+ <stop
+ id="stop28"
+ offset="73.271%"
+ stopColor="#5891c5"
+ stopOpacity="1"
+ ></stop>
+ </linearGradient>
+ <mask id="mask-2" fill="#fff">
+ <use id="use33" xlinkHref="#path-1"></use>
+ </mask>
+ <mask id="mask-2-7" fill="#fff">
+ <use id="use137" xlinkHref="#path-1"></use>
+ </mask>
+ <linearGradient
+ id="linearGradient1345"
+ x1="233.122"
+ x2="2.24"
+ y1="56.015"
+ y2="242.78"
+ gradientUnits="userSpaceOnUse"
+ xlinkHref="#linearGradient1351"
+ ></linearGradient>
+ </defs>
+ <circle
+ id="circle38"
+ cx="127.994"
+ cy="127.994"
+ r="123.111"
+ fill="url(#linearGradient-3)"
+ fillRule="nonzero"
+ mask="url(#mask-2)"
+ ></circle>
+ <g id="g2266">
+ <path
+ id="path42"
+ fill="url(#linearGradient-5)"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412z"
+ mask="url(#mask-2)"
+ opacity="0.75"
+ ></path>
+ </g>
+ <path
+ id="path44"
+ fill="#1e4b7b"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513z"
+ mask="url(#mask-2)"
+ opacity="0.75"
+ ></path>
+ <path
+ id="path150"
+ fill="url(#linearGradient1345)"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488z"
+ mask="url(#mask-2-7)"
+ transform="translate(-.769 -.133)"
+ ></path>
+ <path
+ id="path40"
+ fill="#2d4150"
+ fillOpacity="1"
+ fillRule="nonzero"
+ d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232z"
+ mask="url(#mask-2)"
+ transform="translate(-.59) scale(1.00078)"
+ ></path>
+ </svg>
+ );
+}
+
+export function CamelIcon(props?: (JSX.IntrinsicAttributes & React.SVGProps<SVGSVGElement>) | undefined) {
+ return (<svg
+ xmlns="http://www.w3.org/2000/svg"
+ xmlnsXlink="http://www.w3.org/1999/xlink"
+ preserveAspectRatio="xMidYMid"
+ viewBox="0 0 256 256"
+ {...props}
+ className="icon" width="32px" height="32px">
+ <defs>
+ <linearGradient
+ id="b"
+ x1="-12.564%"
+ x2="101.304%"
+ y1="108.214%"
+ y2="-1.964%"
+ >
+ <stop offset="0%" stopColor="#F69923"/>
+ <stop offset="10.996%" stopColor="#F79A23"/>
+ <stop offset="94.502%" stopColor="#E97826"/>
+ </linearGradient>
+ <linearGradient
+ id="d"
+ x1="-12.564%"
+ x2="101.304%"
+ y1="108.214%"
+ y2="-1.964%"
+ >
+ <stop offset="0%" stopColor="#F69923"/>
+ <stop offset="8.048%" stopColor="#F79A23"/>
+ <stop offset="41.874%" stopColor="#E97826"/>
+ </linearGradient>
+ <linearGradient
+ id="e"
+ x1="74.724%"
+ x2="6.653%"
+ y1="-3.059%"
+ y2="100.066%"
+ >
+ <stop offset="0%" stopColor="#F6E423"/>
+ <stop offset="41.191%" stopColor="#F79A23"/>
+ <stop offset="73.271%" stopColor="#E97826"/>
+ </linearGradient>
+ <circle id="a" cx={128} cy={128} r={128}/>
+ </defs>
+ <mask id="c" fill="#fff">
+ <use xlinkHref="#a"/>
+ </mask>
+ <circle
+ cx={127.994}
+ cy={127.994}
+ r={123.111}
+ fill="url(#b)"
+ mask="url(#c)"
+ />
+ <path
+ fill="url(#d)"
+ d="M128 256C57.308 256 0 198.692 0 128 0 57.308 57.308 0 128 0c70.692 0 128 57.308 128 128 0 70.692-57.308 128-128 128Zm0-9.768c65.298 0 118.232-52.934 118.232-118.232S193.298 9.768 128 9.768 9.768 62.702 9.768 128 62.702 246.232 128 246.232Z"
+ mask="url(#c)"
+ />
+ <path
+ fill="url(#e)"
+ d="M98.044 75.517c-1.751-.002-3.524.01-5.292.061-2.056.06-4.817.713-8 1.785 53.775 40.834 73.108 114.497 39.875 178.514 1.129.03 2.249.123 3.385.123 60.736 0 111.492-42.323 124.609-99.071-38.542-45.178-90.813-81.314-154.578-81.412Z"
+ mask="url(#c)"
+ opacity={0.75}
+ />
+ <path
+ fill="#28170B"
+ d="M84.752 77.368C66.895 83.378 32.83 104.546.079 132.81c2.487 67.334 57.028 121.313 124.548 123.07 33.233-64.016 13.901-137.68-39.875-178.513Z"
+ mask="url(#c)"
+ opacity={0.75}
+ />
+ <path
+ fill="#FFF"
+ d="M128.747 54.005c-10.985 5.495 0 27.466 0 27.466C95.774 108.954 102.78 155.9 64.312 155.9c-20.97 0-42.242-24.077-64.233-38.828-.283 3.479-.785 6.972-.785 10.524 0 48.095 26.263 89.924 65.42 111.897 10.952-1.38 22.838-4.114 31.05-9.592 43.146-28.765 53.857-83.491 71.487-109.925 10.979-16.492 62.434-15.061 65.906-22.01 5.502-10.991-10.99-27.467-16.491-27.467h-43.958c-3.071 0-7.897-5.456-10.974-5.456h-16.492s-7.307-11.085-13.794-11.526c-.93-.066-1.83.053-2.7.488Z"
+ mask="url(#c)"
+ />
+ </svg>
+ );
+}
+
+export function getDesignerIcon(icon: string) {
+ if (icon === 'kamelet') return (
+ <svg
+ className="top-icon" id="icon"
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 32 32"
+ >
+ <title>{"application"}</title>
+ <path d="M16 18H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2ZM6 6v10h10V6ZM26 12v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM26 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2ZM16 22v4h-4v-4h4m0-2h-4a2 2 0 0 0-2 2v4a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-4a2 2 0 0 0-2-2Z" />
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ )
+ if (icon === 'code') return (
+ <svg
+
+ xmlns="http://www.w3.org/2000/svg"
+ width="24"
+ height="24"
+ fill="none"
+ viewBox="0 0 24 24"
+ >
+ <path
+ fill="#000000"
+ d="M8.502 5.387a.75.75 0 00-1.004-1.115L5.761 5.836c-.737.663-1.347 1.212-1.767 1.71-.44.525-.754 1.088-.754 1.784 0 .695.313 1.258.754 1.782.42.499 1.03 1.049 1.767 1.711l1.737 1.564a.75.75 0 101.004-1.115l-1.697-1.527c-.788-.709-1.319-1.19-1.663-1.598-.33-.393-.402-.622-.402-.817 0-.196.072-.425.402-.818.344-.409.875-.889 1.663-1.598l1.697-1.527zM14.18 4.275a.75.75 0 01.532.918l-3.987 15a.75.75 0 11-1.45-.386l3.987-15a.75.75 0 01.918-.532zM15.443 10.498a.75.75 0 011.059 [...]
+ ></path>
+ </svg>
+ )
+ if (icon === 'routes') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <path
+ d="M29,10H24v2h5v6H22v2h3v2.142a4,4,0,1,0,2,0V20h2a2.0027,2.0027,0,0,0,2-2V12A2.0023,2.0023,0,0,0,29,10ZM28,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,28,26Z"/>
+ <path
+ d="M19,6H14V8h5v6H12v2h3v6.142a4,4,0,1,0,2,0V16h2a2.0023,2.0023,0,0,0,2-2V8A2.0023,2.0023,0,0,0,19,6ZM18,26a2,2,0,1,1-2-2A2.0027,2.0027,0,0,1,18,26Z"/>
+ <path
+ d="M9,2H3A2.002,2.002,0,0,0,1,4v6a2.002,2.002,0,0,0,2,2H5V22.142a4,4,0,1,0,2,0V12H9a2.002,2.002,0,0,0,2-2V4A2.002,2.002,0,0,0,9,2ZM8,26a2,2,0,1,1-2-2A2.0023,2.0023,0,0,1,8,26ZM3,10V4H9l.0015,6Z"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32"/>
+ </svg>)
+ if (icon === 'route') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <title>{"category"}</title>
+ <path d="M27 22.141V18a2 2 0 0 0-2-2h-8v-4h2a2.002 2.002 0 0 0 2-2V4a2.002 2.002 0 0 0-2-2h-6a2.002 2.002 0 0 0-2 2v6a2.002 2.002 0 0 0 2 2h2v4H7a2 2 0 0 0-2 2v4.142a4 4 0 1 0 2 0V18h8v4.142a4 4 0 1 0 2 0V18h8v4.141a4 4 0 1 0 2 0ZM13 4h6l.001 6H13ZM8 26a2 2 0 1 1-2-2 2.002 2.002 0 0 1 2 2Zm10 0a2 2 0 1 1-2-2 2.003 2.003 0 0 1 2 2Zm8 2a2 2 0 1 1 2-2 2.002 2.002 0 0 1-2 2Z" />
+ <path
+ d="M0 0h32v32H0z"
+ data-name="<Transparent Rectangle>"
+ style={{
+ fill: "none",
+ }}
+ />
+ </svg>
+ )
+ if (icon === 'rest') return (
+ <svg className="top-icon" viewBox="0 0 32 32" width="32px" height="32px">
+ <g className="layer">
+ <title>Layer 1</title>
+ <path
+ d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
+ id="svg_1"/>
+ <path
+ d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1.414 [...]
+ id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'beans') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>data--1</title>
+ <rect x="15" y="6" width="13" height="2"/>
+ <rect x="15" y="24" width="13" height="2"/>
+ <rect x="4" y="15" width="13" height="2"/>
+ <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z" transform="translate(0 0)"/>
+ <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z" transform="translate(0 0)"/>
+ <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'dependencies') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>application</title>
+ <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
+ transform="translate(0 0)"/>
+ <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ if (icon === 'error') return (
+ <svg className="top-icon" width="36px" height="36px" viewBox="0 0 36 36" version="1.1"
+ preserveAspectRatio="xMidYMid meet">
+ <circle className="clr-i-outline clr-i-outline-path-1" cx="18" cy="26.06" r="1.33"/>
+ <path className="clr-i-outline clr-i-outline-path-2"
+ d="M18,22.61a1,1,0,0,1-1-1v-12a1,1,0,1,1,2,0v12A1,1,0,0,1,18,22.61Z"/>
+ <path className="clr-i-outline clr-i-outline-path-3"
+ d="M18,34A16,16,0,1,1,34,18,16,16,0,0,1,18,34ZM18,4A14,14,0,1,0,32,18,14,14,0,0,0,18,4Z"/>
+ <rect x="0" y="0" width="36" height="36" fillOpacity="0"/>
+ </svg>)
+ if (icon === 'exception') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <title>misuse--alt</title>
+ <polygon
+ points="21.41 23 16 17.591 10.59 23 9 21.41 14.409 16 9 10.591 10.591 9 16 14.409 21.409 9 23 10.591 17.591 16 23 21.41 21.41 23"/>
+ <path d="M16,4A12,12,0,1,1,4,16,12.0136,12.0136,0,0,1,16,4m0-2A14,14,0,1,0,30,16,14,14,0,0,0,16,2Z"
+ transform="translate(0)"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32"/>
+ </svg>)
+ if (icon === 'routeConfiguration') return (
+ <svg className="top-icon" width="32" height="32" viewBox="0 0 32 32">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <path
+ d="M28.83 21.17L25 17.37l.67-.67a1 1 0 000-1.41l-6-6a1 1 0 00-1.41 0l-.79.79-6.76-6.79a1 1 0 00-1.41 0l-4 4-.12.15-4 6a1 1 0 00.12 1.26l3 3a1 1 0 001.42 0L10 13.41l2.09 2.09-4.8 4.79a1 1 0 000 1.41l2 2a1 1 0 00.71.3 1 1 0 00.52-.15l4.33-2.6 2.44 2.45a1 1 0 001.41 0l.67-.7 3.79 3.83a4 4 0 005.66-5.66zM10 10.58l-5 5-1.71-1.71 3.49-5.24L10 5.41l6.09 6.09-2.59 2.58zm8 11l-2.84-2.84-5 3-.74-.74L19 11.41 23.59 16zm9.42 3.83a2 2 0 01-2.83 0l-3.8-3.79 2.83-2.83 3.8 3.79a2 2 0 010 [...]
+ <path
+ d="M0 0H32V32H0z"
+ className="cls-1"
+ data-name="<Transparent Rectangle>"
+ ></path>
+ </svg>)
+ if (icon === 'yaml') return (
+ <svg className="top-icon" x="0px" y="0px" width="32px" height="32px"
+ viewBox="0 0 32 32">
+ <style type="text/css">{".st0{fill:none;}"}</style>
+ <title>document</title>
+ <path
+ d="M25.7,9.3l-7-7C18.5,2.1,18.3,2,18,2H8C6.9,2,6,2.9,6,4v24c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V10C26,9.7,25.9,9.5,25.7,9.3 z M18,4.4l5.6,5.6H18V4.4z M24,28H8V4h8v6c0,1.1,0.9,2,2,2h6V28z"/>
+ <rect x="10" y="22" width="12" height="2"/>
+ <rect x="10" y="16" width="12" height="2"/>
+ <rect className="st0" width="32" height="32"/>
+ </svg>)
+ if (icon === 'code') return (
+ <svg className="top-icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1{fill:none;}"}</style>
+ </defs>
+ <title>code</title>
+ <polygon points="31 16 24 23 22.59 21.59 28.17 16 22.59 10.41 24 9 31 16"/>
+ <polygon points="1 16 8 9 9.41 10.41 3.83 16 9.41 21.59 8 23 1 16"/>
+ <rect x="5.91" y="15" width="20.17" height="2" transform="translate(-3.6 27.31) rotate(-75)"/>
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1" width="32"
+ height="32" transform="translate(0 32) rotate(-90)"/>
+ </svg>)
+}
+
+
+export class BeanIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>data--1</title>
+ <rect x="15" y="6" width="13" height="2"/>
+ <rect x="15" y="24" width="13" height="2"/>
+ <rect x="4" y="15" width="13" height="2"/>
+ <path d="M7,11a4,4,0,1,1,4-4A4,4,0,0,1,7,11ZM7,5A2,2,0,1,0,9,7,2,2,0,0,0,7,5Z"
+ transform="translate(0 0)"/>
+ <path d="M7,29a4,4,0,1,1,4-4A4,4,0,0,1,7,29Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,7,23Z"
+ transform="translate(0 0)"/>
+ <path d="M25,20a4,4,0,1,1,4-4A4,4,0,0,1,25,20Zm0-6a2,2,0,1,0,2,2A2,2,0,0,0,25,14Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class DependencyIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32" id="icon">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>application</title>
+ <path d="M16,18H6a2,2,0,0,1-2-2V6A2,2,0,0,1,6,4H16a2,2,0,0,1,2,2V16A2,2,0,0,1,16,18ZM6,6V16H16V6Z"
+ transform="translate(0 0)"/>
+ <path d="M26,12v4H22V12h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V12a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M26,22v4H22V22h4m0-2H22a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <path d="M16,22v4H12V22h4m0-2H12a2,2,0,0,0-2,2v4a2,2,0,0,0,2,2h4a2,2,0,0,0,2-2V22a2,2,0,0,0-2-2Z"
+ transform="translate(0 0)"/>
+ <g id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>">
+ <rect className="cls-1" width="32" height="32"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class RestIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
+ <g className="layer">
+ <title>Layer 1</title>
+ <path
+ d="m23.50007,22l-0.5,0l0,-2l0.5,0a4.4975,4.4975 0 0 0 0.3564,-8.981l-0.8154,-0.0639l-0.0986,-0.812a6.9938,6.9938 0 0 0 -13.8838,0l-0.0991,0.812l-0.8155,0.0639a4.4975,4.4975 0 0 0 0.356,8.981l0.5,0l0,2l-0.5,0a6.4973,6.4973 0 0 1 -1.3,-12.8638a8.9943,8.9943 0 0 1 17.6006,0a6.4974,6.4974 0 0 1 -1.3006,12.8638z"
+ id="svg_1"/>
+ <path
+ d="m22.9724,22.26637l0,-2l-2.1011,0a4.9678,4.9678 0 0 0 -0.7319,-1.7529l1.49,-1.49l-1.414,-1.414l-1.49,1.49a4.9678,4.9678 0 0 0 -1.753,-0.732l0,-2.1011l-2,0l0,2.1011a4.9678,4.9678 0 0 0 -1.7529,0.7319l-1.49,-1.49l-1.414,1.414l1.49,1.49a4.9678,4.9678 0 0 0 -0.732,1.753l-2.1011,0l0,2l2.1011,0a4.9678,4.9678 0 0 0 0.7319,1.7529l-1.49,1.49l1.414,1.414l1.49,-1.49a4.9678,4.9678 0 0 0 1.753,0.732l0,2.1011l2,0l0,-2.1011a4.9678,4.9678 0 0 0 1.7529,-0.7319l1.49,1.49l1.414,-1 [...]
+ id="svg_2" transform="rotate(25 15.9724 21.2664)" xmlns="http://www.w3.org/2000/svg"/>
+ </g>
+ </svg>
+ )
+ }
+}
+
+export class ConceptIcon extends React.Component<any> {
+
+ render() {
+ return (
+ <svg className="icon" width="32px" height="32px" viewBox="0 0 32 32">
+ <defs>
+ <style>{".cls-1 {fill: none;}"}</style>
+ </defs>
+ <title>concept</title>
+ <path
+ d="M20.8851,19.4711a5.9609,5.9609,0,0,0,0-6.9422L23,10.4141l1.293,1.2929a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414l-4-4a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414L21.5859,9l-2.1148,2.1149a5.9609,5.9609,0,0,0-6.9422,0L10,8.5859V2H2v8H8.5859l2.529,2.5289a5.9609,5.9609,0,0,0,0,6.9422L9,21.5859,7.707,20.293a.9994.9994,0,0,0-1.414,0l-4,4a.9994.9994,0,0,0,0,1.414l4,4a.9995.9995,0,0,0,1.414,0l4-4a.9994.9994,0,0,0,0-1.414L10.4141,23l2.1148-2.1149a5.960 [...]
+ <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" className="cls-1"
+ width="32" height="32"/>
+ </svg>
+ )
+ }
+}
\ No newline at end of file
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/templates/TemplatesDesigner.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/templates/TemplatesDesigner.tsx
deleted file mode 100644
index ffc5d9d9..00000000
--- a/karavan-web/karavan-app/src/main/webui/src/designer/templates/TemplatesDesigner.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You 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 React from 'react';
-import {
- EmptyState, EmptyStateBody, EmptyStateIcon,
- PageSection, EmptyStateHeader,
-} from '@patternfly/react-core';
-import '../karavan.css';
-import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefinition";
-import CubesIcon from '@patternfly/react-icons/dist/esm/icons/cubes-icon';
-
-interface Props {
- onSave?: (integration: Integration, propertyOnly: boolean) => void
- integration: Integration
- dark: boolean
-}
-
-interface State {
- integration: Integration
- selectedStep?: CamelElement
- key: string
- propertyOnly: boolean
-}
-
-export class TemplatesDesigner extends React.Component<Props, State> {
-
- public state: State = {
- integration: this.props.integration,
- key: "",
- propertyOnly: false
- };
-
- componentDidUpdate = (prevProps: Readonly<Props>, prevState: Readonly<State>, snapshot?: any) => {
- if (prevState.key !== this.state.key) {
- this.props.onSave?.call(this, this.state.integration, this.state.propertyOnly);
- }
- }
-
- onIntegrationUpdate = (i: Integration) => {
- this.setState({integration: i, key: Math.random().toString()});
- }
-
- render() {
- return (
- <PageSection className="templates-page" isFilled padding={{default: 'noPadding'}}>
- <div className="templates-page-columns">
- <EmptyState>
- <EmptyStateHeader titleText="Templates" icon={<EmptyStateIcon icon={CubesIcon} />} headingLevel="h4" />
- <EmptyStateBody>
- Templates not implemented yet
- </EmptyStateBody>
- </EmptyState>
- </div>
- </PageSection>
- );
- }
-}
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx
index ac791920..86dc6c58 100644
--- a/karavan-web/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx
+++ b/karavan-web/karavan-app/src/main/webui/src/designer/utils/CamelUi.tsx
@@ -29,22 +29,18 @@ import {
} from "karavan-core/lib/model/CamelDefinition";
import {CamelElement, Integration} from "karavan-core/lib/model/IntegrationDefinition";
import {
- ActivemqIcon,
- AggregateIcon,
- ApiIcon,
+ ActivemqIcon, ApiIcon,
AwsIcon,
AzureIcon,
BlockchainIcon,
CassandraIcon,
ChatIcon,
- ChoiceIcon,
CloudIcon,
ClusterIcon,
DatabaseIcon,
DebeziumIcon,
DocumentIcon,
FileIcon,
- FilterIcon,
GithubIcon,
GitIcon,
GoogleCloudIcon,
@@ -54,9 +50,6 @@ import {
HttpIcon,
IgniteIcon,
InfinispanIcon,
- Intercept,
- InterceptFrom,
- InterceptSendToEndpoint,
IotIcon,
KafkaIcon,
KubernetesIcon,
@@ -66,29 +59,37 @@ import {
MobileIcon,
MonitoringIcon,
NetworkingIcon,
- OnCompletion,
OpenshiftIcon,
OpenstackIcon,
RedisIcon,
RefIcon,
RpcIcon,
- SagaIcon,
SapIcon,
SchedulingIcon,
ScriptIcon,
SearchIcon,
SocialIcon,
- SortIcon,
- SplitIcon,
SpringIcon,
TerminalIcon,
TestingIcon,
- ToIcon,
TransformationIcon,
ValidationIcon,
WebserviceIcon,
WorkflowIcon
-} from "./KaravanIcons";
+} from "../icons/ComponentIcons";
+import {
+ AggregateIcon,
+ ChoiceIcon,
+ FilterIcon,
+ Intercept,
+ InterceptFrom,
+ InterceptSendToEndpoint,
+ OnCompletion,
+ SagaIcon,
+ SortIcon,
+ SplitIcon,
+ ToIcon,
+} from "../icons/EipIcons";
import React from "react";
import {TopologyUtils} from "karavan-core/lib/api/TopologyUtils";
import {CamelDisplayUtil} from "karavan-core/lib/api/CamelDisplayUtil";
diff --git a/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanComponents.tsx b/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanComponents.tsx
deleted file mode 100644
index faddd84d..00000000
--- a/karavan-web/karavan-app/src/main/webui/src/designer/utils/KaravanComponents.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You 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 React from 'react';
-import {FormGroup, TextInput, Title} from "@patternfly/react-core";
-import {Integration} from "karavan-core/lib/model/IntegrationDefinition";
-
-interface Props {
- integration: Integration,
-}
-
-export class IntegrationHeader extends React.Component<Props> {
-
- render() {
- return (
- <div className="headers">
- <Title headingLevel="h1" size="md">Integration</Title>
- {/*<FormGroup label="Title" fieldId="title" isRequired>*/}
- {/* <TextInput className="text-field" type="text" id="title" name="title" isReadOnly*/}
- {/* value={*/}
- {/* CamelUi.titleFromName(this.props.integration.metadata.name)*/}
- {/* }/>*/}
- {/*</FormGroup>*/}
- <FormGroup label="Name" fieldId="name" isRequired>
- <TextInput className="text-field" type="text" id="name" name="name"
- value={this.props.integration.metadata.name} readOnlyVariant="default"/>
- </FormGroup>
- </div>
- )
- }
-}
diff --git a/karavan-web/karavan-app/src/main/webui/src/topology/CustomNode.tsx b/karavan-web/karavan-app/src/main/webui/src/topology/CustomNode.tsx
index 2d87457d..fb517ae9 100644
--- a/karavan-web/karavan-app/src/main/webui/src/topology/CustomNode.tsx
+++ b/karavan-web/karavan-app/src/main/webui/src/topology/CustomNode.tsx
@@ -19,7 +19,7 @@ import * as React from 'react';
import {RegionsIcon} from '@patternfly/react-icons';
import {DefaultNode, observer} from '@patternfly/react-topology';
-import {getDesignerIcon} from "../designer/utils/KaravanIcons";
+import {getDesignerIcon} from "../designer/icons/KaravanIcons";
import {CamelUi} from "../designer/utils/CamelUi";
import './topology.css';
diff --git a/karavan-web/karavan-app/src/main/webui/src/topology/TopologyTab.tsx b/karavan-web/karavan-app/src/main/webui/src/topology/TopologyTab.tsx
index 520bf8d2..306ca8fb 100644
--- a/karavan-web/karavan-app/src/main/webui/src/topology/TopologyTab.tsx
+++ b/karavan-web/karavan-app/src/main/webui/src/topology/TopologyTab.tsx
@@ -68,6 +68,7 @@ export function TopologyTab (props: Props) {
}
const controller = React.useMemo(() => {
+ console.log(props.files)
const model = getModel(props.files);
const newController = new Visualization();
newController.registerLayoutFactory((_, graph) => new DagreLayout(graph));