added copy text tool to workflow defenition info (#3043)
Co-authored-by: Ivan Hrynevytskyi <ivan.hrynevytskyi@IHRYNEVYTSKYIL.local>
This commit is contained in:
parent
9d4267aa7f
commit
44b4ea0027
|
|
@ -162,7 +162,7 @@ export namespace Components {
|
|||
}
|
||||
interface ElsaTooltip {
|
||||
"tooltipContent": any;
|
||||
"tooltipPosition": string;
|
||||
"tooltipPosition"?: string;
|
||||
}
|
||||
interface ElsaWorkflowDefinitionBrowser {
|
||||
"hide": () => Promise<void>;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import {FunctionalComponent, h} from "@stencil/core";
|
||||
import { FunctionalComponent, h } from '@stencil/core';
|
||||
import { copyTextToClipboard } from '../../../utils';
|
||||
|
||||
export interface InfoListProps {
|
||||
title: string;
|
||||
|
|
@ -11,17 +12,33 @@ export const InfoList: FunctionalComponent<InfoListProps> = ({title, dictionary}
|
|||
<div class="max-w-4xl mx-auto">
|
||||
<div>
|
||||
<div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
{title}
|
||||
</h3>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">{title}</h3>
|
||||
</div>
|
||||
<div class="mt-5 border-t border-gray-200">
|
||||
<dl class="sm:divide-y sm:divide-gray-200">
|
||||
{Object.entries(dictionary).map(([k, v]) => (
|
||||
<div class="py-4 sm:py-5 sm:grid sm:grid-cols-3 sm:gap-4">
|
||||
<dt class="text-sm font-medium text-gray-500">{k}</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">{v}</dd>
|
||||
</div>))}
|
||||
<dd class="flex justify-between items-center mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
|
||||
{v}
|
||||
<svg
|
||||
onClick={() => copyTextToClipboard(v as string)}
|
||||
class="cursor-pointer inline-block ml-2 h-6 w-6 text-blue-500"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="2"
|
||||
stroke="currentColor"
|
||||
fill="none"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path stroke="none" d="M0 0h24v24H0z" /> <rect x="8" y="8" width="12" height="12" rx="2" />
|
||||
<path d="M16 8v-2a2 2 0 0 0 -2 -2h-8a2 2 0 0 0 -2 2v8a2 2 0 0 0 2 2h2" />
|
||||
</svg>
|
||||
</dd>
|
||||
</div>
|
||||
))}
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
32
src/designer/elsa-workflows-designer/src/utils/copy.ts
Normal file
32
src/designer/elsa-workflows-designer/src/utils/copy.ts
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
function fallbackCopyTextToClipboard(text: string) {
|
||||
const textArea = document.createElement('textarea');
|
||||
textArea.value = text;
|
||||
|
||||
textArea.style.top = '0';
|
||||
textArea.style.left = '0';
|
||||
textArea.style.position = 'fixed';
|
||||
|
||||
document.body.appendChild(textArea);
|
||||
|
||||
textArea.focus();
|
||||
textArea.select();
|
||||
|
||||
try {
|
||||
document.execCommand('copy');
|
||||
} catch (err) {
|
||||
console.error('Fallback: Oops, unable to copy', err);
|
||||
}
|
||||
|
||||
document.body.removeChild(textArea);
|
||||
}
|
||||
|
||||
export function copyTextToClipboard(text: string) {
|
||||
if (!navigator.clipboard) {
|
||||
fallbackCopyTextToClipboard(text);
|
||||
return;
|
||||
}
|
||||
|
||||
navigator.clipboard.writeText(text).catch(function (err) {
|
||||
console.error('Async: Could not copy text: ', err);
|
||||
});
|
||||
}
|
||||
|
|
@ -1,3 +1,4 @@
|
|||
export * from './download';
|
||||
export * from './select-list-items';
|
||||
export * from './utils';
|
||||
export * from './copy';
|
||||
|
|
|
|||
Loading…
Reference in a new issue