{"version":3,"file":"copyButton.mjs","names":[],"sources":["../../../../package/common/copyButton/copyButton.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { faCheck, faCopy } from '@fortawesome/free-solid-svg-icons';\n\nimport ActionIcon from '../actionIcon';\nimport AnimatedIcon from '../animatedIcon';\nimport { useComponentDefaults, useLabels } from '../configProvider';\nimport { useClipboard } from '../hooks/useClipboard';\nimport { isIconDefinition, renderIcon } from '../utils/renderIcon';\nimport type { CopyButtonLabels, CopyButtonProps } from './copyButton.types';\nimport styles from './copyButton.module.pcss';\nimport { ThemeColor } from '../themeProvider/color.types';\n\nconst DEFAULT_LABELS: Required<CopyButtonLabels> = {\n  copy: 'Copy',\n  copied: 'Copied',\n  failed: 'Could not copy',\n};\n\nfunction CopyButton(props: CopyButtonProps): ReactElement {\n  const {\n    value,\n    timeout = 2000,\n    icon = faCopy,\n    copiedIcon = faCheck,\n    onCopy,\n    onError,\n    onClick,\n    color,\n    labels,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('CopyButton', props);\n  const text = useLabels('CopyButton', labels, DEFAULT_LABELS);\n  const { copy, copied, error } = useClipboard({ timeout });\n\n  const label = copied ? text.copied : text.copy;\n  const current = copied ? copiedIcon : icon;\n  const iconElement =\n    isIconDefinition(icon) && isIconDefinition(copiedIcon) ? (\n      <AnimatedIcon\n        icon={copied ? copiedIcon : icon}\n        classNames={{ icon: classNames?.icon }}\n        styles={{ icon: slotStyles?.icon }}\n      />\n    ) : (\n      renderIcon(current, { className: classNames?.icon, style: slotStyles?.icon })\n    );\n\n  return (\n    <>\n      <ActionIcon\n        {...rest}\n        icon={<>{iconElement}</>}\n        title={label}\n        aria-label={label}\n        color={copied ? ThemeColor.Success : color}\n        className={className}\n        style={style}\n        classNames={{ root: classNames?.root }}\n        styles={{ root: slotStyles?.root }}\n        onClick={async (event) => {\n          onClick?.(event);\n          if (await copy(value)) onCopy?.(value);\n          else onError?.();\n        }}\n      />\n      {/* Beside the button, not in it: a live region inside a button is not reliably announced. */}\n      <span className={styles.copyButtonStatus} role='status' aria-live='polite'>\n        {copied ? text.copied : error ? text.failed : ''}\n      </span>\n    </>\n  );\n}\n\nexport default CopyButton;\n"],"mappings":"wlBAYA,IAAM,EAA6C,CACjD,KAAM,OACN,OAAQ,SACR,OAAQ,gBACV,EAEA,SAAS,EAAW,EAAsC,CACxD,GAAM,CACJ,QACA,UAAU,IACV,OAAO,EACP,aAAa,EACb,SACA,UACA,UACA,QACA,SACA,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,aAAc,CAAK,EACtC,EAAO,EAAU,aAAc,EAAQ,CAAc,EACrD,CAAE,OAAM,SAAQ,SAAU,EAAa,CAAE,SAAQ,CAAC,EAElD,EAAQ,EAAS,EAAK,OAAS,EAAK,KACpC,EAAU,EAAS,EAAa,EAChC,EACJ,EAAiB,CAAI,GAAK,EAAiB,CAAU,EACnD,EAAC,EAAD,CACE,KAAM,EAAS,EAAa,EAC5B,WAAY,CAAE,KAAM,GAAY,IAAK,EACrC,OAAQ,CAAE,KAAM,GAAY,IAAK,CAClC,CAAA,EAED,EAAW,EAAS,CAAE,UAAW,GAAY,KAAM,MAAO,GAAY,IAAK,CAAC,EAGhF,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,EAAD,CACE,GAAI,EACJ,KAAM,EAAA,EAAA,CAAA,SAAG,CAAc,CAAA,EACvB,MAAO,EACP,aAAY,EACZ,MAAO,EAAS,EAAW,QAAU,EAC1B,YACJ,QACP,WAAY,CAAE,KAAM,GAAY,IAAK,EACrC,OAAQ,CAAE,KAAM,GAAY,IAAK,EACjC,QAAS,KAAO,IAAU,CACxB,IAAU,CAAK,EACX,MAAM,EAAK,CAAK,EAAG,IAAS,CAAK,EAChC,IAAU,CACjB,CACD,CAAA,EAED,EAAC,OAAD,CAAM,UAAW,EAAO,iBAAkB,KAAK,SAAS,YAAU,SAC/D,SAAA,EAAS,EAAK,OAAS,EAAQ,EAAK,OAAS,EAC1C,CAAA,CACN,CAAA,CAAA,CAEN"}