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 8040929a revert pull/#1314
8040929a is described below
commit 8040929ac65dace0c6fe8b81e88a66211b41f420
Author: Marat Gubaidullin <[email protected]>
AuthorDate: Thu Jun 13 18:06:44 2024 -0400
revert pull/#1314
---
.../src/main/webui/src/designer/karavan.css | 42 +-
.../property/property/DslPropertyField.tsx | 35 +-
.../property/property/KameletPropertyField.tsx | 24 +-
karavan-designer/src/designer/karavan.css | 665 +++++++++++----------
.../property/property/DslPropertyField.tsx | 35 +-
.../property/property/KameletPropertyField.tsx | 24 +-
6 files changed, 421 insertions(+), 404 deletions(-)
diff --git a/karavan-app/src/main/webui/src/designer/karavan.css
b/karavan-app/src/main/webui/src/designer/karavan.css
index 0b2bf425..99a0392d 100644
--- a/karavan-app/src/main/webui/src/designer/karavan.css
+++ b/karavan-app/src/main/webui/src/designer/karavan.css
@@ -146,7 +146,6 @@
height: 160px;
}
-
.kamelets-page .kamelet-card .pf-v5-c-card__header {
padding-top: var(--pf-v5-global--spacer--sm);
}
@@ -189,12 +188,13 @@
padding: 5px;
display: flex;
flex-direction: row;
- justify-content:flex-end;
+ justify-content: flex-end;
}
-.kamelets-page .kamelet-card .header-labels .pf-v5-c-card__header-main{
+
+.kamelets-page .kamelet-card .header-labels .pf-v5-c-card__header-main {
display: flex;
flex-direction: row;
- justify-content:space-between;
+ justify-content: space-between;
}
.kamelets-page .kamelet-card .footer-labels {
@@ -320,7 +320,12 @@
min-width: 0px;
}
-.karavan .page .main-tabs-wrapper .main-tabs .pf-v5-c-tabs__link
.pf-v5-c-tabs__item-icon {
+.karavan
+.page
+.main-tabs-wrapper
+.main-tabs
+.pf-v5-c-tabs__link
+.pf-v5-c-tabs__item-icon {
height: 24px;
margin-right: 0;
}
@@ -416,8 +421,8 @@
.karavan .dsl-page .graph .connections .path-incoming {
stroke-dasharray: 5;
- -webkit-animation: dashdraw .5s linear infinite;
- animation: dashdraw .5s linear infinite;
+ -webkit-animation: dashdraw 0.5s linear infinite;
+ animation: dashdraw 0.5s linear infinite;
stroke: var(--pf-v5-global--Color--200);
stroke-width: 1;
fill: transparent;
@@ -442,15 +447,15 @@
.karavan .dsl-page .graph .connections .path-seda {
stroke-dasharray: 2;
stroke: var(--pf-v5-global--Color--200);
- -webkit-animation: dashdraw .5s linear infinite;
- animation: dashdraw .5s linear infinite;
+ -webkit-animation: dashdraw 0.5s linear infinite;
+ animation: dashdraw 0.5s linear infinite;
stroke-width: 1;
fill: transparent;
}
@keyframes dashdraw {
0% {
- stroke-dashoffset: 10
+ stroke-dashoffset: 10;
}
}
@@ -514,7 +519,6 @@
margin: 0 auto 3px auto;
}
-
.element-builder:hover .add-button,
.karavan .step-element:hover .add-element-button,
.karavan .step-element:hover .add-button {
@@ -548,7 +552,6 @@
overflow-wrap: anywhere;
}
-
/*Beans*/
.karavan .rest-page .properties .bean-properties .pf-v5-c-form__group-control {
display: flex;
@@ -616,7 +619,6 @@
padding: 0;
}
-
.karavan .project-builder .card-header svg {
margin-right: 6px;
}
@@ -710,15 +712,15 @@
background-color: var(--pf-v5-global--BackgroundColor--light-300);
margin-bottom: 100px;
}
-.karavan .knowledbase-eip-section .pf-v5-c-toggle-group{
- margin:16px;
-}
+.karavan .knowledbase-eip-section .pf-v5-c-toggle-group {
+ margin: 16px;
+}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
- margin: 0;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ margin: 0;
}
\ No newline at end of file
diff --git
a/karavan-app/src/main/webui/src/designer/property/property/DslPropertyField.tsx
b/karavan-app/src/main/webui/src/designer/property/property/DslPropertyField.tsx
index 32d2d269..db35ddb4 100644
---
a/karavan-app/src/main/webui/src/designer/property/property/DslPropertyField.tsx
+++
b/karavan-app/src/main/webui/src/designer/property/property/DslPropertyField.tsx
@@ -361,21 +361,22 @@ export function DslPropertyField(props: Props) {
<InputGroupItem isFill>
<TextInput ref={ref}
className="text-field" isRequired
- type={property.secret ? "password" : isNumber ?
"number" : "text"}
+ type={property.secret ? "password" : "text"}
id={property.name} name={property.name}
value={textValue?.toString()}
customIcon={property.type !== 'string' ?
<Text
component={TextVariants.p}>{property.type}</Text> : undefined}
onBlur={_ => {
- if (isNumber) {
- propertyChanged(property.name,
textValue ? Number(textValue):'')
+ if (isNumber && isNumeric((textValue))) {
+ propertyChanged(property.name,
Number(textValue))
} else if (!isNumber) {
propertyChanged(property.name,
textValue)
}
}}
onFocus={_ => setCheckChanges(true)}
onChange={(_, v) => {
- if (isNumber) {
+
+ if (isNumber && isNumeric(v)) {
setTextValue(v);
setCheckChanges(true);
} else if (!isNumber) {
@@ -402,10 +403,10 @@ export function DslPropertyField(props: Props) {
title={property.displayName}
onClose={() => setShowEditor(false)}
onSave={(fieldId, value1) => {
- propertyChanged(property.name, value1)
- setTextValue(value1);
- setShowEditor(false);
- }}/>
+ propertyChanged(property.name,
value1)
+ setTextValue(value1);
+ setShowEditor(false);
+ }}/>
</InputGroupItem>}
</InputGroup>
}
@@ -456,10 +457,10 @@ export function DslPropertyField(props: Props) {
title="Java Class"
onClose={() => setShowEditor(false)}
onSave={(fieldId, value1) => {
- propertyChanged(fieldId, value);
- InfrastructureAPI.onSaveCustomCode?.(value,
value1);
- setShowEditor(false)
- }}/>
+ propertyChanged(fieldId, value);
+
InfrastructureAPI.onSaveCustomCode?.(value, value1);
+ setShowEditor(false)
+ }}/>
</InputGroupItem>}
</InputGroup>)
}
@@ -499,10 +500,10 @@ export function DslPropertyField(props: Props) {
title={`Expression
(${dslLanguage?.[0]})`}
onClose={() => setShowEditor(false)}
onSave={(fieldId, value1) => {
- propertyChanged(fieldId, value1);
- setTextValue(value1);
- setShowEditor(false);
- }}/>
+ propertyChanged(fieldId,
value1);
+ setTextValue(value1);
+ setShowEditor(false);
+ }}/>
</InputGroupItem>}
</InputGroup>
)
@@ -1015,4 +1016,4 @@ export function DslPropertyField(props: Props) {
{getInfrastructureSelectorModal()}
</div>
)
-}
+}
\ No newline at end of file
diff --git
a/karavan-app/src/main/webui/src/designer/property/property/KameletPropertyField.tsx
b/karavan-app/src/main/webui/src/designer/property/property/KameletPropertyField.tsx
index f8cfd07c..c17a6e05 100644
---
a/karavan-app/src/main/webui/src/designer/property/property/KameletPropertyField.tsx
+++
b/karavan-app/src/main/webui/src/designer/property/property/KameletPropertyField.tsx
@@ -208,9 +208,9 @@ export function KameletPropertyField(props: Props) {
</InputGroup>
}
- // function isNumeric (num: any) {
- // return (typeof(num) === 'number' || (typeof(num) === "string" &&
num.trim() !== '')) && !isNaN(num as number);
- // }
+ function isNumeric (num: any) {
+ return (typeof(num) === 'number' || (typeof(num) === "string" &&
num.trim() !== '')) && !isNaN(num as number);
+ }
function getNumberInput() {
return (
@@ -218,16 +218,22 @@ export function KameletPropertyField(props: Props) {
name={id}
className="text-field"
isRequired
- type='number'
+ // type='number'
value={textValue?.toString()}
customIcon={<Text
component={TextVariants.p}>{property.type}</Text>}
- onBlur={(_) => {
- parametersChanged(property.id, Number(textValue))
+ onBlur={_ => {
+ if (isNumeric((textValue))) {
+ parametersChanged(property.id,
Number(textValue))
+ }
}}
onChange={(_, v) => {
- setTextValue(v);
- setCheckChanges(true);
- }}
+ if (isNumeric(v)) {
+ setTextValue(v);
+ setCheckChanges(true);
+ } else {
+ setTextValue(textValue);
+ }
+ }}
/>
)
}
diff --git a/karavan-designer/src/designer/karavan.css
b/karavan-designer/src/designer/karavan.css
index d1e8dd1c..99a0392d 100644
--- a/karavan-designer/src/designer/karavan.css
+++ b/karavan-designer/src/designer/karavan.css
@@ -15,563 +15,564 @@
* limitations under the License.
*/
:root {
- --pf-v5-global--FontSize--md: 14px;
+ --pf-v5-global--FontSize--md: 14px;
}
.karavan .tools-section {
- padding-top: 0px;
- padding-bottom: 0px;
- padding-right: 0;
- border-bottom: 1px solid #eee;
- background-color: white;
+ padding-top: 0px;
+ padding-bottom: 0px;
+ padding-right: 0;
+ border-bottom: 1px solid #eee;
+ background-color: white;
}
.karavan .tools-section .dsl-title {
- display: flex;
- flex-direction: row;
+ display: flex;
+ flex-direction: row;
}
.karavan .tools-section .dsl-title .title {
- margin-right: 16px;
+ margin-right: 16px;
}
.karavan .tools-section .tools .header {
- display: flex;
- flex-direction: row;
+ display: flex;
+ flex-direction: row;
}
.karavan .tools-section .tools .header .labels {
- height: fit-content;
- margin-left: 3px;
+ height: fit-content;
+ margin-left: 3px;
}
.karavan .brand {
- height: 36px;
+ height: 36px;
}
.karavan .pf-v5-c-switch__input:focus ~ .pf-v5-c-switch__toggle,
.pf-v5-c-modal-box .pf-v5-c-switch__input:focus ~ .pf-v5-c-switch__toggle {
- outline: transparent;
- outline-offset: 0;
+ outline: transparent;
+ outline-offset: 0;
}
.karavan .header-button {
- margin-left: var(--pf-v5-c-page__header-tools--MarginRight);
+ margin-left: var(--pf-v5-c-page__header-tools--MarginRight);
}
.karavan .page-header {
- display: flex;
- justify-content: space-between;
+ display: flex;
+ justify-content: space-between;
}
.karavan .page-header .top-toolbar .pf-v5-c-page__header-tools {
- margin-right: 0;
+ margin-right: 0;
}
.karavan .page-header .top-toolbar {
- width: 100%;
+ width: 100%;
}
.karavan .page-header .pf-v5-c-page__header-brand {
- padding-right: 16px;
+ padding-right: 16px;
}
.filler {
- width: 100%;
+ width: 100%;
}
.modal-footer {
- width: 100%;
+ width: 100%;
}
.modal-footer .deploy-buttons .pf-v5-c-form__actions {
- justify-content: flex-end;
- margin-top: 16px;
+ justify-content: flex-end;
+ margin-top: 16px;
}
.modal-footer .deploy-buttons .pf-v5-c-button {
- margin-left: 16px;
+ margin-left: 16px;
}
.action-buttons .pf-v5-c-form__actions {
- justify-content: flex-end;
- margin-top: 16px;
+ justify-content: flex-end;
+ margin-top: 16px;
}
.action-buttons .pf-v5-c-button {
- margin-left: 16px;
+ margin-left: 16px;
}
.pf-v5-c-modal-box__footer .hidden {
- display: none;
+ display: none;
}
.upload-buttons .pf-v5-c-form__actions {
- margin-top: 20px;
- justify-content: flex-end;
+ margin-top: 20px;
+ justify-content: flex-end;
}
/*integration page*/
.integration-page .integration-card {
- cursor: pointer;
- height: 160px;
+ cursor: pointer;
+ height: 160px;
}
.integration-page .integration-card .pf-v5-c-card__header {
- padding-right: 6px;
+ padding-right: 6px;
}
.integration-page .integration-card .icon {
- height: 24px;
+ height: 24px;
}
.integration-page .integration-card .delete-button {
- font-size: 17px;
- line-height: 1;
- border: 0;
- padding: 0;
- margin: 0;
- background: transparent;
- color: #b1b1b7;
- visibility: hidden;
+ font-size: 17px;
+ line-height: 1;
+ border: 0;
+ padding: 0;
+ margin: 0;
+ background: transparent;
+ color: #b1b1b7;
+ visibility: hidden;
}
.integration-page .integration-card:hover .delete-button {
- visibility: visible;
+ visibility: visible;
}
/*kamelets*/
.kamelets-page .kamelet-card {
- cursor: pointer;
- height: 160px;
+ cursor: pointer;
+ height: 160px;
}
.kamelets-page .kamelet-card .pf-v5-c-card__header {
- padding-top: var(--pf-v5-global--spacer--sm);
+ padding-top: var(--pf-v5-global--spacer--sm);
}
.kamelets-page .kamelet-card .pf-v5-c-card__header .custom {
- margin-left: auto;
+ margin-left: auto;
}
.kamelets-page .kamelet-card .pf-v5-c-card__header .pf-v5-c-card__header-main {
- display: flex;
- flex-direction: row;
+ display: flex;
+ flex-direction: row;
}
.kamelets-page .kamelet-card .pf-v5-c-card__title {
- font-size: 15px;
- font-weight: 400;
+ font-size: 15px;
+ font-weight: 400;
}
.kamelets-page .kamelet-card .pf-v5-c-card__body {
- overflow: hidden;
- position: relative;
- line-height: 1.6em;
+ overflow: hidden;
+ position: relative;
+ line-height: 1.6em;
}
.kamelets-page .kamelet-card .icon {
- height: 24px;
- max-width: 24px;
- margin-top: auto;
- margin-bottom: auto;
- margin-right: 5px;
- border: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- -o-user-select: none;
- user-select: none;
+ height: 24px;
+ max-width: 24px;
+ margin-top: auto;
+ margin-bottom: auto;
+ margin-right: 5px;
+ border: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -o-user-select: none;
+ user-select: none;
}
.kamelets-page .kamelet-card .header-labels {
- padding: 5px;
- display: flex;
- flex-direction: row;
- justify-content: flex-end;
+ padding: 5px;
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-end;
}
+
.kamelets-page .kamelet-card .header-labels .pf-v5-c-card__header-main {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
}
.kamelets-page .kamelet-card .footer-labels {
- padding: 5px;
- display: flex;
- flex-direction: row;
- justify-content: space-between;
+ padding: 5px;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
}
.kamelets-page .kamelet-card .version,
.kamelets-page .kamelet-card .support-type,
.kamelets-page .kamelet-card .support-level {
- white-space: nowrap;
+ white-space: nowrap;
}
.kamelets-page .kamelet-card .labels {
- opacity: 0.5;
- font-weight: 200;
+ opacity: 0.5;
+ font-weight: 200;
}
.kamelets-page .kamelet-card:hover .labels {
- opacity: 1;
+ opacity: 1;
}
/*kamelet modal*/
.kamelet-modal-card .pf-v5-c-card__header {
- padding-right: 6px;
- display: flex;
- justify-content: space-between;
+ padding-right: 6px;
+ display: flex;
+ justify-content: space-between;
}
.kamelet-modal-card .pf-v5-c-card__title {
- font-weight: 600;
+ font-weight: 600;
}
.kamelet-modal-card .description {
- overflow: hidden;
- position: relative;
- max-width: 600px;
+ overflow: hidden;
+ position: relative;
+ max-width: 600px;
}
.kamelet-modal-card .icon {
- height: 36px;
- width: 36px;
- margin-top: auto;
- margin-bottom: auto;
- border: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- -o-user-select: none;
- user-select: none;
+ height: 36px;
+ width: 36px;
+ margin-top: auto;
+ margin-bottom: auto;
+ border: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -o-user-select: none;
+ user-select: none;
}
.karavan .page {
- height: 100vh;
- width: 100%;
- overflow: hidden;
- display: flex;
- flex-direction: column;
+ height: 100vh;
+ width: 100%;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
}
.karavan main {
- overflow: hidden;
+ overflow: hidden;
}
/*DSL*/
.karavan .dsl-page {
- height: 100%;
+ height: 100%;
}
.karavan .dsl-page .dsl-page-columns {
- display: block;
- height: 100%;
- background: #fafafa;
- padding-bottom: 66px;
+ display: block;
+ height: 100%;
+ background: #fafafa;
+ padding-bottom: 66px;
}
.karavan .top-icon {
- height: 24px;
+ height: 24px;
}
.karavan .designer-page {
- display: flex;
- flex-direction: column;
- height: 100%;
+ display: flex;
+ flex-direction: column;
+ height: 100%;
}
.karavan .designer-page .project-page-section {
- background-color: white;
+ background-color: white;
}
.karavan .page .main-tabs-wrapper {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- align-items: center;
- position: relative;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
+ position: relative;
}
.karavan .page .main-tabs-wrapper::before {
- content: "";
- position: absolute;
- right: 0;
- bottom: 0;
- left: 0;
- border: solid;
- border-width: 0 0 var(--pf-v5-global--BorderWidth--sm) 0;
- border-bottom-color: var(--pf-v5-global--BorderColor--100);
+ content: "";
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ border: solid;
+ border-width: 0 0 var(--pf-v5-global--BorderWidth--sm) 0;
+ border-bottom-color: var(--pf-v5-global--BorderColor--100);
}
.karavan .page .main-tabs-wrapper .main-tabs .top-menu-item {
- display: flex;
- flex-direction: row;
+ display: flex;
+ flex-direction: row;
}
.karavan .page .main-tabs-wrapper .main-tabs .top-menu-item .count {
- background: var(--pf-v5-global--active-color--100);
- color: white;
- height: fit-content;
- margin-top: auto;
- margin-bottom: auto;
- min-width: 0px;
+ background: var(--pf-v5-global--active-color--100);
+ color: white;
+ height: fit-content;
+ margin-top: auto;
+ margin-bottom: auto;
+ min-width: 0px;
}
.karavan
- .page
- .main-tabs-wrapper
- .main-tabs
- .pf-v5-c-tabs__link
- .pf-v5-c-tabs__item-icon {
- height: 24px;
- margin-right: 0;
+.page
+.main-tabs-wrapper
+.main-tabs
+.pf-v5-c-tabs__link
+.pf-v5-c-tabs__item-icon {
+ height: 24px;
+ margin-right: 0;
}
.karavan .page .main-tabs-wrapper .main-tabs .pf-v5-c-tabs__item-text {
- font-weight: bold;
- margin-top: auto;
- margin-bottom: auto;
- margin-right: 6px;
+ font-weight: bold;
+ margin-top: auto;
+ margin-bottom: auto;
+ margin-right: 6px;
}
.karavan .designer-page .page .main-tabs-wrapper .hide-log {
- white-space: nowrap;
- margin-right: 16px;
+ white-space: nowrap;
+ margin-right: 16px;
}
/*Properties*/
.karavan .dsl-page .properties {
- padding: 10px 10px 10px 10px;
- background: transparent;
- width: 100%;
- height: 100%;
- overflow: auto;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- margin-bottom: 20px;
- padding-bottom: 30px;
+ padding: 10px 10px 10px 10px;
+ background: transparent;
+ width: 100%;
+ height: 100%;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ margin-bottom: 20px;
+ padding-bottom: 30px;
}
.karavan .pf-v5-c-drawer__splitter {
- width: 2px;
- background-color: #fcfcfc;
+ width: 2px;
+ background-color: #fcfcfc;
}
.karavan .pf-v5-c-drawer__splitter-handle {
- display: none;
+ display: none;
}
/*Graph*/
.karavan .dsl-page .graph {
- display: block;
- flex-direction: column;
- height: 100%;
- width: 100%;
- position: relative;
- overflow-y: auto;
+ display: block;
+ flex-direction: column;
+ height: 100%;
+ width: 100%;
+ position: relative;
+ overflow-y: auto;
}
.karavan .dsl-page .flows {
- width: 100%;
- position: absolute;
- padding-bottom: 66px;
+ width: 100%;
+ position: absolute;
+ padding-bottom: 66px;
}
.karavan .dsl-page .flows .add-flow {
- margin-top: 16px;
- display: flex;
- justify-content: center;
- gap: 6px;
+ margin-top: 16px;
+ display: flex;
+ justify-content: center;
+ gap: 6px;
}
/*connections*/
.karavan .dsl-page .graph .connections {
- position: absolute;
- top: 0;
- left: 0;
- background: transparent;
+ position: absolute;
+ top: 0;
+ left: 0;
+ background: transparent;
}
.karavan .dsl-page .graph .connections .icon {
- height: 20px;
- width: 20px;
+ height: 20px;
+ width: 20px;
}
.karavan .dsl-page .graph .connections .arrow {
- stroke: var(--pf-v5-global--Color--200);
- fill: var(--pf-v5-global--Color--200);
+ stroke: var(--pf-v5-global--Color--200);
+ fill: var(--pf-v5-global--Color--200);
}
.karavan .dsl-page .graph .connections .path {
- stroke: var(--pf-v5-global--Color--200);
- stroke-width: 1;
- fill: transparent;
+ stroke: var(--pf-v5-global--Color--200);
+ stroke-width: 1;
+ fill: transparent;
}
.karavan .dsl-page .graph .connections .circle-outgoing,
.karavan .dsl-page .graph .connections .circle-incoming {
- stroke: var(--pf-v5-global--Color--200);
- stroke-width: 1;
- fill: white;
+ stroke: var(--pf-v5-global--Color--200);
+ stroke-width: 1;
+ fill: white;
}
.karavan .dsl-page .graph .connections .path-incoming {
- stroke-dasharray: 5;
- -webkit-animation: dashdraw 0.5s linear infinite;
- animation: dashdraw 0.5s linear infinite;
- stroke: var(--pf-v5-global--Color--200);
- stroke-width: 1;
- fill: transparent;
+ stroke-dasharray: 5;
+ -webkit-animation: dashdraw 0.5s linear infinite;
+ animation: dashdraw 0.5s linear infinite;
+ stroke: var(--pf-v5-global--Color--200);
+ stroke-width: 1;
+ fill: transparent;
}
.karavan .dsl-page .graph .connections .path-direct {
- stroke-dasharray: 0;
- stroke: var(--pf-v5-global--Color--200);
- stroke-width: 0.7;
- stroke-opacity: 0.7;
- fill: transparent;
+ stroke-dasharray: 0;
+ stroke: var(--pf-v5-global--Color--200);
+ stroke-width: 0.7;
+ stroke-opacity: 0.7;
+ fill: transparent;
}
.karavan .dsl-page .graph .connections .path-direct-selected {
- stroke-dasharray: 0;
- stroke: var(--pf-v5-global--active-color--100);
- stroke-width: 1;
- stroke-opacity: 1;
- fill: transparent;
+ stroke-dasharray: 0;
+ stroke: var(--pf-v5-global--active-color--100);
+ stroke-width: 1;
+ stroke-opacity: 1;
+ fill: transparent;
}
.karavan .dsl-page .graph .connections .path-seda {
- stroke-dasharray: 2;
- stroke: var(--pf-v5-global--Color--200);
- -webkit-animation: dashdraw 0.5s linear infinite;
- animation: dashdraw 0.5s linear infinite;
- stroke-width: 1;
- fill: transparent;
+ stroke-dasharray: 2;
+ stroke: var(--pf-v5-global--Color--200);
+ -webkit-animation: dashdraw 0.5s linear infinite;
+ animation: dashdraw 0.5s linear infinite;
+ stroke-width: 1;
+ fill: transparent;
}
@keyframes dashdraw {
- 0% {
- stroke-dashoffset: 10;
- }
+ 0% {
+ stroke-dashoffset: 10;
+ }
}
.karavan .dsl-page .flows .step-element {
- align-items: center;
- text-align: center;
- display: flex;
- flex-direction: column;
- width: fit-content;
- border-color: var(--pf-v5-global--Color--200);
- border-radius: 42px;
- border-width: 1px;
- min-width: 120px;
- padding: 3px 4px 4px 4px;
- margin: 3px auto 0 auto;
- position: relative;
+ align-items: center;
+ text-align: center;
+ display: flex;
+ flex-direction: column;
+ width: fit-content;
+ border-color: var(--pf-v5-global--Color--200);
+ border-radius: 42px;
+ border-width: 1px;
+ min-width: 120px;
+ padding: 3px 4px 4px 4px;
+ margin: 3px auto 0 auto;
+ position: relative;
}
.karavan {
- --step-border-color: var(--pf-v5-global--Color--200);
- --step-border-color-selected: var(--pf-v5-global--active-color--100);
+ --step-border-color: var(--pf-v5-global--Color--200);
+ --step-border-color-selected: var(--pf-v5-global--active-color--100);
}
.karavan .dsl-page .flows .children {
- display: flex;
- flex-wrap: wrap;
- flex-wrap: nowrap;
- gap: 6px;
+ display: flex;
+ flex-wrap: wrap;
+ flex-wrap: nowrap;
+ gap: 6px;
}
.karavan .dsl-page .flows .has-child {
- display: flex;
- flex-direction: column;
- flex-wrap: nowrap;
- gap: 6px;
+ display: flex;
+ flex-direction: column;
+ flex-wrap: nowrap;
+ gap: 6px;
}
.karavan .dsl-page .flows .hidden-step {
- display: none;
+ display: none;
}
.element-builder .add-button {
- top: 0;
- right: 5px;
- font-size: 15px;
- line-height: 1;
- border: 0;
- padding: 0;
- margin: 3px auto 0 auto;
- background: transparent;
- color: var(--pf-v5-global--primary-color--100);
- visibility: hidden;
- height: 100%;
- display: flex;
- flex-direction: column;
- justify-content: flex-end;
- width: 16px;
+ top: 0;
+ right: 5px;
+ font-size: 15px;
+ line-height: 1;
+ border: 0;
+ padding: 0;
+ margin: 3px auto 0 auto;
+ background: transparent;
+ color: var(--pf-v5-global--primary-color--100);
+ visibility: hidden;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: flex-end;
+ width: 16px;
}
.element-builder .add-button svg {
- margin: 0 auto 3px auto;
+ margin: 0 auto 3px auto;
}
.element-builder:hover .add-button,
.karavan .step-element:hover .add-element-button,
.karavan .step-element:hover .add-button {
- visibility: visible;
+ visibility: visible;
}
.dsl-gallery {
- margin-top: 16px;
+ margin-top: 16px;
}
.move-modal {
- width: 270px !important;
+ width: 270px !important;
}
.move-modal .pf-v5-c-modal-box__body {
- margin-right: 0 !important;
+ margin-right: 0 !important;
}
.move-modal .pf-v5-m-plain {
- display: none;
+ display: none;
}
.yaml-code {
- overflow: auto;
- height: 100%;
- width: 100%;
- padding-bottom: 100px;
+ overflow: auto;
+ height: 100%;
+ width: 100%;
+ padding-bottom: 100px;
}
.pf-v5-c-popover__footer {
- overflow-wrap: anywhere;
+ overflow-wrap: anywhere;
}
/*Beans*/
.karavan .rest-page .properties .bean-properties .pf-v5-c-form__group-control {
- display: flex;
- flex-direction: column;
- gap: 6px;
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
}
.karavan .rest-page .properties .bean-property {
- display: flex;
- flex-direction: row;
- gap: 3px;
+ display: flex;
+ flex-direction: row;
+ gap: 3px;
}
.karavan .rest-page .properties .bean-property .delete-button {
- padding: 3px;
- color: #b1b1b7;
+ padding: 3px;
+ color: #b1b1b7;
}
/*YAML*/
.karavan .yaml-page {
- height: 100px;
+ height: 100px;
}
/*Exception*/
@@ -581,145 +582,145 @@
.karavan .templates-page,
.karavan .exception-page,
.karavan .error-page {
- flex: 1;
- overflow: auto;
+ flex: 1;
+ overflow: auto;
}
.karavan .templates-page-columns,
.karavan .exception-page-columns,
.karavan .error-page-columns {
- height: 100%;
- background: #fafafa;
+ height: 100%;
+ background: #fafafa;
}
.karavan .templates-page-columns .pf-v5-c-empty-state,
.karavan .exception-page-columns .pf-v5-c-empty-state,
.karavan .error-page-columns .pf-v5-c-empty-state {
- margin: auto;
- height: 100%;
+ margin: auto;
+ height: 100%;
}
/* Help */
.dont-show {
- margin-right: auto;
+ margin-right: auto;
}
/* Project Tools */
.karavan .project-builder {
- height: 100%;
+ height: 100%;
}
.karavan .project-builder .tools-section {
- padding-left: 10px;
- padding-right: 10px;
+ padding-left: 10px;
+ padding-right: 10px;
}
.karavan .project-builder .pf-v5-c-toolbar__content {
- padding: 0;
+ padding: 0;
}
.karavan .project-builder .card-header svg {
- margin-right: 6px;
+ margin-right: 6px;
}
.karavan .project-builder .card-disabled {
- opacity: 0.4;
+ opacity: 0.4;
}
.karavan .project-builder .pf-v5-c-form {
- --pf-v5-c-form--GridGap: 1em;
+ --pf-v5-c-form--GridGap: 1em;
}
.karavan .project-builder .pf-v5-c-card__body {
- --pf-v5-c-card--child--PaddingRight: 0.5em;
- --pf-v5-c-card--child--PaddingBottom: 1em;
- --pf-v5-c-card--child--PaddingLeft: 1em;
+ --pf-v5-c-card--child--PaddingRight: 0.5em;
+ --pf-v5-c-card--child--PaddingBottom: 1em;
+ --pf-v5-c-card--child--PaddingLeft: 1em;
}
.karavan .project-builder .pf-v5-c-card__header {
- --pf-v5-c-card--first-child--PaddingTop: 0.5em;
+ --pf-v5-c-card--first-child--PaddingTop: 0.5em;
}
.karavan .project-builder .center {
- height: 100%;
- width: 100%;
- display: flex;
- flex-direction: row;
- gap: 10px;
- padding: 10px;
+ height: 100%;
+ width: 100%;
+ display: flex;
+ flex-direction: row;
+ gap: 10px;
+ padding: 10px;
}
.karavan .project-builder .center-column {
- width: 100%;
- display: flex;
- flex-direction: column;
- gap: 10px;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
}
.karavan .project-builder .footer {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- padding: 10px;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ padding: 10px;
}
.karavan .project-builder .footer .progress {
- flex-grow: 4;
+ flex-grow: 4;
}
.karavan .project-builder .footer .buttons {
- height: 60px;
- display: flex;
- flex-direction: column;
- justify-content: space-around;
+ height: 60px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-around;
}
.karavan .project-builder .project-properties td {
- padding: 0;
- margin: 0;
+ padding: 0;
+ margin: 0;
}
.karavan .project-builder .project-properties td,
.karavan .project-builder .project-properties tr {
- border: none;
+ border: none;
}
.karavan .project-builder .project-properties .delete-button {
- padding: 0 0 0 6px;
- margin: 0;
+ padding: 0 0 0 6px;
+ margin: 0;
}
.karavan .project-builder .add-button {
- width: fit-content;
- margin-top: 6px;
+ width: fit-content;
+ margin-top: 6px;
}
.root .tooltip-required-field .pf-v5-c-tooltip__content {
- text-align: start;
+ text-align: start;
}
.karavan .kamelet-section {
- display: flex;
- flex-direction: column;
- height: 100%;
+ display: flex;
+ flex-direction: column;
+ height: 100%;
}
.karavan .kamelets-page {
- overflow: auto;
- flex-shrink: unset;
- flex-grow: 1;
- background-color: var(--pf-v5-global--BackgroundColor--light-300);
- margin-bottom: 100px;
+ overflow: auto;
+ flex-shrink: unset;
+ flex-grow: 1;
+ background-color: var(--pf-v5-global--BackgroundColor--light-300);
+ margin-bottom: 100px;
}
+
.karavan .knowledbase-eip-section .pf-v5-c-toggle-group {
- margin: 16px;
+ margin: 16px;
}
-
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
- margin: 0;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ margin: 0;
}
\ No newline at end of file
diff --git
a/karavan-designer/src/designer/property/property/DslPropertyField.tsx
b/karavan-designer/src/designer/property/property/DslPropertyField.tsx
index 32d2d269..db35ddb4 100644
--- a/karavan-designer/src/designer/property/property/DslPropertyField.tsx
+++ b/karavan-designer/src/designer/property/property/DslPropertyField.tsx
@@ -361,21 +361,22 @@ export function DslPropertyField(props: Props) {
<InputGroupItem isFill>
<TextInput ref={ref}
className="text-field" isRequired
- type={property.secret ? "password" : isNumber ?
"number" : "text"}
+ type={property.secret ? "password" : "text"}
id={property.name} name={property.name}
value={textValue?.toString()}
customIcon={property.type !== 'string' ?
<Text
component={TextVariants.p}>{property.type}</Text> : undefined}
onBlur={_ => {
- if (isNumber) {
- propertyChanged(property.name,
textValue ? Number(textValue):'')
+ if (isNumber && isNumeric((textValue))) {
+ propertyChanged(property.name,
Number(textValue))
} else if (!isNumber) {
propertyChanged(property.name,
textValue)
}
}}
onFocus={_ => setCheckChanges(true)}
onChange={(_, v) => {
- if (isNumber) {
+
+ if (isNumber && isNumeric(v)) {
setTextValue(v);
setCheckChanges(true);
} else if (!isNumber) {
@@ -402,10 +403,10 @@ export function DslPropertyField(props: Props) {
title={property.displayName}
onClose={() => setShowEditor(false)}
onSave={(fieldId, value1) => {
- propertyChanged(property.name, value1)
- setTextValue(value1);
- setShowEditor(false);
- }}/>
+ propertyChanged(property.name,
value1)
+ setTextValue(value1);
+ setShowEditor(false);
+ }}/>
</InputGroupItem>}
</InputGroup>
}
@@ -456,10 +457,10 @@ export function DslPropertyField(props: Props) {
title="Java Class"
onClose={() => setShowEditor(false)}
onSave={(fieldId, value1) => {
- propertyChanged(fieldId, value);
- InfrastructureAPI.onSaveCustomCode?.(value,
value1);
- setShowEditor(false)
- }}/>
+ propertyChanged(fieldId, value);
+
InfrastructureAPI.onSaveCustomCode?.(value, value1);
+ setShowEditor(false)
+ }}/>
</InputGroupItem>}
</InputGroup>)
}
@@ -499,10 +500,10 @@ export function DslPropertyField(props: Props) {
title={`Expression
(${dslLanguage?.[0]})`}
onClose={() => setShowEditor(false)}
onSave={(fieldId, value1) => {
- propertyChanged(fieldId, value1);
- setTextValue(value1);
- setShowEditor(false);
- }}/>
+ propertyChanged(fieldId,
value1);
+ setTextValue(value1);
+ setShowEditor(false);
+ }}/>
</InputGroupItem>}
</InputGroup>
)
@@ -1015,4 +1016,4 @@ export function DslPropertyField(props: Props) {
{getInfrastructureSelectorModal()}
</div>
)
-}
+}
\ No newline at end of file
diff --git
a/karavan-designer/src/designer/property/property/KameletPropertyField.tsx
b/karavan-designer/src/designer/property/property/KameletPropertyField.tsx
index f8cfd07c..c17a6e05 100644
--- a/karavan-designer/src/designer/property/property/KameletPropertyField.tsx
+++ b/karavan-designer/src/designer/property/property/KameletPropertyField.tsx
@@ -208,9 +208,9 @@ export function KameletPropertyField(props: Props) {
</InputGroup>
}
- // function isNumeric (num: any) {
- // return (typeof(num) === 'number' || (typeof(num) === "string" &&
num.trim() !== '')) && !isNaN(num as number);
- // }
+ function isNumeric (num: any) {
+ return (typeof(num) === 'number' || (typeof(num) === "string" &&
num.trim() !== '')) && !isNaN(num as number);
+ }
function getNumberInput() {
return (
@@ -218,16 +218,22 @@ export function KameletPropertyField(props: Props) {
name={id}
className="text-field"
isRequired
- type='number'
+ // type='number'
value={textValue?.toString()}
customIcon={<Text
component={TextVariants.p}>{property.type}</Text>}
- onBlur={(_) => {
- parametersChanged(property.id, Number(textValue))
+ onBlur={_ => {
+ if (isNumeric((textValue))) {
+ parametersChanged(property.id,
Number(textValue))
+ }
}}
onChange={(_, v) => {
- setTextValue(v);
- setCheckChanges(true);
- }}
+ if (isNumeric(v)) {
+ setTextValue(v);
+ setCheckChanges(true);
+ } else {
+ setTextValue(textValue);
+ }
+ }}
/>
)
}
