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
commit 68e6880a1c338cdfbf8196d1bd62fe04f6659670 Author: Marat Gubaidullin <ma...@talismancloud.io> AuthorDate: Wed Jan 31 15:31:11 2024 -0500 Fix #1090 --- karavan-designer/src/designer/property/DslProperties.css | 7 +++++++ karavan-designer/src/designer/property/DslProperties.tsx | 8 +++++--- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/karavan-designer/src/designer/property/DslProperties.css b/karavan-designer/src/designer/property/DslProperties.css index c681098c..dd7cb199 100644 --- a/karavan-designer/src/designer/property/DslProperties.css +++ b/karavan-designer/src/designer/property/DslProperties.css @@ -248,3 +248,10 @@ min-height: 6px; } +.karavan .properties .component-headers { + margin-left: 24px; +} + +.karavan .properties .component-headers .pf-v5-c-clipboard-copy.pf-m-inline { + background-color: transparent; +} \ No newline at end of file diff --git a/karavan-designer/src/designer/property/DslProperties.tsx b/karavan-designer/src/designer/property/DslProperties.tsx index 9325ee05..6169d656 100644 --- a/karavan-designer/src/designer/property/DslProperties.tsx +++ b/karavan-designer/src/designer/property/DslProperties.tsx @@ -27,7 +27,7 @@ import { MenuToggleElement, MenuToggle, DropdownList, - DropdownItem, Label, Flex, LabelGroup, Popover, FlexItem, Badge, + DropdownItem, Label, Flex, LabelGroup, Popover, FlexItem, Badge, ClipboardCopy, ClipboardCopyAction, } from '@patternfly/react-core'; import '../karavan.css'; import './DslProperties.css'; @@ -166,11 +166,13 @@ export function DslProperties(props: Props) { <ExpandableSection toggleText='Headers' onToggle={(_event, isExpanded) => setIsDescriptionExpanded(!isDescriptionExpanded)} isExpanded={isDescriptionExpanded}> - <Flex direction={{default:"column"}}> + <Flex className='component-headers' direction={{default:"column"}}> {headers.filter((header) => groups.includes(header.group)) .map((header, index, array) => <Flex key={index}> - <Text style={{marginLeft: "26px"}} component={TextVariants.p}>{header.name}</Text> + <ClipboardCopy key={index} hoverTip="Copy" clickTip="Copied" variant="inline-compact" isCode> + {header.name} + </ClipboardCopy> <FlexItem align={{default: 'alignRight'}}> <Popover position={"left"}