diff --git a/CHANGELOG.md b/CHANGELOG.md index d3560ebf..d930bfc1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +## 2.1.16 + +- Add copy icon functionality in static table row + ## 2.1.15 - Add tooltip hint in stepper and make stepper responsive diff --git a/DEPENDENCIES b/DEPENDENCIES index a9503625..0513a5a6 100644 --- a/DEPENDENCIES +++ b/DEPENDENCIES @@ -876,7 +876,7 @@ npm/npmjs/-/strip-final-newline/3.0.0, MIT, approved, clearlydefined npm/npmjs/-/strip-indent/3.0.0, MIT, approved, clearlydefined npm/npmjs/-/strip-json-comments/3.1.1, MIT, approved, clearlydefined npm/npmjs/-/style-inject/0.3.0, MIT, approved, clearlydefined -npm/npmjs/-/style-loader/3.3.3, MIT, approved, clearlydefined +npm/npmjs/-/style-loader/3.3.3, MIT, approved, #12669 npm/npmjs/-/stylehacks/5.1.1, MIT, approved, clearlydefined npm/npmjs/-/stylis/4.2.0, MIT, approved, #8409 npm/npmjs/-/supports-color/5.5.0, MIT, approved, clearlydefined diff --git a/package.json b/package.json index 0a3da3b8..5434470b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@catena-x/portal-shared-components", - "version": "2.1.15", + "version": "2.1.16", "description": "Catena-X Portal Shared Components", "author": "Catena-X Contributors", "license": "Apache-2.0", diff --git a/src/components/basic/StaticTable/StaticTable.stories.tsx b/src/components/basic/StaticTable/StaticTable.stories.tsx index 06b65aeb..51622c0a 100644 --- a/src/components/basic/StaticTable/StaticTable.stories.tsx +++ b/src/components/basic/StaticTable/StaticTable.stories.tsx @@ -51,6 +51,7 @@ Table.args = { }, { icon: true, + copyValue: 'test', inputValue: 'row1 col2', isValid: (value) => console.log('Checking Validation', value), errorMessage: 'Please enter valid value.', diff --git a/src/components/basic/StaticTable/VerticalTable.tsx b/src/components/basic/StaticTable/VerticalTable.tsx index 60138162..a9a569dc 100644 --- a/src/components/basic/StaticTable/VerticalTable.tsx +++ b/src/components/basic/StaticTable/VerticalTable.tsx @@ -19,10 +19,11 @@ ********************************************************************************/ import { useState } from 'react' -import { Typography, Link } from '@mui/material' +import { Typography, Link, Box } from '@mui/material' import EditIcon from '@mui/icons-material/Edit' import HelpOutlineIcon from '@mui/icons-material/HelpOutline' import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline' +import ContentCopyIcon from '@mui/icons-material/ContentCopy' import CloseIcon from '@mui/icons-material/Close' import type { TableType } from './types' import { Input } from '../Input' @@ -35,6 +36,7 @@ export const VerticalTable = ({ data: TableType handleEdit?: (inputValue: string) => void }) => { + const [copied, setCopied] = useState('') const [inputField, setInputField] = useState<{ row: unknown column: unknown @@ -103,6 +105,8 @@ export const VerticalTable = ({ ) } + const renderTextvalue = (text: string | undefined) => text ?? '' + return (
{inputField && - inputField.row === r && - inputField.column === c ? ( + inputField.row === r && + inputField.column === c ? ( renderInputField(r, c) ) : ( )} + {data?.edit?.[r]?.[c].copyValue && + ( + c !== 0 && + { + void (async () => { + const value = renderTextvalue(data?.edit?.[r]?.[c].copyValue?.toString()) + await navigator.clipboard.writeText(value) + setCopied(value) + setTimeout(() => { + setCopied('') + }, 1000) + })() + }} + > + + + ) + } {data?.edit?.[r]?.[c].icon && !inputField && (c === 0 ? ( unknown