{"version":3,"file":"copy-button.cjs","sources":["../../../components/copy-button/copy-button.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useRef, useState } from 'react';\nimport { useCopyToClipboard } from '~/hooks/useCopyToClipboard';\nimport { CheckIcon, CopyIcon } from '~/icons';\nimport { IconButton, IconButtonProps } from '../icon-button/icon-button';\nimport styles from './copy-button.module.css';\n\nexport interface CopyButtonProps extends IconButtonProps {\n  text: string;\n  resetTimeout?: number;\n  resetIcon?: boolean;\n}\n\nexport function CopyButton({\n  text,\n  resetTimeout = 1000,\n  resetIcon = true,\n  ...props\n}: CopyButtonProps) {\n  const { copy } = useCopyToClipboard();\n  const [copied, setCopied] = useState(false);\n  const resetTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    return () => {\n      if (resetTimerRef.current !== null) clearTimeout(resetTimerRef.current);\n    };\n  }, []);\n\n  async function onCopy() {\n    const res = await copy(text);\n    if (!res) return;\n    setCopied(true);\n    if (resetIcon) {\n      if (resetTimerRef.current !== null) clearTimeout(resetTimerRef.current);\n      resetTimerRef.current = setTimeout(() => {\n        setCopied(false);\n        resetTimerRef.current = null;\n      }, resetTimeout);\n    }\n  }\n\n  return (\n    <>\n      <IconButton\n        aria-label='Copy'\n        data-slot='copy-button'\n        {...props}\n        onClick={onCopy}\n        data-test-id='copy-button'\n      >\n        <span\n          className={styles.iconSwap}\n          data-copied={copied || undefined}\n          data-slot='copy-button-icons'\n        >\n          <CopyIcon\n            className={styles.copyIcon}\n            data-slot='copy-button-copy-icon'\n          />\n          <CheckIcon\n            className={styles.checkIcon}\n            color='var(--rs-color-foreground-success-primary)'\n            data-slot='copy-button-check-icon'\n          />\n        </span>\n      </IconButton>\n      <span\n        className={styles['sr-only']}\n        role='status'\n        aria-live='polite'\n        data-slot='copy-button-status'\n      >\n        {copied ? 'Copied' : ''}\n      </span>\n    </>\n  );\n}\n\nCopyButton.displayName = 'CopyButton';\n"],"names":[],"mappings":";;;;;;;;;;;;AAoBE;;AAEA;;AAGE;AACE;AAAoC;AACtC;;AAGF;AACE;AACA;;;;AAGE;AAAoC;AACpC;;AAEE;;;;AAKN;AAmCF;AAEA;;"}