@chayns-components/code-highlighter 5.5.12 → 5.5.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9,10 +9,19 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
9
9
  /* eslint-disable @typescript-eslint/no-unsafe-call */
10
10
 
11
11
  _vitest.vi.mock('@chayns-components/core', () => ({
12
- Icon: () => /*#__PURE__*/_react2.default.createElement("span", null),
12
+ Icon: ({
13
+ icons
14
+ }) => /*#__PURE__*/_react2.default.createElement("span", {
15
+ "data-icons": icons.join(' ')
16
+ }),
13
17
  SharingContextMenu: ({
14
- children
15
- }) => children,
18
+ children,
19
+ shouldShowCallingCodeAction,
20
+ shouldShowCopyAction
21
+ }) => /*#__PURE__*/_react2.default.createElement("div", {
22
+ "data-calling-code-action": shouldShowCallingCodeAction,
23
+ "data-copy-action": shouldShowCopyAction
24
+ }, children),
16
25
  useColorScheme: () => undefined
17
26
  }));
18
27
  _vitest.vi.mock('@chayns-components/textstring', () => ({
@@ -34,7 +43,7 @@ _vitest.vi.mock('chayns-api', () => ({
34
43
  }))
35
44
  }));
36
45
  (0, _vitest.describe)('CodeHighlighter', () => {
37
- (0, _vitest.it)('keeps the copy operation and renders sticky actions', () => {
46
+ (0, _vitest.it)('keeps the copy operation and renders sticky actions', async () => {
38
47
  const writeText = _vitest.vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue();
39
48
  const {
40
49
  container
@@ -48,7 +57,10 @@ _vitest.vi.mock('chayns-api', () => ({
48
57
  _react.fireEvent.click(_react.screen.getByRole('button', {
49
58
  name: 'Copy code'
50
59
  }));
51
- (0, _vitest.expect)(writeText).toHaveBeenCalledWith('const value = true;');
60
+ await (0, _react.waitFor)(() => {
61
+ (0, _vitest.expect)(writeText).toHaveBeenCalledWith('const value = true;');
62
+ (0, _vitest.expect)(container.querySelector('[data-icons="fa fa-check"]')).toBeInTheDocument();
63
+ });
52
64
  (0, _vitest.expect)(container.querySelector('pre')).toHaveStyle({
53
65
  overflow: 'auto',
54
66
  padding: '0px 15px 15px'
@@ -56,6 +68,8 @@ _vitest.vi.mock('chayns-api', () => ({
56
68
  (0, _vitest.expect)(container.firstChild).toHaveStyle({
57
69
  backgroundColor: 'rgb(40, 44, 52)'
58
70
  });
71
+ (0, _vitest.expect)(container.querySelector('[data-copy-action="false"]')).toBeInTheDocument();
72
+ (0, _vitest.expect)(container.querySelector('[data-calling-code-action="false"]')).toBeInTheDocument();
59
73
  });
60
74
  (0, _vitest.it)('formats code before highlighting when requested', async () => {
61
75
  const {
@@ -1 +1 @@
1
- {"version":3,"file":"CodeHighlighter.test.js","names":["_react","require","_react2","_interopRequireDefault","_vitest","_codeHighlighter","_CodeHighlighter","e","__esModule","default","vi","mock","Icon","createElement","SharingContextMenu","children","useColorScheme","undefined","ttsToITextString","value","useTextstringValue","textstring","fallback","DialogType","TOAST","ToastType","ERROR","SUCCESS","createDialog","fn","open","describe","it","writeText","spyOn","navigator","clipboard","mockResolvedValue","container","render","code","copyButtonText","language","shouldShowLineNumbers","theme","CodeHighlighterTheme","Dark","fireEvent","click","screen","getByRole","name","expect","toHaveBeenCalledWith","querySelector","toHaveStyle","overflow","padding","firstChild","backgroundColor","shouldFormatCode","Light","waitFor","toHaveTextContent","toBeInTheDocument"],"sources":["../../../../src/components/code-highlighter/CodeHighlighter.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-call */\nimport { fireEvent, render, screen, waitFor } from '@testing-library/react';\nimport React from 'react';\nimport { describe, expect, it, vi } from 'vitest';\nimport { CodeHighlighterTheme } from '../../types/codeHighlighter';\nimport CodeHighlighter from './CodeHighlighter';\n\nvi.mock('@chayns-components/core', () => ({\n Icon: () => <span />,\n SharingContextMenu: ({ children }: { children: React.ReactNode }) => children,\n useColorScheme: () => undefined,\n}));\n\nvi.mock('@chayns-components/textstring', () => ({\n ttsToITextString: (value: unknown) => value,\n useTextstringValue: ({ textstring }: { textstring: { fallback: string } }) =>\n textstring.fallback,\n}));\n\nvi.mock('chayns-api', () => ({\n DialogType: { TOAST: 1 },\n ToastType: { ERROR: 4, SUCCESS: 2 },\n createDialog: vi.fn(() => ({ open: vi.fn() })),\n}));\n\ndescribe('CodeHighlighter', () => {\n it('keeps the copy operation and renders sticky actions', () => {\n const writeText = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue();\n const { container } = render(\n <CodeHighlighter\n code=\"const value = true;\"\n copyButtonText=\"Copy code\"\n language=\"typescript\"\n shouldShowLineNumbers\n theme={CodeHighlighterTheme.Dark}\n />,\n );\n\n fireEvent.click(screen.getByRole('button', { name: 'Copy code' }));\n\n expect(writeText).toHaveBeenCalledWith('const value = true;');\n expect(container.querySelector('pre')).toHaveStyle({\n overflow: 'auto',\n padding: '0px 15px 15px',\n });\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(40, 44, 52)' });\n });\n\n it('formats code before highlighting when requested', async () => {\n const { container } = render(\n <CodeHighlighter\n code=\"const value={label:'Ada'};\"\n language=\"typescript\"\n shouldFormatCode\n theme={CodeHighlighterTheme.Light}\n />,\n );\n\n await waitFor(() => {\n expect(container.querySelector('pre')).toHaveTextContent(\n \"const value = { label: 'Ada' };\",\n );\n });\n expect(container.querySelector('pre span')).toBeInTheDocument();\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(250, 250, 250)' });\n });\n});\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"CodeHighlighter.test.js","names":["_react","require","_react2","_interopRequireDefault","_vitest","_codeHighlighter","_CodeHighlighter","e","__esModule","default","vi","mock","Icon","icons","createElement","join","SharingContextMenu","children","shouldShowCallingCodeAction","shouldShowCopyAction","useColorScheme","undefined","ttsToITextString","value","useTextstringValue","textstring","fallback","DialogType","TOAST","ToastType","ERROR","SUCCESS","createDialog","fn","open","describe","it","writeText","spyOn","navigator","clipboard","mockResolvedValue","container","render","code","copyButtonText","language","shouldShowLineNumbers","theme","CodeHighlighterTheme","Dark","fireEvent","click","screen","getByRole","name","waitFor","expect","toHaveBeenCalledWith","querySelector","toBeInTheDocument","toHaveStyle","overflow","padding","firstChild","backgroundColor","shouldFormatCode","Light","toHaveTextContent"],"sources":["../../../../src/components/code-highlighter/CodeHighlighter.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-call */\nimport { fireEvent, render, screen, waitFor } from '@testing-library/react';\nimport React from 'react';\nimport { describe, expect, it, vi } from 'vitest';\nimport { CodeHighlighterTheme } from '../../types/codeHighlighter';\nimport CodeHighlighter from './CodeHighlighter';\n\nvi.mock('@chayns-components/core', () => ({\n Icon: ({ icons }: { icons: string[] }) => <span data-icons={icons.join(' ')} />,\n SharingContextMenu: ({\n children,\n shouldShowCallingCodeAction,\n shouldShowCopyAction,\n }: {\n children: React.ReactNode;\n shouldShowCallingCodeAction?: boolean;\n shouldShowCopyAction?: boolean;\n }) => (\n <div\n data-calling-code-action={shouldShowCallingCodeAction}\n data-copy-action={shouldShowCopyAction}\n >\n {children}\n </div>\n ),\n useColorScheme: () => undefined,\n}));\n\nvi.mock('@chayns-components/textstring', () => ({\n ttsToITextString: (value: unknown) => value,\n useTextstringValue: ({ textstring }: { textstring: { fallback: string } }) =>\n textstring.fallback,\n}));\n\nvi.mock('chayns-api', () => ({\n DialogType: { TOAST: 1 },\n ToastType: { ERROR: 4, SUCCESS: 2 },\n createDialog: vi.fn(() => ({ open: vi.fn() })),\n}));\n\ndescribe('CodeHighlighter', () => {\n it('keeps the copy operation and renders sticky actions', async () => {\n const writeText = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue();\n const { container } = render(\n <CodeHighlighter\n code=\"const value = true;\"\n copyButtonText=\"Copy code\"\n language=\"typescript\"\n shouldShowLineNumbers\n theme={CodeHighlighterTheme.Dark}\n />,\n );\n\n fireEvent.click(screen.getByRole('button', { name: 'Copy code' }));\n\n await waitFor(() => {\n expect(writeText).toHaveBeenCalledWith('const value = true;');\n expect(container.querySelector('[data-icons=\"fa fa-check\"]')).toBeInTheDocument();\n });\n expect(container.querySelector('pre')).toHaveStyle({\n overflow: 'auto',\n padding: '0px 15px 15px',\n });\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(40, 44, 52)' });\n expect(container.querySelector('[data-copy-action=\"false\"]')).toBeInTheDocument();\n expect(container.querySelector('[data-calling-code-action=\"false\"]')).toBeInTheDocument();\n });\n\n it('formats code before highlighting when requested', async () => {\n const { container } = render(\n <CodeHighlighter\n code=\"const value={label:'Ada'};\"\n language=\"typescript\"\n shouldFormatCode\n theme={CodeHighlighterTheme.Light}\n />,\n );\n\n await waitFor(() => {\n expect(container.querySelector('pre')).toHaveTextContent(\n \"const value = { label: 'Ada' };\",\n );\n });\n expect(container.querySelector('pre span')).toBeInTheDocument();\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(250, 250, 250)' });\n });\n});\n"],"mappings":"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","ignoreList":[]}
@@ -14,6 +14,7 @@ var _textStrings = _interopRequireDefault(require("../../../constants/textString
14
14
  var _useStickyActionState = require("./useStickyActionState");
15
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
16
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
17
+ const COPY_FEEDBACK_DURATION = 1500;
17
18
  const CopyToClipboard = ({
18
19
  copyButtonText,
19
20
  rootRef,
@@ -21,13 +22,12 @@ const CopyToClipboard = ({
21
22
  theme
22
23
  }) => {
23
24
  const actionGroupRef = (0, _react.useRef)(null);
25
+ const copyFeedbackTimeoutRef = (0, _react.useRef)();
24
26
  const isActionGroupSticky = (0, _useStickyActionState.useStickyActionState)(rootRef, actionGroupRef);
27
+ const [hasCopied, setHasCopied] = (0, _react.useState)(false);
25
28
  const defaultCopyText = (0, _textstring.useTextstringValue)({
26
29
  textstring: (0, _textstring.ttsToITextString)(_textStrings.default.components.codeHighlighter.copyToClipboard.copy)
27
30
  });
28
- const copiedText = (0, _textstring.useTextstringValue)({
29
- textstring: (0, _textstring.ttsToITextString)(_textStrings.default.components.codeHighlighter.copyToClipboard.copied)
30
- });
31
31
  const copyFailedText = (0, _textstring.useTextstringValue)({
32
32
  textstring: (0, _textstring.ttsToITextString)(_textStrings.default.components.codeHighlighter.copyToClipboard.copyFailed)
33
33
  });
@@ -36,15 +36,20 @@ const CopyToClipboard = ({
36
36
  });
37
37
  const copyText = copyButtonText ?? defaultCopyText;
38
38
  const iconColor = theme === _codeHighlighter.CodeHighlighterTheme.Dark ? '#f4f6f8' : '#5f6368';
39
+ (0, _react.useEffect)(() => () => {
40
+ window.clearTimeout(copyFeedbackTimeoutRef.current);
41
+ }, []);
42
+ const showCopyFeedback = (0, _react.useCallback)(() => {
43
+ window.clearTimeout(copyFeedbackTimeoutRef.current);
44
+ setHasCopied(true);
45
+ copyFeedbackTimeoutRef.current = window.setTimeout(() => {
46
+ setHasCopied(false);
47
+ }, COPY_FEEDBACK_DURATION);
48
+ }, []);
39
49
  const handleCopy = (0, _react.useCallback)(async () => {
40
50
  try {
41
51
  await navigator.clipboard.writeText(text);
42
- void (0, _chaynsApi.createDialog)({
43
- showCloseIcon: true,
44
- text: copiedText,
45
- toastType: _chaynsApi.ToastType.SUCCESS,
46
- type: _chaynsApi.DialogType.TOAST
47
- }).open();
52
+ showCopyFeedback();
48
53
  } catch {
49
54
  void (0, _chaynsApi.createDialog)({
50
55
  showCloseIcon: true,
@@ -53,7 +58,7 @@ const CopyToClipboard = ({
53
58
  type: _chaynsApi.DialogType.TOAST
54
59
  }).open();
55
60
  }
56
- }, [copiedText, copyFailedText, text]);
61
+ }, [copyFailedText, showCopyFeedback, text]);
57
62
  return /*#__PURE__*/_react.default.createElement(_CopyToClipboard.StyledCopyToClipboard, {
58
63
  $codeTheme: theme,
59
64
  ref: actionGroupRef
@@ -67,9 +72,11 @@ const CopyToClipboard = ({
67
72
  type: "button"
68
73
  }, /*#__PURE__*/_react.default.createElement(_core.Icon, {
69
74
  color: iconColor,
70
- icons: ['fa-light fa-copy']
75
+ icons: hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']
71
76
  })), /*#__PURE__*/_react.default.createElement(_core.SharingContextMenu, {
72
77
  link: text,
78
+ shouldShowCallingCodeAction: false,
79
+ shouldShowCopyAction: false,
73
80
  shouldUseDefaultTriggerStyles: false
74
81
  }, /*#__PURE__*/_react.default.createElement(_CopyToClipboard.StyledCopyToClipboardButton, {
75
82
  $codeTheme: theme,
@@ -1 +1 @@
1
- {"version":3,"file":"CopyToClipboard.js","names":["_core","require","_textstring","_chaynsApi","_react","_interopRequireWildcard","_codeHighlighter","_CopyToClipboard","_textStrings","_interopRequireDefault","_useStickyActionState","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","CopyToClipboard","copyButtonText","rootRef","text","theme","actionGroupRef","useRef","isActionGroupSticky","useStickyActionState","defaultCopyText","useTextstringValue","textstring","ttsToITextString","textStrings","components","codeHighlighter","copyToClipboard","copy","copiedText","copied","copyFailedText","copyFailed","shareText","share","copyText","iconColor","CodeHighlighterTheme","Dark","handleCopy","useCallback","navigator","clipboard","writeText","createDialog","showCloseIcon","toastType","ToastType","SUCCESS","type","DialogType","TOAST","open","ERROR","createElement","StyledCopyToClipboard","$codeTheme","ref","StyledCopyToClipboardActionGroup","StyledCopyToClipboardButton","$isSticky","onClick","Icon","color","icons","SharingContextMenu","link","shouldUseDefaultTriggerStyles","displayName","_default","exports"],"sources":["../../../../../src/components/code-highlighter/copy-to-clipboard/CopyToClipboard.tsx"],"sourcesContent":["import { Icon, SharingContextMenu } from '@chayns-components/core';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport { createDialog, DialogType, ToastType } from 'chayns-api';\nimport React, { FC, RefObject, useCallback, useRef } from 'react';\nimport { CodeHighlighterTheme } from '../../../types/codeHighlighter';\nimport {\n StyledCopyToClipboard,\n StyledCopyToClipboardActionGroup,\n StyledCopyToClipboardButton,\n} from './CopyToClipboard.styles';\nimport textStrings from '../../../constants/textStrings';\nimport { useStickyActionState } from './useStickyActionState';\n\nexport type CopyToClipboardProps = {\n copyButtonText?: string;\n rootRef: RefObject<HTMLDivElement>;\n text: string;\n theme: CodeHighlighterTheme;\n};\n\nconst CopyToClipboard: FC<CopyToClipboardProps> = ({ copyButtonText, rootRef, text, theme }) => {\n const actionGroupRef = useRef<HTMLDivElement>(null);\n const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);\n\n const defaultCopyText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copy),\n });\n const copiedText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copied),\n });\n const copyFailedText = useTextstringValue({\n textstring: ttsToITextString(\n textStrings.components.codeHighlighter.copyToClipboard.copyFailed,\n ),\n });\n const shareText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.share),\n });\n\n const copyText = copyButtonText ?? defaultCopyText;\n const iconColor = theme === CodeHighlighterTheme.Dark ? '#f4f6f8' : '#5f6368';\n\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(text);\n void createDialog({\n showCloseIcon: true,\n text: copiedText,\n toastType: ToastType.SUCCESS,\n type: DialogType.TOAST,\n }).open();\n } catch {\n void createDialog({\n showCloseIcon: true,\n text: copyFailedText,\n toastType: ToastType.ERROR,\n type: DialogType.TOAST,\n }).open();\n }\n }, [copiedText, copyFailedText, text]);\n\n return (\n <StyledCopyToClipboard $codeTheme={theme} ref={actionGroupRef}>\n <StyledCopyToClipboardActionGroup>\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={copyText}\n onClick={() => {\n void handleCopy();\n }}\n type=\"button\"\n >\n <Icon color={iconColor} icons={['fa-light fa-copy']} />\n </StyledCopyToClipboardButton>\n <SharingContextMenu link={text} shouldUseDefaultTriggerStyles={false}>\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={shareText}\n type=\"button\"\n >\n <Icon color={iconColor} icons={['fa fa-share-nodes']} />\n </StyledCopyToClipboardButton>\n </SharingContextMenu>\n </StyledCopyToClipboardActionGroup>\n </StyledCopyToClipboard>\n );\n};\n\nCopyToClipboard.displayName = 'CopyToClipboard';\n\nexport default CopyToClipboard;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"CopyToClipboard.js","names":["_core","require","_textstring","_chaynsApi","_react","_interopRequireWildcard","_codeHighlighter","_CopyToClipboard","_textStrings","_interopRequireDefault","_useStickyActionState","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","COPY_FEEDBACK_DURATION","CopyToClipboard","copyButtonText","rootRef","text","theme","actionGroupRef","useRef","copyFeedbackTimeoutRef","isActionGroupSticky","useStickyActionState","hasCopied","setHasCopied","useState","defaultCopyText","useTextstringValue","textstring","ttsToITextString","textStrings","components","codeHighlighter","copyToClipboard","copy","copyFailedText","copyFailed","shareText","share","copyText","iconColor","CodeHighlighterTheme","Dark","useEffect","window","clearTimeout","current","showCopyFeedback","useCallback","setTimeout","handleCopy","navigator","clipboard","writeText","createDialog","showCloseIcon","toastType","ToastType","ERROR","type","DialogType","TOAST","open","createElement","StyledCopyToClipboard","$codeTheme","ref","StyledCopyToClipboardActionGroup","StyledCopyToClipboardButton","$isSticky","onClick","Icon","color","icons","SharingContextMenu","link","shouldShowCallingCodeAction","shouldShowCopyAction","shouldUseDefaultTriggerStyles","displayName","_default","exports"],"sources":["../../../../../src/components/code-highlighter/copy-to-clipboard/CopyToClipboard.tsx"],"sourcesContent":["import { Icon, SharingContextMenu } from '@chayns-components/core';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport { createDialog, DialogType, ToastType } from 'chayns-api';\nimport React, { FC, RefObject, useCallback, useEffect, useRef, useState } from 'react';\nimport { CodeHighlighterTheme } from '../../../types/codeHighlighter';\nimport {\n StyledCopyToClipboard,\n StyledCopyToClipboardActionGroup,\n StyledCopyToClipboardButton,\n} from './CopyToClipboard.styles';\nimport textStrings from '../../../constants/textStrings';\nimport { useStickyActionState } from './useStickyActionState';\n\nexport type CopyToClipboardProps = {\n copyButtonText?: string;\n rootRef: RefObject<HTMLDivElement>;\n text: string;\n theme: CodeHighlighterTheme;\n};\n\nconst COPY_FEEDBACK_DURATION = 1500;\n\nconst CopyToClipboard: FC<CopyToClipboardProps> = ({ copyButtonText, rootRef, text, theme }) => {\n const actionGroupRef = useRef<HTMLDivElement>(null);\n const copyFeedbackTimeoutRef = useRef<number>();\n const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);\n const [hasCopied, setHasCopied] = useState(false);\n\n const defaultCopyText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copy),\n });\n const copyFailedText = useTextstringValue({\n textstring: ttsToITextString(\n textStrings.components.codeHighlighter.copyToClipboard.copyFailed,\n ),\n });\n const shareText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.share),\n });\n\n const copyText = copyButtonText ?? defaultCopyText;\n const iconColor = theme === CodeHighlighterTheme.Dark ? '#f4f6f8' : '#5f6368';\n\n useEffect(\n () => () => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n },\n [],\n );\n\n const showCopyFeedback = useCallback(() => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n setHasCopied(true);\n\n copyFeedbackTimeoutRef.current = window.setTimeout(() => {\n setHasCopied(false);\n }, COPY_FEEDBACK_DURATION);\n }, []);\n\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(text);\n showCopyFeedback();\n } catch {\n void createDialog({\n showCloseIcon: true,\n text: copyFailedText,\n toastType: ToastType.ERROR,\n type: DialogType.TOAST,\n }).open();\n }\n }, [copyFailedText, showCopyFeedback, text]);\n\n return (\n <StyledCopyToClipboard $codeTheme={theme} ref={actionGroupRef}>\n <StyledCopyToClipboardActionGroup>\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={copyText}\n onClick={() => {\n void handleCopy();\n }}\n type=\"button\"\n >\n <Icon\n color={iconColor}\n icons={hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']}\n />\n </StyledCopyToClipboardButton>\n <SharingContextMenu\n link={text}\n shouldShowCallingCodeAction={false}\n shouldShowCopyAction={false}\n shouldUseDefaultTriggerStyles={false}\n >\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={shareText}\n type=\"button\"\n >\n <Icon color={iconColor} icons={['fa fa-share-nodes']} />\n </StyledCopyToClipboardButton>\n </SharingContextMenu>\n </StyledCopyToClipboardActionGroup>\n </StyledCopyToClipboard>\n );\n};\n\nCopyToClipboard.displayName = 'CopyToClipboard';\n\nexport default CopyToClipboard;\n"],"mappings":"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","ignoreList":[]}
@@ -12,10 +12,6 @@ var _default = exports.default = {
12
12
  stringName: 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy',
13
13
  fallback: 'Kopieren'
14
14
  },
15
- copied: {
16
- stringName: 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copied',
17
- fallback: 'Kopiert!'
18
- },
19
15
  copyFailed: {
20
16
  stringName: 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed',
21
17
  fallback: 'Kopieren fehlgeschlagen'
@@ -1 +1 @@
1
- {"version":3,"file":"textStrings.js","names":["components","codeHighlighter","copyToClipboard","copy","stringName","fallback","copied","copyFailed","share"],"sources":["../../../src/constants/textStrings.ts"],"sourcesContent":["export default {\n components: {\n codeHighlighter: {\n copyToClipboard: {\n copy: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy',\n fallback: 'Kopieren',\n },\n copied: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copied',\n fallback: 'Kopiert!',\n },\n copyFailed: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed',\n fallback: 'Kopieren fehlgeschlagen',\n },\n share: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_share',\n fallback: 'Teilen',\n },\n },\n },\n },\n} as const;\n"],"mappings":";;;;;;iCAAe;EACXA,UAAU,EAAE;IACRC,eAAe,EAAE;MACbC,eAAe,EAAE;QACbC,IAAI,EAAE;UACFC,UAAU,EACN,wFAAwF;UAC5FC,QAAQ,EAAE;QACd,CAAC;QACDC,MAAM,EAAE;UACJF,UAAU,EACN,0FAA0F;UAC9FC,QAAQ,EAAE;QACd,CAAC;QACDE,UAAU,EAAE;UACRH,UAAU,EACN,8FAA8F;UAClGC,QAAQ,EAAE;QACd,CAAC;QACDG,KAAK,EAAE;UACHJ,UAAU,EACN,yFAAyF;UAC7FC,QAAQ,EAAE;QACd;MACJ;IACJ;EACJ;AACJ,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"textStrings.js","names":["components","codeHighlighter","copyToClipboard","copy","stringName","fallback","copyFailed","share"],"sources":["../../../src/constants/textStrings.ts"],"sourcesContent":["export default {\n components: {\n codeHighlighter: {\n copyToClipboard: {\n copy: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy',\n fallback: 'Kopieren',\n },\n copyFailed: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed',\n fallback: 'Kopieren fehlgeschlagen',\n },\n share: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_share',\n fallback: 'Teilen',\n },\n },\n },\n },\n} as const;\n"],"mappings":";;;;;;iCAAe;EACXA,UAAU,EAAE;IACRC,eAAe,EAAE;MACbC,eAAe,EAAE;QACbC,IAAI,EAAE;UACFC,UAAU,EACN,wFAAwF;UAC5FC,QAAQ,EAAE;QACd,CAAC;QACDC,UAAU,EAAE;UACRF,UAAU,EACN,8FAA8F;UAClGC,QAAQ,EAAE;QACd,CAAC;QACDE,KAAK,EAAE;UACHH,UAAU,EACN,yFAAyF;UAC7FC,QAAQ,EAAE;QACd;MACJ;IACJ;EACJ;AACJ,CAAC","ignoreList":[]}
@@ -5,10 +5,19 @@ import { describe, expect, it, vi } from 'vitest';
5
5
  import { CodeHighlighterTheme } from '../../types/codeHighlighter';
6
6
  import CodeHighlighter from './CodeHighlighter';
7
7
  vi.mock('@chayns-components/core', () => ({
8
- Icon: () => /*#__PURE__*/React.createElement("span", null),
8
+ Icon: ({
9
+ icons
10
+ }) => /*#__PURE__*/React.createElement("span", {
11
+ "data-icons": icons.join(' ')
12
+ }),
9
13
  SharingContextMenu: ({
10
- children
11
- }) => children,
14
+ children,
15
+ shouldShowCallingCodeAction,
16
+ shouldShowCopyAction
17
+ }) => /*#__PURE__*/React.createElement("div", {
18
+ "data-calling-code-action": shouldShowCallingCodeAction,
19
+ "data-copy-action": shouldShowCopyAction
20
+ }, children),
12
21
  useColorScheme: () => undefined
13
22
  }));
14
23
  vi.mock('@chayns-components/textstring', () => ({
@@ -30,7 +39,7 @@ vi.mock('chayns-api', () => ({
30
39
  }))
31
40
  }));
32
41
  describe('CodeHighlighter', () => {
33
- it('keeps the copy operation and renders sticky actions', () => {
42
+ it('keeps the copy operation and renders sticky actions', async () => {
34
43
  const writeText = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue();
35
44
  const {
36
45
  container
@@ -44,7 +53,10 @@ describe('CodeHighlighter', () => {
44
53
  fireEvent.click(screen.getByRole('button', {
45
54
  name: 'Copy code'
46
55
  }));
47
- expect(writeText).toHaveBeenCalledWith('const value = true;');
56
+ await waitFor(() => {
57
+ expect(writeText).toHaveBeenCalledWith('const value = true;');
58
+ expect(container.querySelector('[data-icons="fa fa-check"]')).toBeInTheDocument();
59
+ });
48
60
  expect(container.querySelector('pre')).toHaveStyle({
49
61
  overflow: 'auto',
50
62
  padding: '0px 15px 15px'
@@ -52,6 +64,8 @@ describe('CodeHighlighter', () => {
52
64
  expect(container.firstChild).toHaveStyle({
53
65
  backgroundColor: 'rgb(40, 44, 52)'
54
66
  });
67
+ expect(container.querySelector('[data-copy-action="false"]')).toBeInTheDocument();
68
+ expect(container.querySelector('[data-calling-code-action="false"]')).toBeInTheDocument();
55
69
  });
56
70
  it('formats code before highlighting when requested', async () => {
57
71
  const {
@@ -1 +1 @@
1
- {"version":3,"file":"CodeHighlighter.test.js","names":["fireEvent","render","screen","waitFor","React","describe","expect","it","vi","CodeHighlighterTheme","CodeHighlighter","mock","Icon","createElement","SharingContextMenu","children","useColorScheme","undefined","ttsToITextString","value","useTextstringValue","textstring","fallback","DialogType","TOAST","ToastType","ERROR","SUCCESS","createDialog","fn","open","writeText","spyOn","navigator","clipboard","mockResolvedValue","container","code","copyButtonText","language","shouldShowLineNumbers","theme","Dark","click","getByRole","name","toHaveBeenCalledWith","querySelector","toHaveStyle","overflow","padding","firstChild","backgroundColor","shouldFormatCode","Light","toHaveTextContent","toBeInTheDocument"],"sources":["../../../../src/components/code-highlighter/CodeHighlighter.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-call */\nimport { fireEvent, render, screen, waitFor } from '@testing-library/react';\nimport React from 'react';\nimport { describe, expect, it, vi } from 'vitest';\nimport { CodeHighlighterTheme } from '../../types/codeHighlighter';\nimport CodeHighlighter from './CodeHighlighter';\n\nvi.mock('@chayns-components/core', () => ({\n Icon: () => <span />,\n SharingContextMenu: ({ children }: { children: React.ReactNode }) => children,\n useColorScheme: () => undefined,\n}));\n\nvi.mock('@chayns-components/textstring', () => ({\n ttsToITextString: (value: unknown) => value,\n useTextstringValue: ({ textstring }: { textstring: { fallback: string } }) =>\n textstring.fallback,\n}));\n\nvi.mock('chayns-api', () => ({\n DialogType: { TOAST: 1 },\n ToastType: { ERROR: 4, SUCCESS: 2 },\n createDialog: vi.fn(() => ({ open: vi.fn() })),\n}));\n\ndescribe('CodeHighlighter', () => {\n it('keeps the copy operation and renders sticky actions', () => {\n const writeText = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue();\n const { container } = render(\n <CodeHighlighter\n code=\"const value = true;\"\n copyButtonText=\"Copy code\"\n language=\"typescript\"\n shouldShowLineNumbers\n theme={CodeHighlighterTheme.Dark}\n />,\n );\n\n fireEvent.click(screen.getByRole('button', { name: 'Copy code' }));\n\n expect(writeText).toHaveBeenCalledWith('const value = true;');\n expect(container.querySelector('pre')).toHaveStyle({\n overflow: 'auto',\n padding: '0px 15px 15px',\n });\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(40, 44, 52)' });\n });\n\n it('formats code before highlighting when requested', async () => {\n const { container } = render(\n <CodeHighlighter\n code=\"const value={label:'Ada'};\"\n language=\"typescript\"\n shouldFormatCode\n theme={CodeHighlighterTheme.Light}\n />,\n );\n\n await waitFor(() => {\n expect(container.querySelector('pre')).toHaveTextContent(\n \"const value = { label: 'Ada' };\",\n );\n });\n expect(container.querySelector('pre span')).toBeInTheDocument();\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(250, 250, 250)' });\n });\n});\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"CodeHighlighter.test.js","names":["fireEvent","render","screen","waitFor","React","describe","expect","it","vi","CodeHighlighterTheme","CodeHighlighter","mock","Icon","icons","createElement","join","SharingContextMenu","children","shouldShowCallingCodeAction","shouldShowCopyAction","useColorScheme","undefined","ttsToITextString","value","useTextstringValue","textstring","fallback","DialogType","TOAST","ToastType","ERROR","SUCCESS","createDialog","fn","open","writeText","spyOn","navigator","clipboard","mockResolvedValue","container","code","copyButtonText","language","shouldShowLineNumbers","theme","Dark","click","getByRole","name","toHaveBeenCalledWith","querySelector","toBeInTheDocument","toHaveStyle","overflow","padding","firstChild","backgroundColor","shouldFormatCode","Light","toHaveTextContent"],"sources":["../../../../src/components/code-highlighter/CodeHighlighter.test.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-call */\nimport { fireEvent, render, screen, waitFor } from '@testing-library/react';\nimport React from 'react';\nimport { describe, expect, it, vi } from 'vitest';\nimport { CodeHighlighterTheme } from '../../types/codeHighlighter';\nimport CodeHighlighter from './CodeHighlighter';\n\nvi.mock('@chayns-components/core', () => ({\n Icon: ({ icons }: { icons: string[] }) => <span data-icons={icons.join(' ')} />,\n SharingContextMenu: ({\n children,\n shouldShowCallingCodeAction,\n shouldShowCopyAction,\n }: {\n children: React.ReactNode;\n shouldShowCallingCodeAction?: boolean;\n shouldShowCopyAction?: boolean;\n }) => (\n <div\n data-calling-code-action={shouldShowCallingCodeAction}\n data-copy-action={shouldShowCopyAction}\n >\n {children}\n </div>\n ),\n useColorScheme: () => undefined,\n}));\n\nvi.mock('@chayns-components/textstring', () => ({\n ttsToITextString: (value: unknown) => value,\n useTextstringValue: ({ textstring }: { textstring: { fallback: string } }) =>\n textstring.fallback,\n}));\n\nvi.mock('chayns-api', () => ({\n DialogType: { TOAST: 1 },\n ToastType: { ERROR: 4, SUCCESS: 2 },\n createDialog: vi.fn(() => ({ open: vi.fn() })),\n}));\n\ndescribe('CodeHighlighter', () => {\n it('keeps the copy operation and renders sticky actions', async () => {\n const writeText = vi.spyOn(navigator.clipboard, 'writeText').mockResolvedValue();\n const { container } = render(\n <CodeHighlighter\n code=\"const value = true;\"\n copyButtonText=\"Copy code\"\n language=\"typescript\"\n shouldShowLineNumbers\n theme={CodeHighlighterTheme.Dark}\n />,\n );\n\n fireEvent.click(screen.getByRole('button', { name: 'Copy code' }));\n\n await waitFor(() => {\n expect(writeText).toHaveBeenCalledWith('const value = true;');\n expect(container.querySelector('[data-icons=\"fa fa-check\"]')).toBeInTheDocument();\n });\n expect(container.querySelector('pre')).toHaveStyle({\n overflow: 'auto',\n padding: '0px 15px 15px',\n });\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(40, 44, 52)' });\n expect(container.querySelector('[data-copy-action=\"false\"]')).toBeInTheDocument();\n expect(container.querySelector('[data-calling-code-action=\"false\"]')).toBeInTheDocument();\n });\n\n it('formats code before highlighting when requested', async () => {\n const { container } = render(\n <CodeHighlighter\n code=\"const value={label:'Ada'};\"\n language=\"typescript\"\n shouldFormatCode\n theme={CodeHighlighterTheme.Light}\n />,\n );\n\n await waitFor(() => {\n expect(container.querySelector('pre')).toHaveTextContent(\n \"const value = { label: 'Ada' };\",\n );\n });\n expect(container.querySelector('pre span')).toBeInTheDocument();\n expect(container.firstChild).toHaveStyle({ backgroundColor: 'rgb(250, 250, 250)' });\n });\n});\n"],"mappings":"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","ignoreList":[]}
@@ -1,11 +1,12 @@
1
1
  import { Icon, SharingContextMenu } from '@chayns-components/core';
2
2
  import { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';
3
3
  import { createDialog, DialogType, ToastType } from 'chayns-api';
4
- import React, { useCallback, useRef } from 'react';
4
+ import React, { useCallback, useEffect, useRef, useState } from 'react';
5
5
  import { CodeHighlighterTheme } from '../../../types/codeHighlighter';
6
6
  import { StyledCopyToClipboard, StyledCopyToClipboardActionGroup, StyledCopyToClipboardButton } from './CopyToClipboard.styles';
7
7
  import textStrings from '../../../constants/textStrings';
8
8
  import { useStickyActionState } from './useStickyActionState';
9
+ const COPY_FEEDBACK_DURATION = 1500;
9
10
  const CopyToClipboard = ({
10
11
  copyButtonText,
11
12
  rootRef,
@@ -13,13 +14,12 @@ const CopyToClipboard = ({
13
14
  theme
14
15
  }) => {
15
16
  const actionGroupRef = useRef(null);
17
+ const copyFeedbackTimeoutRef = useRef();
16
18
  const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);
19
+ const [hasCopied, setHasCopied] = useState(false);
17
20
  const defaultCopyText = useTextstringValue({
18
21
  textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copy)
19
22
  });
20
- const copiedText = useTextstringValue({
21
- textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copied)
22
- });
23
23
  const copyFailedText = useTextstringValue({
24
24
  textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copyFailed)
25
25
  });
@@ -28,15 +28,20 @@ const CopyToClipboard = ({
28
28
  });
29
29
  const copyText = copyButtonText ?? defaultCopyText;
30
30
  const iconColor = theme === CodeHighlighterTheme.Dark ? '#f4f6f8' : '#5f6368';
31
+ useEffect(() => () => {
32
+ window.clearTimeout(copyFeedbackTimeoutRef.current);
33
+ }, []);
34
+ const showCopyFeedback = useCallback(() => {
35
+ window.clearTimeout(copyFeedbackTimeoutRef.current);
36
+ setHasCopied(true);
37
+ copyFeedbackTimeoutRef.current = window.setTimeout(() => {
38
+ setHasCopied(false);
39
+ }, COPY_FEEDBACK_DURATION);
40
+ }, []);
31
41
  const handleCopy = useCallback(async () => {
32
42
  try {
33
43
  await navigator.clipboard.writeText(text);
34
- void createDialog({
35
- showCloseIcon: true,
36
- text: copiedText,
37
- toastType: ToastType.SUCCESS,
38
- type: DialogType.TOAST
39
- }).open();
44
+ showCopyFeedback();
40
45
  } catch {
41
46
  void createDialog({
42
47
  showCloseIcon: true,
@@ -45,7 +50,7 @@ const CopyToClipboard = ({
45
50
  type: DialogType.TOAST
46
51
  }).open();
47
52
  }
48
- }, [copiedText, copyFailedText, text]);
53
+ }, [copyFailedText, showCopyFeedback, text]);
49
54
  return /*#__PURE__*/React.createElement(StyledCopyToClipboard, {
50
55
  $codeTheme: theme,
51
56
  ref: actionGroupRef
@@ -59,9 +64,11 @@ const CopyToClipboard = ({
59
64
  type: "button"
60
65
  }, /*#__PURE__*/React.createElement(Icon, {
61
66
  color: iconColor,
62
- icons: ['fa-light fa-copy']
67
+ icons: hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']
63
68
  })), /*#__PURE__*/React.createElement(SharingContextMenu, {
64
69
  link: text,
70
+ shouldShowCallingCodeAction: false,
71
+ shouldShowCopyAction: false,
65
72
  shouldUseDefaultTriggerStyles: false
66
73
  }, /*#__PURE__*/React.createElement(StyledCopyToClipboardButton, {
67
74
  $codeTheme: theme,
@@ -1 +1 @@
1
- {"version":3,"file":"CopyToClipboard.js","names":["Icon","SharingContextMenu","ttsToITextString","useTextstringValue","createDialog","DialogType","ToastType","React","useCallback","useRef","CodeHighlighterTheme","StyledCopyToClipboard","StyledCopyToClipboardActionGroup","StyledCopyToClipboardButton","textStrings","useStickyActionState","CopyToClipboard","copyButtonText","rootRef","text","theme","actionGroupRef","isActionGroupSticky","defaultCopyText","textstring","components","codeHighlighter","copyToClipboard","copy","copiedText","copied","copyFailedText","copyFailed","shareText","share","copyText","iconColor","Dark","handleCopy","navigator","clipboard","writeText","showCloseIcon","toastType","SUCCESS","type","TOAST","open","ERROR","createElement","$codeTheme","ref","$isSticky","onClick","color","icons","link","shouldUseDefaultTriggerStyles","displayName"],"sources":["../../../../../src/components/code-highlighter/copy-to-clipboard/CopyToClipboard.tsx"],"sourcesContent":["import { Icon, SharingContextMenu } from '@chayns-components/core';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport { createDialog, DialogType, ToastType } from 'chayns-api';\nimport React, { FC, RefObject, useCallback, useRef } from 'react';\nimport { CodeHighlighterTheme } from '../../../types/codeHighlighter';\nimport {\n StyledCopyToClipboard,\n StyledCopyToClipboardActionGroup,\n StyledCopyToClipboardButton,\n} from './CopyToClipboard.styles';\nimport textStrings from '../../../constants/textStrings';\nimport { useStickyActionState } from './useStickyActionState';\n\nexport type CopyToClipboardProps = {\n copyButtonText?: string;\n rootRef: RefObject<HTMLDivElement>;\n text: string;\n theme: CodeHighlighterTheme;\n};\n\nconst CopyToClipboard: FC<CopyToClipboardProps> = ({ copyButtonText, rootRef, text, theme }) => {\n const actionGroupRef = useRef<HTMLDivElement>(null);\n const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);\n\n const defaultCopyText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copy),\n });\n const copiedText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copied),\n });\n const copyFailedText = useTextstringValue({\n textstring: ttsToITextString(\n textStrings.components.codeHighlighter.copyToClipboard.copyFailed,\n ),\n });\n const shareText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.share),\n });\n\n const copyText = copyButtonText ?? defaultCopyText;\n const iconColor = theme === CodeHighlighterTheme.Dark ? '#f4f6f8' : '#5f6368';\n\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(text);\n void createDialog({\n showCloseIcon: true,\n text: copiedText,\n toastType: ToastType.SUCCESS,\n type: DialogType.TOAST,\n }).open();\n } catch {\n void createDialog({\n showCloseIcon: true,\n text: copyFailedText,\n toastType: ToastType.ERROR,\n type: DialogType.TOAST,\n }).open();\n }\n }, [copiedText, copyFailedText, text]);\n\n return (\n <StyledCopyToClipboard $codeTheme={theme} ref={actionGroupRef}>\n <StyledCopyToClipboardActionGroup>\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={copyText}\n onClick={() => {\n void handleCopy();\n }}\n type=\"button\"\n >\n <Icon color={iconColor} icons={['fa-light fa-copy']} />\n </StyledCopyToClipboardButton>\n <SharingContextMenu link={text} shouldUseDefaultTriggerStyles={false}>\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={shareText}\n type=\"button\"\n >\n <Icon color={iconColor} icons={['fa fa-share-nodes']} />\n </StyledCopyToClipboardButton>\n </SharingContextMenu>\n </StyledCopyToClipboardActionGroup>\n </StyledCopyToClipboard>\n );\n};\n\nCopyToClipboard.displayName = 'CopyToClipboard';\n\nexport default CopyToClipboard;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"CopyToClipboard.js","names":["Icon","SharingContextMenu","ttsToITextString","useTextstringValue","createDialog","DialogType","ToastType","React","useCallback","useEffect","useRef","useState","CodeHighlighterTheme","StyledCopyToClipboard","StyledCopyToClipboardActionGroup","StyledCopyToClipboardButton","textStrings","useStickyActionState","COPY_FEEDBACK_DURATION","CopyToClipboard","copyButtonText","rootRef","text","theme","actionGroupRef","copyFeedbackTimeoutRef","isActionGroupSticky","hasCopied","setHasCopied","defaultCopyText","textstring","components","codeHighlighter","copyToClipboard","copy","copyFailedText","copyFailed","shareText","share","copyText","iconColor","Dark","window","clearTimeout","current","showCopyFeedback","setTimeout","handleCopy","navigator","clipboard","writeText","showCloseIcon","toastType","ERROR","type","TOAST","open","createElement","$codeTheme","ref","$isSticky","onClick","color","icons","link","shouldShowCallingCodeAction","shouldShowCopyAction","shouldUseDefaultTriggerStyles","displayName"],"sources":["../../../../../src/components/code-highlighter/copy-to-clipboard/CopyToClipboard.tsx"],"sourcesContent":["import { Icon, SharingContextMenu } from '@chayns-components/core';\nimport { ttsToITextString, useTextstringValue } from '@chayns-components/textstring';\nimport { createDialog, DialogType, ToastType } from 'chayns-api';\nimport React, { FC, RefObject, useCallback, useEffect, useRef, useState } from 'react';\nimport { CodeHighlighterTheme } from '../../../types/codeHighlighter';\nimport {\n StyledCopyToClipboard,\n StyledCopyToClipboardActionGroup,\n StyledCopyToClipboardButton,\n} from './CopyToClipboard.styles';\nimport textStrings from '../../../constants/textStrings';\nimport { useStickyActionState } from './useStickyActionState';\n\nexport type CopyToClipboardProps = {\n copyButtonText?: string;\n rootRef: RefObject<HTMLDivElement>;\n text: string;\n theme: CodeHighlighterTheme;\n};\n\nconst COPY_FEEDBACK_DURATION = 1500;\n\nconst CopyToClipboard: FC<CopyToClipboardProps> = ({ copyButtonText, rootRef, text, theme }) => {\n const actionGroupRef = useRef<HTMLDivElement>(null);\n const copyFeedbackTimeoutRef = useRef<number>();\n const isActionGroupSticky = useStickyActionState(rootRef, actionGroupRef);\n const [hasCopied, setHasCopied] = useState(false);\n\n const defaultCopyText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.copy),\n });\n const copyFailedText = useTextstringValue({\n textstring: ttsToITextString(\n textStrings.components.codeHighlighter.copyToClipboard.copyFailed,\n ),\n });\n const shareText = useTextstringValue({\n textstring: ttsToITextString(textStrings.components.codeHighlighter.copyToClipboard.share),\n });\n\n const copyText = copyButtonText ?? defaultCopyText;\n const iconColor = theme === CodeHighlighterTheme.Dark ? '#f4f6f8' : '#5f6368';\n\n useEffect(\n () => () => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n },\n [],\n );\n\n const showCopyFeedback = useCallback(() => {\n window.clearTimeout(copyFeedbackTimeoutRef.current);\n setHasCopied(true);\n\n copyFeedbackTimeoutRef.current = window.setTimeout(() => {\n setHasCopied(false);\n }, COPY_FEEDBACK_DURATION);\n }, []);\n\n const handleCopy = useCallback(async () => {\n try {\n await navigator.clipboard.writeText(text);\n showCopyFeedback();\n } catch {\n void createDialog({\n showCloseIcon: true,\n text: copyFailedText,\n toastType: ToastType.ERROR,\n type: DialogType.TOAST,\n }).open();\n }\n }, [copyFailedText, showCopyFeedback, text]);\n\n return (\n <StyledCopyToClipboard $codeTheme={theme} ref={actionGroupRef}>\n <StyledCopyToClipboardActionGroup>\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={copyText}\n onClick={() => {\n void handleCopy();\n }}\n type=\"button\"\n >\n <Icon\n color={iconColor}\n icons={hasCopied ? ['fa fa-check'] : ['fa-light fa-copy']}\n />\n </StyledCopyToClipboardButton>\n <SharingContextMenu\n link={text}\n shouldShowCallingCodeAction={false}\n shouldShowCopyAction={false}\n shouldUseDefaultTriggerStyles={false}\n >\n <StyledCopyToClipboardButton\n $codeTheme={theme}\n $isSticky={isActionGroupSticky}\n aria-label={shareText}\n type=\"button\"\n >\n <Icon color={iconColor} icons={['fa fa-share-nodes']} />\n </StyledCopyToClipboardButton>\n </SharingContextMenu>\n </StyledCopyToClipboardActionGroup>\n </StyledCopyToClipboard>\n );\n};\n\nCopyToClipboard.displayName = 'CopyToClipboard';\n\nexport default CopyToClipboard;\n"],"mappings":"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","ignoreList":[]}
@@ -6,10 +6,6 @@ export default {
6
6
  stringName: 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy',
7
7
  fallback: 'Kopieren'
8
8
  },
9
- copied: {
10
- stringName: 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copied',
11
- fallback: 'Kopiert!'
12
- },
13
9
  copyFailed: {
14
10
  stringName: 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed',
15
11
  fallback: 'Kopieren fehlgeschlagen'
@@ -1 +1 @@
1
- {"version":3,"file":"textStrings.js","names":["components","codeHighlighter","copyToClipboard","copy","stringName","fallback","copied","copyFailed","share"],"sources":["../../../src/constants/textStrings.ts"],"sourcesContent":["export default {\n components: {\n codeHighlighter: {\n copyToClipboard: {\n copy: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy',\n fallback: 'Kopieren',\n },\n copied: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copied',\n fallback: 'Kopiert!',\n },\n copyFailed: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed',\n fallback: 'Kopieren fehlgeschlagen',\n },\n share: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_share',\n fallback: 'Teilen',\n },\n },\n },\n },\n} as const;\n"],"mappings":"AAAA,eAAe;EACXA,UAAU,EAAE;IACRC,eAAe,EAAE;MACbC,eAAe,EAAE;QACbC,IAAI,EAAE;UACFC,UAAU,EACN,wFAAwF;UAC5FC,QAAQ,EAAE;QACd,CAAC;QACDC,MAAM,EAAE;UACJF,UAAU,EACN,0FAA0F;UAC9FC,QAAQ,EAAE;QACd,CAAC;QACDE,UAAU,EAAE;UACRH,UAAU,EACN,8FAA8F;UAClGC,QAAQ,EAAE;QACd,CAAC;QACDG,KAAK,EAAE;UACHJ,UAAU,EACN,yFAAyF;UAC7FC,QAAQ,EAAE;QACd;MACJ;IACJ;EACJ;AACJ,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"textStrings.js","names":["components","codeHighlighter","copyToClipboard","copy","stringName","fallback","copyFailed","share"],"sources":["../../../src/constants/textStrings.ts"],"sourcesContent":["export default {\n components: {\n codeHighlighter: {\n copyToClipboard: {\n copy: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy',\n fallback: 'Kopieren',\n },\n copyFailed: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed',\n fallback: 'Kopieren fehlgeschlagen',\n },\n share: {\n stringName:\n 'txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_share',\n fallback: 'Teilen',\n },\n },\n },\n },\n} as const;\n"],"mappings":"AAAA,eAAe;EACXA,UAAU,EAAE;IACRC,eAAe,EAAE;MACbC,eAAe,EAAE;QACbC,IAAI,EAAE;UACFC,UAAU,EACN,wFAAwF;UAC5FC,QAAQ,EAAE;QACd,CAAC;QACDC,UAAU,EAAE;UACRF,UAAU,EACN,8FAA8F;UAClGC,QAAQ,EAAE;QACd,CAAC;QACDE,KAAK,EAAE;UACHH,UAAU,EACN,yFAAyF;UAC7FC,QAAQ,EAAE;QACd;MACJ;IACJ;EACJ;AACJ,CAAC","ignoreList":[]}
@@ -6,10 +6,6 @@ declare const _default: {
6
6
  readonly stringName: "txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copy";
7
7
  readonly fallback: "Kopieren";
8
8
  };
9
- readonly copied: {
10
- readonly stringName: "txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copied";
11
- readonly fallback: "Kopiert!";
12
- };
13
9
  readonly copyFailed: {
14
10
  readonly stringName: "txt_chayns_components_code_highlighter_components_codeHighlighter_copyToClipboard_copyFailed";
15
11
  readonly fallback: "Kopieren fehlgeschlagen";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@chayns-components/code-highlighter",
3
- "version": "5.5.12",
3
+ "version": "5.5.20",
4
4
  "description": "A set of beautiful React components for developing your own applications with chayns.",
5
5
  "sideEffects": false,
6
6
  "browserslist": [
@@ -66,7 +66,6 @@
66
66
  "babel-loader": "^9.2.1",
67
67
  "cross-env": "^7.0.3",
68
68
  "jsdom": "^26.1.0",
69
- "lerna": "^8.2.4",
70
69
  "react": "^18.3.1",
71
70
  "react-dom": "^18.3.1",
72
71
  "styled-components": "^6.4.4",
@@ -74,8 +73,8 @@
74
73
  "vitest": "^1.6.1"
75
74
  },
76
75
  "dependencies": {
77
- "@chayns-components/core": "^5.5.12",
78
- "@chayns-components/textstring": "^5.5.12",
76
+ "@chayns-components/core": "^5.5.20",
77
+ "@chayns-components/textstring": "^5.5.20",
79
78
  "@types/react-syntax-highlighter": "^15.5.13",
80
79
  "babel-prettier-parser": "^0.10.8",
81
80
  "prettier": "^2.8.8",
@@ -91,6 +90,5 @@
91
90
  },
92
91
  "publishConfig": {
93
92
  "access": "public"
94
- },
95
- "gitHead": "55815a2a8c38fc3ed62f8b1bd1ee0bf34ccf4eef"
93
+ }
96
94
  }
package/LICENSE DELETED
@@ -1,21 +0,0 @@
1
- The MIT License (MIT)
2
-
3
- Copyright (c) 2021 Tobit Laboratories AG
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.