import e,{useState as o}from"react";import a from"styled-components";import{EditIcon as i}from"@redocly/theme/icons/EditIcon/EditIcon";import{useTranslate as s}from"../../../../../client/app/hooks";import{EditCallbackUrlDialog as c}from"./EditCallbackUrlDialog";const u=({text:l})=>{const[r,t]=o(!1),{translate:n}=s();return e.createElement(e.Fragment,null,e.createElement(c,{open:r,onOpen:()=>t(!0),onClose:()=>t(!1),initialCallbackUrl:l}),e.createElement(m,null,e.createElement(p,{"data-translation-key":"dev.app.callbackUrls.title"},n("dev.app.callbackUrls.title","Callback URLs")),e.createElement(i,{onClick:()=>t(!0)})),e.createElement(g,null,l||"\u2014"))},m=a.div`
  display: flex;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-sm);
  margin-top: var(--spacing-base);

  svg {
    cursor: pointer;
  }
`,p=a.div`
  font-weight: var(--font-weight-bold);
`,g=a.div`
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-regular);
  max-width: 50%;
  word-break: break-all;
`;export{u as CallbackUrl};
