{
  "version": 3,
  "sources": ["../javascripts/styled-components/structures/ShareButton/index.tsx", "../javascripts/styled-components/structures/ShareButton/wrapper.tsx"],
  "sourcesContent": ["import React, { useState, useRef } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Button } from '../../components/Button';\nimport { IconCheck, IconCopy, IconShare } from '../../components/Icon';\nimport InputText from '../../components/InputText';\nimport Modal from '../../components/Modal';\nimport { Text } from '../../components/Text';\nimport { InputWrapper } from './wrapper';\n\nconst ShareButton = () => {\n  const { t } = useTranslation(['common', 'other']);\n  const [shareModal, setShareModal] = useState(false);\n  const [valueCopied, setValueCopied] = useState(false);\n  const inputRef = useRef<HTMLInputElement>(null);\n\n  const onClick = () => {\n    if (navigator.share) {\n      navigator.share({\n        url: window.location.href,\n      });\n    } else {\n      setShareModal(true);\n    }\n  };\n\n  const onCopyToClipboard = () => {\n    if (inputRef.current) {\n      inputRef.current.select();\n      document.execCommand('copy');\n      setValueCopied(true);\n    }\n  };\n\n  const onCloseModal = () => {\n    setShareModal(false);\n    setValueCopied(false);\n  };\n\n  return (\n    <>\n      <Button\n        $shadow\n        $fullWidth\n        $size=\"small\"\n        onClick={onClick}\n        title={t('Share', { ns: 'common' })}\n      >\n        <Text $tone=\"secondary\">\n          <IconShare $size=\"20px\" />\n        </Text>\n        {t('Share', { ns: 'common' })}\n      </Button>\n      {shareModal && (\n        <Modal heading={t('copyLink', { ns: 'other' })} onClose={onCloseModal}>\n          <InputWrapper>\n            <InputText\n              readOnly\n              value={window.location.href}\n              ref={inputRef}\n              aria-label={t('linkToShare', { ns: 'other' })}\n            />\n            <Button\n              $shadow\n              $size=\"small\"\n              onClick={onCopyToClipboard}\n              title={t('copyLink', { ns: 'other' })}\n            >\n              {valueCopied ? (\n                <>\n                  <Text $tone=\"secondary\" aria-hidden=\"true\">\n                    <IconCheck $size=\"20px\" />\n                  </Text>\n                  {t('copied', { ns: 'other' })}\n                </>\n              ) : (\n                <>\n                  <Text $tone=\"secondary\" aria-hidden=\"true\">\n                    <IconCopy $size=\"20px\" />\n                  </Text>\n                  {t('copy', { ns: 'other' })}\n                </>\n              )}\n            </Button>\n          </InputWrapper>\n        </Modal>\n      )}\n    </>\n  );\n};\n\nexport default ShareButton;\n", "import styled from 'styled-components';\nimport { Button } from '../../components/Button';\nimport { Wrapper as InputTextWrapper } from '../../components/InputText/wrapper';\nimport { size } from '../../layout/helpers';\n\nexport const InputWrapper = styled.div.withConfig({ componentId: 'sc-nm9j1b-0' })`\n    display: flex;\n    align-items: center;\n    gap: ${size(2)};\n\n    ${InputTextWrapper} {\n        flex: 1 1 auto;\n    }\n\n    ${Button} {\n        flex-shrink: 0;\n    }\n\n    ${(props) => props.theme.breakpoint.LtSm} {\n        flex-direction: column;\n\n        ${InputTextWrapper} {\n            width: 100%;\n        }\n\n        ${Button} {\n            width: 100%;\n        }\n    }\n`;\n"],
  "mappings": "2ZAAA,IAAAA,EAAwC,SCKjC,IAAMC,EAAeC,EAAO,IAAI,WAAW,CAAE,YAAa,aAAc,CAAC;AAAA;AAAA;AAAA,WAGrEC,EAAK,CAAC,CAAC;AAAA;AAAA,MAEZC,CAAgB;AAAA;AAAA;AAAA;AAAA,MAIhBC,CAAM;AAAA;AAAA;AAAA;AAAA,MAILC,GAAUA,EAAM,MAAM,WAAW,IAAI;AAAA;AAAA;AAAA,UAGlCF,CAAgB;AAAA;AAAA;AAAA;AAAA,UAIhBC,CAAM;AAAA;AAAA;AAAA;EDhBhB,IAAME,EAAc,IAAM,CACxB,GAAM,CAAE,EAAAC,CAAE,EAAIC,EAAe,CAAC,SAAU,OAAO,CAAC,EAC1C,CAACC,EAAYC,CAAa,KAAI,YAAS,EAAK,EAC5C,CAACC,EAAaC,CAAc,KAAI,YAAS,EAAK,EAC9CC,KAAW,UAAyB,IAAI,EAExCC,EAAU,IAAM,CAChB,UAAU,MACZ,UAAU,MAAM,CACd,IAAK,OAAO,SAAS,IACvB,CAAC,EAEDJ,EAAc,EAAI,CAEtB,EAEMK,EAAoB,IAAM,CAC1BF,EAAS,UACXA,EAAS,QAAQ,OAAO,EACxB,SAAS,YAAY,MAAM,EAC3BD,EAAe,EAAI,EAEvB,EAEMI,EAAe,IAAM,CACzBN,EAAc,EAAK,EACnBE,EAAe,EAAK,CACtB,EAEA,OACE,EAAAK,QAAA,gBAAAA,QAAA,cACE,EAAAA,QAAA,cAACC,EAAA,CACC,QAAO,GACP,WAAU,GACV,MAAM,QACN,QAASJ,EACT,MAAOP,EAAE,QAAS,CAAE,GAAI,QAAS,CAAC,GAElC,EAAAU,QAAA,cAACE,EAAA,CAAK,MAAM,aACV,EAAAF,QAAA,cAACG,EAAA,CAAU,MAAM,OAAO,CAC1B,EACCb,EAAE,QAAS,CAAE,GAAI,QAAS,CAAC,CAC9B,EACCE,GACC,EAAAQ,QAAA,cAACI,EAAA,CAAM,QAASd,EAAE,WAAY,CAAE,GAAI,OAAQ,CAAC,EAAG,QAASS,GACvD,EAAAC,QAAA,cAACK,EAAA,KACC,EAAAL,QAAA,cAACM,EAAA,CACC,SAAQ,GACR,MAAO,OAAO,SAAS,KACvB,IAAKV,EACL,aAAYN,EAAE,cAAe,CAAE,GAAI,OAAQ,CAAC,EAC9C,EACA,EAAAU,QAAA,cAACC,EAAA,CACC,QAAO,GACP,MAAM,QACN,QAASH,EACT,MAAOR,EAAE,WAAY,CAAE,GAAI,OAAQ,CAAC,GAEnCI,EACC,EAAAM,QAAA,gBAAAA,QAAA,cACE,EAAAA,QAAA,cAACE,EAAA,CAAK,MAAM,YAAY,cAAY,QAClC,EAAAF,QAAA,cAACO,EAAA,CAAU,MAAM,OAAO,CAC1B,EACCjB,EAAE,SAAU,CAAE,GAAI,OAAQ,CAAC,CAC9B,EAEA,EAAAU,QAAA,gBAAAA,QAAA,cACE,EAAAA,QAAA,cAACE,EAAA,CAAK,MAAM,YAAY,cAAY,QAClC,EAAAF,QAAA,cAACQ,EAAA,CAAS,MAAM,OAAO,CACzB,EACClB,EAAE,OAAQ,CAAE,GAAI,OAAQ,CAAC,CAC5B,CAEJ,CACF,CACF,CAEJ,CAEJ,EAEOmB,EAAQpB",
  "names": ["import_react", "InputWrapper", "dt", "size", "Wrapper", "Button", "props", "ShareButton", "t", "useTranslation", "shareModal", "setShareModal", "valueCopied", "setValueCopied", "inputRef", "onClick", "onCopyToClipboard", "onCloseModal", "React", "Button", "Text", "IconShare", "Modal_default", "InputWrapper", "InputText_default", "IconCheck", "IconCopy", "ShareButton_default"]
}