import{jsx as _jsx}from"react/jsx-runtime";import{Suspense,memo,useEffect,useState}from"react";import styled from"styled-components";import{useAtomValue}from"jotai";import{EmbeddedReplay as EmbeddedReplayOrig}from"@redocly/replay";import{convertOperationToReplayValue}from"./utils";import{globalOptionsAtom}from"../../jotai/store";import{operationStore}from"../../jotai/operation";import{appStore,environmentsAtom}from"../../jotai/app";function EmbeddedReplayComponent({operation:e,corsProxyUrl:o,fullOpenApi:r}){const{routingBasePath:t,mockServer:a}=useAtomValue(globalOptionsAtom),p=useAtomValue(operationStore(e.pointer)),n=useAtomValue(appStore),i=useAtomValue(environmentsAtom),[m,s]=useState(!1);return useEffect((()=>{s(!0)}),[]),_jsx(CompactWrapper,{children:m?_jsx(Suspense,{fallback:_jsx(LoadingWrapper,{children:"Loading..."}),children:_jsx(EmbeddedReplayOrig,{value:convertOperationToReplayValue(e,r,p,n),environment:n.environment,predefinedEnvValues:i,corsProxyUrl:o,operationUrl:t+e.href,mockServer:a})}):_jsx(LoadingWrapper,{children:"Loading..."})})}export const EmbeddedReplay=memo(EmbeddedReplayComponent);const LoadingWrapper=styled.div`
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100px;
`,CompactWrapper=styled.div`
  border: 1px solid var(--border-color-primary);
  border-radius: var(--border-radius-lg);
  padding: 0;
`;
//# sourceMappingURL=EmbeddedReplay.js.map