@redocly/openapi-docs 3.11.0-next.1 → 3.11.0-next.2

package/lib-esm/components/Request/types.d.ts

@@ -1,8 +1,10 @@
 import type { TFunction } from '@redocly/theme';
 import type { ReactNode } from 'react';
 import type { OperationModel } from '../../models';
+import type { PanelType } from '../../events/types';
 export interface RequestProps {
     operation: Pick<OperationModel, 'security' | 'pointer' | 'description' | 'externalDocs' | 'extensions' | 'parameters' | 'requestBody' | 'id' | 'callbackId'>;
     title?: string | ReactNode;
     translate?: TFunction;
+    onPanelToggle?: (isExpanded: boolean, panelType?: PanelType) => void;
 }

package/lib-esm/components/RequestSamples/RequestSamples.d.ts

@@ -1,8 +1,10 @@
 import type { OperationModel } from '../../models';
+import type { PanelType } from '../../events/types';
 interface RequestSamplesProps {
     operation: OperationModel;
     defaultLanguage?: string;
     disableFooter?: boolean;
+    onPanelToggle?: (isExpanded: boolean, panelType?: PanelType) => void;
 }
 export declare const RequestSamples: import("react").NamedExoticComponent<RequestSamplesProps>;
 export {};

package/lib-esm/components/RequestSamples/RequestSamples.js

@@ -1,4 +1,4 @@
-var __rest=this&&this.__rest||function(e,o){var a={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&o.indexOf(t)<0&&(a[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(t=Object.getOwnPropertySymbols(e);r<t.length;r++)o.indexOf(t[r])<0&&Object.prototype.propertyIsEnumerable.call(e,t[r])&&(a[t[r]]=e[t[r]])}return a};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{memo,useCallback,useMemo}from"react";import{useAtomValue,useAtom}from"jotai";import{PanelHeader}from"@redocly/theme";import styled from"styled-components";import{PayloadSamples}from"../PayloadSamples";import{CodeSample}from"./CodeSample";import{useCodeSamples}from"./useCodeSamples";import{isPayloadSample}from"../../models";import{createCodeSampleCopyEvent}from"../../events";import{globalStoreAtom}from"../../jotai/store";import{ServerListDropdown}from"../ServerListDropdown";import{LanguageDropdown}from"../Language";import{activeMimeNameAtom,languageAtom}from"../../jotai/app";import{Replay}from"../Replay";import{CodeBlockPanel}from"../common";import{useActiveWithFallback,useTelemetry}from"../../hooks";import{operationStore}from"../../jotai/operation";function RequestSamplesComponent(e){var{operation:o,disableFooter:a}=e,t=__rest(e,["operation","disableFooter"]);const r=useTelemetry(),[{activeLanguage:l,languages:p},s]=useAtom(languageAtom),{samples:n}=useCodeSamples(o),{parser:i,options:{events:m,corsProxyUrl:d,hideReplay:c}}=useAtomValue(globalStoreAtom),u=!(a||o.isWebhook||c||o.hideReplay),y=!!(null==p?void 0:p.length),g=useActiveWithFallback(n,l),f=e=>{s(e),r.send({type:"openapi_docs.select_language.clicked",payload:{language:e}})},v=useAtomValue(activeMimeNameAtom),{activeExampleName:x}=useAtomValue(operationStore(o.pointer)),S=useCallback((({lang:e,title:a})=>()=>{var t;const l=createCodeSampleCopyEvent({operation:o,label:a,lang:e,type:"request",activeMimeName:v,activeExampleName:x});r.send({type:"openapi_docs.copy_code_snippet.clicked",payload:{snippet_type:"request",language:e}}),null===(t=null==m?void 0:m.codeSamplesCopy)||void 0===t||t.call(m,l)}),[o,r,m,v,x]),b=()=>_jsxs(StyledPanelHeader,{isExpandable:!1,withReplay:!y&&u,children:[_jsx(StyledServerListDropdown,{operation:o}),y&&_jsx(LanguageDropdown,{activeTab:g,samples:n,onChange:f}),!y&&u&&_jsx(Replay,{operation:o,corsProxyUrl:d,fullOpenApi:i.definition})]}),j=useMemo((()=>{if(u&&y)return _jsx(ReplayWrapper,{children:_jsx(Replay,{operation:o,corsProxyUrl:d,fullOpenApi:i.definition})})}),[u,y,o,d,i.definition]),h=useMemo((()=>n.map((e=>e.key===g?_jsx("div",{children:isPayloadSample(e)?_jsx(PayloadSamples,Object.assign({content:e.requestBodyContent,onCopyClick:S(e)},t)):_jsx(CodeSample,Object.assign({lang:e.lang,source:e.source,externalSample:e,operation:o,onCopyClick:S(e)},t))},e.key+o.id):null))),[g,S,o,t,n]);return p&&!n.length?_jsx(CodeBlockPanel,{className:"panel-request-samples",header:b,isExpandable:!1,expanded:!1}):n.length?_jsx(CodeBlockPanel,{className:"panel-request-samples",header:b,footer:j,isExpandable:!1,children:h}):null}export const RequestSamples=memo(RequestSamplesComponent);const StyledPanelHeader=styled(PanelHeader)`
+var __rest=this&&this.__rest||function(e,a){var o={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&a.indexOf(t)<0&&(o[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(t=Object.getOwnPropertySymbols(e);l<t.length;l++)a.indexOf(t[l])<0&&Object.prototype.propertyIsEnumerable.call(e,t[l])&&(o[t[l]]=e[t[l]])}return o};import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{memo,useCallback,useMemo}from"react";import{useAtomValue,useAtom}from"jotai";import{PanelHeader}from"@redocly/theme";import styled from"styled-components";import{PayloadSamples}from"../PayloadSamples";import{CodeSample}from"./CodeSample";import{useCodeSamples}from"./useCodeSamples";import{isPayloadSample}from"../../models";import{createCodeSampleCopyEvent,createLanguageSwitchEvent}from"../../events";import{globalStoreAtom}from"../../jotai/store";import{ServerListDropdown}from"../ServerListDropdown";import{LanguageDropdown}from"../Language";import{activeMimeNameAtom,languageAtom}from"../../jotai/app";import{Replay}from"../Replay";import{CodeBlockPanel}from"../common";import{useActiveWithFallback,useTelemetry}from"../../hooks";import{operationStore}from"../../jotai/operation";function RequestSamplesComponent(e){var{operation:a,disableFooter:o,onPanelToggle:t}=e,l=__rest(e,["operation","disableFooter","onPanelToggle"]);const r=useTelemetry(),[{activeLanguage:n,languages:s},p]=useAtom(languageAtom),{samples:i}=useCodeSamples(a),{parser:m,options:{events:d,corsProxyUrl:c,hideReplay:u}}=useAtomValue(globalStoreAtom),g=!(o||a.isWebhook||u||a.hideReplay),y=!!(null==s?void 0:s.length),f=useActiveWithFallback(i,n),v=e=>{p(e),r.send({type:"openapi_docs.select_language.clicked",payload:{language:e}});const o=null==s?void 0:s.find((a=>a.key===e));if((null==d?void 0:d.codeSamplesLanguageSwitch)&&o){const e=createLanguageSwitchEvent({operation:a,sample:{lang:o.lang,label:o.title}});d.codeSamplesLanguageSwitch(e)}},S=useAtomValue(activeMimeNameAtom),{activeExampleName:x}=useAtomValue(operationStore(a.pointer)),b=useCallback((({lang:e,title:o})=>()=>{var t;const l=createCodeSampleCopyEvent({operation:a,label:o,lang:e,type:"request",activeMimeName:S,activeExampleName:x});r.send({type:"openapi_docs.copy_code_snippet.clicked",payload:{snippet_type:"request",language:e}}),null===(t=null==d?void 0:d.codeSamplesCopy)||void 0===t||t.call(d,l)}),[a,r,d,S,x]),h=useCallback((e=>{null==t||t(e,"request-samples")}),[t]),j=()=>_jsxs(StyledPanelHeader,{isExpandable:!1,withReplay:!y&&g,children:[_jsx(StyledServerListDropdown,{operation:a}),y&&_jsx(LanguageDropdown,{activeTab:f,samples:i,onChange:v}),!y&&g&&_jsx(Replay,{operation:a,corsProxyUrl:c,fullOpenApi:m.definition})]}),C=useMemo((()=>{if(g&&y)return _jsx(ReplayWrapper,{children:_jsx(Replay,{operation:a,corsProxyUrl:c,fullOpenApi:m.definition})})}),[g,y,a,c,m.definition]),_=useMemo((()=>i.map((e=>e.key===f?_jsx("div",{children:isPayloadSample(e)?_jsx(PayloadSamples,Object.assign({content:e.requestBodyContent,onCopyClick:b(e),onPanelToggle:h},l)):_jsx(CodeSample,Object.assign({lang:e.lang,source:e.source,externalSample:e,operation:a,onCopyClick:b(e)},l))},e.key+a.id):null))),[f,b,h,a,l,i]);return s&&!i.length?_jsx(CodeBlockPanel,{className:"panel-request-samples",header:j,isExpandable:!1,expanded:!1}):i.length?_jsx(CodeBlockPanel,{className:"panel-request-samples",header:j,footer:C,isExpandable:!1,children:_}):null}export const RequestSamples=memo(RequestSamplesComponent);const StyledPanelHeader=styled(PanelHeader)`
   flex-wrap: nowrap;
   ${({withReplay:e})=>e&&"padding: var(--spacing-xs) var(--spacing-sm);"}
 `,StyledServerListDropdown=styled(ServerListDropdown)`

package/lib-esm/components/ResponseSamples/ResponseSamples.d.ts

@@ -1,10 +1,12 @@
 import type { ReactElement } from 'react';
 import type { OperationModel } from '../../models';
+import type { PanelType } from '../../events/types';
 export interface ResponseSamplesProps {
     operation: OperationModel;
     activeResponseTab?: string;
     onTabChange: (tab: string) => void;
+    onPanelToggle?: (isExpanded: boolean, panelType?: PanelType) => void;
 }
-declare function ResponseSamplesComponent({ operation, activeResponseTab, onTabChange, }: ResponseSamplesProps): ReactElement | null;
+declare function ResponseSamplesComponent({ operation, activeResponseTab, onTabChange, onPanelToggle, }: ResponseSamplesProps): ReactElement | null;
 export declare const ResponseSamples: import("react").MemoExoticComponent<typeof ResponseSamplesComponent>;
 export {};

package/lib-esm/components/ResponseSamples/ResponseSamples.js

@@ -1,2 +1,2 @@
-import{jsx as _jsx}from"react/jsx-runtime";import{memo,useCallback}from"react";import{useAtomValue}from"jotai";import{PayloadSamples,StyledCodeBlock}from"../PayloadSamples";import{createCodeSampleCopyEvent}from"../../events";import{globalOptionsAtom}from"../../jotai/store";import{Summary}from"./Summary";import{Tabs}from"../Tabs";import{CodeBlockPanel}from"../common";import{useTelemetry,useTranslate}from"../../hooks";import{activeMimeNameAtom}from"../../jotai/app";import{operationStore}from"../../jotai/operation";function ResponseSamplesComponent({operation:e,activeResponseTab:o,onTabChange:a}){const t=useTelemetry(),{events:n}=useAtomValue(globalOptionsAtom),s=useTranslate(),l=e.responses.filter((e=>{var o,a;return null!==(a=null===(o=e.content)||void 0===o?void 0:o.hasSample)&&void 0!==a&&a})),m=e.responses.map((({code:e})=>({key:e,title:e}))),p=(null==m?void 0:m.find((({key:e})=>e===o)))||(null==m?void 0:m[0]),r=useAtomValue(activeMimeNameAtom),{activeExampleName:i}=useAtomValue(operationStore(e.pointer)),c=useCallback((()=>{var o;t.send({type:"openapi_docs.copy_code_snippet.clicked",payload:{snippet_type:"response"}});const a=createCodeSampleCopyEvent({operation:e,type:"response",activeMimeName:r,activeExampleName:i});null===(o=null==n?void 0:n.codeSamplesCopy)||void 0===o||o.call(n,a)}),[t,e,n,r,i]);if(!l.length)return null;return _jsx(CodeBlockPanel,{className:"panel-response-samples",header:()=>_jsx(Summary,{tabs:_jsx(Tabs,{tabs:m,activeTab:p,onChange:e=>a(e.key)})}),isExpandable:!1,children:e.responses.map((e=>{var o;return e.code===p.key?_jsx("div",{children:(null===(o=null==e?void 0:e.content)||void 0===o?void 0:o.hasSample)?_jsx(PayloadSamples,{content:e.content,onCopyClick:c}):_jsx(StyledCodeBlock,{source:s("openapi.noResponseContent","No content")})},e.code):null}))})}export const ResponseSamples=memo(ResponseSamplesComponent);
+import{jsx as _jsx}from"react/jsx-runtime";import{memo,useCallback}from"react";import{useAtomValue}from"jotai";import{PayloadSamples,StyledCodeBlock}from"../PayloadSamples";import{createCodeSampleCopyEvent}from"../../events";import{globalOptionsAtom}from"../../jotai/store";import{Summary}from"./Summary";import{Tabs}from"../Tabs";import{CodeBlockPanel}from"../common";import{useTelemetry,useTranslate}from"../../hooks";import{activeMimeNameAtom}from"../../jotai/app";import{operationStore}from"../../jotai/operation";function ResponseSamplesComponent({operation:e,activeResponseTab:o,onTabChange:a,onPanelToggle:t}){const n=useTelemetry(),{events:s}=useAtomValue(globalOptionsAtom),l=useTranslate(),m=e.responses.filter((e=>{var o,a;return null!==(a=null===(o=e.content)||void 0===o?void 0:o.hasSample)&&void 0!==a&&a})),p=e.responses.map((({code:e})=>({key:e,title:e}))),r=(null==p?void 0:p.find((({key:e})=>e===o)))||(null==p?void 0:p[0]),i=useAtomValue(activeMimeNameAtom),{activeExampleName:c}=useAtomValue(operationStore(e.pointer)),d=useCallback((()=>{var o;n.send({type:"openapi_docs.copy_code_snippet.clicked",payload:{snippet_type:"response"}});const a=createCodeSampleCopyEvent({operation:e,type:"response",activeMimeName:i,activeExampleName:c});null===(o=null==s?void 0:s.codeSamplesCopy)||void 0===o||o.call(s,a)}),[n,e,s,i,c]),u=useCallback((e=>{null==t||t(e,"response-samples")}),[t]);if(!m.length)return null;return _jsx(CodeBlockPanel,{className:"panel-response-samples",header:()=>_jsx(Summary,{tabs:_jsx(Tabs,{tabs:p,activeTab:r,onChange:e=>a(e.key)})}),isExpandable:!1,children:e.responses.map((e=>{var o;return e.code===r.key?_jsx("div",{children:(null===(o=null==e?void 0:e.content)||void 0===o?void 0:o.hasSample)?_jsx(PayloadSamples,{content:e.content,onCopyClick:d,onPanelToggle:u}):_jsx(StyledCodeBlock,{source:l("openapi.noResponseContent","No content")})},e.code):null}))})}export const ResponseSamples=memo(ResponseSamplesComponent);
 //# sourceMappingURL=ResponseSamples.js.map

package/lib-esm/components/Responses/OperationResponseList.d.ts

@@ -1,6 +1,7 @@
 import type { ReactNode } from 'react';
 import type { ResponseModel } from '../../models';
 import type { TabType } from '../../models/tab';
+import type { PanelType } from '../../events/types';
 interface IOperationResponseList {
     responses: ResponseModel[];
     operationId: string;
@@ -9,6 +10,7 @@ interface IOperationResponseList {
     renderTitle?: (tab: TabType) => ReactNode;
     activeResponseTab?: string;
     onTabChange?: (key: string) => void;
+    onPanelToggle?: (isExpanded: boolean, panelType?: PanelType) => void;
 }
 export declare const OperationResponseList: import("react").NamedExoticComponent<IOperationResponseList>;
 export {};

package/lib-esm/components/Responses/OperationResponseList.js

@@ -1,4 +1,4 @@
-import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";import{memo,useMemo}from"react";import{useLocation}from"react-router-dom";import styled from"styled-components";import{useAtomValue}from"jotai";import{Tabs,useTabsState}from"../Tabs";import{ResponseDetails}from"./ResponseDetails";import{makeDeepLink}from"../../services";import{Row,StyledTitle}from"./styled";import{LinkToField}from"../common/LinkToField";import{pathIncludesLink}from"../../utils";import{ExpandAllButton}from"../ExpandAllButton";import{useTranslate}from"../../hooks";import{getActiveMediaType}from"../../models";import{activeMimeNameAtom}from"../../jotai/app";export const OperationResponseList=memo((({responses:e,renderTitle:o,operationId:t,operationPointer:s,activeResponseTab:i,onTabChange:n,callbackId:a})=>{const r=useLocation(),l=useTranslate(),m=useAtomValue(activeMimeNameAtom),p=e.map((({code:e})=>({key:e,title:e}))),d=p.find((({key:e})=>e===i||pathIncludesLink(r,t)&&pathIncludesLink(r,`c=${e}`))),{activeTab:c,handleTabChange:u}=useTabsState({tabs:p,defaultTab:null==d?void 0:d.key,onChange:n}),T=p.find((e=>e.key===(i||c))),f=e.find((e=>e.code===(null==T?void 0:T.key))),v=useMemo((()=>{var e;if(!(null==f?void 0:f.content))return!1;const{schema:o}=getActiveMediaType(null==f?void 0:f.content,m)||{};return null===(e=null==o?void 0:o.fields)||void 0===e?void 0:e.some((({schema:e})=>!e.isPrimitive&&!e.isCircular))}),[m,null==f?void 0:f.content]);return T?_jsxs(_Fragment,{children:[_jsxs(TitleWrap,{children:[(null==o?void 0:o(T))||_jsxs(StyledTitle,{children:[_jsx(LinkToField,{to:makeDeepLink(t,`response&c=${T.key}`)}),l("openapi.responses","Responses")]}),_jsx(Tabs,{tabs:p,activeTab:T,onChange:u}),v&&_jsx(ExpandAllButton,{type:"response",operationPointer:s})]}),f?_jsx("div",{children:_jsx(ResponseDetails,{response:f,operationId:t,callbackId:a})},f.code):null]}):null}));const TitleWrap=styled(Row)`
+import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";import{memo,useMemo}from"react";import{useLocation}from"react-router-dom";import styled from"styled-components";import{useAtomValue}from"jotai";import{Tabs,useTabsState}from"../Tabs";import{ResponseDetails}from"./ResponseDetails";import{makeDeepLink}from"../../services";import{Row,StyledTitle}from"./styled";import{LinkToField}from"../common/LinkToField";import{pathIncludesLink}from"../../utils";import{ExpandAllButton}from"../ExpandAllButton";import{useTranslate}from"../../hooks";import{getActiveMediaType}from"../../models";import{activeMimeNameAtom}from"../../jotai/app";export const OperationResponseList=memo((({responses:e,renderTitle:o,operationId:t,operationPointer:s,activeResponseTab:n,onTabChange:i,callbackId:a,onPanelToggle:r})=>{const l=useLocation(),m=useTranslate(),p=useAtomValue(activeMimeNameAtom),d=e.map((({code:e})=>({key:e,title:e}))),c=d.find((({key:e})=>e===n||pathIncludesLink(l,t)&&pathIncludesLink(l,`c=${e}`))),{activeTab:u,handleTabChange:T}=useTabsState({tabs:d,defaultTab:null==c?void 0:c.key,onChange:i}),f=d.find((e=>e.key===(n||u))),v=e.find((e=>e.code===(null==f?void 0:f.key))),k=useMemo((()=>{var e;if(!(null==v?void 0:v.content))return!1;const{schema:o}=getActiveMediaType(null==v?void 0:v.content,p)||{};return null===(e=null==o?void 0:o.fields)||void 0===e?void 0:e.some((({schema:e})=>!e.isPrimitive&&!e.isCircular))}),[p,null==v?void 0:v.content]);return f?_jsxs(_Fragment,{children:[_jsxs(TitleWrap,{children:[(null==o?void 0:o(f))||_jsxs(StyledTitle,{children:[_jsx(LinkToField,{to:makeDeepLink(t,`response&c=${f.key}`)}),m("openapi.responses","Responses")]}),_jsx(Tabs,{tabs:d,activeTab:f,onChange:T}),k&&_jsx(ExpandAllButton,{type:"response",operationPointer:s,onPanelToggle:r})]}),v?_jsx("div",{children:_jsx(ResponseDetails,{response:v,operationId:t,callbackId:a})},v.code):null]}):null}));const TitleWrap=styled(Row)`
   flex-wrap: wrap;
   gap: var(--spacing-unit);
 `;

package/lib-esm/components/ServerListDropdown/ServerListDropdown.js

@@ -1,2 +1,2 @@
-import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useMemo,useCallback}from"react";import{Dropdown,DropdownMenu}from"@redocly/theme";import{useAtom}from"jotai";import{HttpVerb}from"../common";import{PathWrapper,Path,StyledCopyButton,StyledDropdownMenuItem}from"./styled";import{PanelItem}from"../PanelItem";import{joinWithSeparator}from"../../services";import{replaceVariables}from"../../utils";import{environmentAtom}from"../../jotai/app";import{useActiveWithFallback,useTelemetry}from"../../hooks";import{getServerEnvName}from"../../utils/environments";export const ServerListDropdown=({operation:e,className:r})=>{const t=useTelemetry(),[[o],s]=useAtom(environmentAtom),a=useActiveWithFallback(e.servers.map((e=>Object.assign(Object.assign({},e),{key:e.url}))),o.server),n=useCallback((e=>{e.stopPropagation()}),[]),i=useCallback((r=>()=>{1!==e.servers.length&&(s({environment:getServerEnvName(r)}),t.send({type:"openapi_docs.switch_servers.clicked",payload:{server:getServerEnvName(r)}}))}),[e.servers.length,s,t]),m=useMemo((()=>e.servers.map((r=>{const t=joinWithSeparator(replaceVariables(r),e.path);return _jsx(StyledDropdownMenuItem,{onAction:i(r),children:_jsx(PanelItem,{header:r.description,title:t,actions:[_jsx(StyledCopyButton,{data:t,toasterPlacement:"left",onCopyClick:n},t)],active:r.url===a,withCheckmark:!0})},t)}))),[e.servers,e.path,i,n,a]);return _jsx(Dropdown,{className:r,trigger:_jsxs(PathWrapper,{variant:"ghost",children:[_jsx(HttpVerb,{color:e.httpVerb,children:e.httpVerb}),_jsx(Path,{children:e.path})]}),withArrow:!0,children:_jsx(DropdownMenu,{children:m})})};
+import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useMemo,useCallback}from"react";import{Dropdown,DropdownMenu}from"@redocly/theme";import{useAtom,useAtomValue}from"jotai";import{HttpVerb}from"../common";import{PathWrapper,Path,StyledCopyButton,StyledDropdownMenuItem}from"./styled";import{PanelItem}from"../PanelItem";import{joinWithSeparator}from"../../services";import{replaceVariables}from"../../utils";import{environmentAtom}from"../../jotai/app";import{globalStoreAtom}from"../../jotai/store";import{useActiveWithFallback,useTelemetry}from"../../hooks";import{getServerEnvName}from"../../utils/environments";import{createTargetServerSwitchEvent}from"../../events";export const ServerListDropdown=({operation:e,className:r})=>{const t=useTelemetry(),[[o],a]=useAtom(environmentAtom),{options:{events:s}}=useAtomValue(globalStoreAtom),i=useActiveWithFallback(e.servers.map((e=>Object.assign(Object.assign({},e),{key:e.url}))),o.server),n=useCallback((e=>{e.stopPropagation()}),[]),m=useCallback((r=>()=>{if(1!==e.servers.length&&(a({environment:getServerEnvName(r)}),t.send({type:"openapi_docs.switch_servers.clicked",payload:{server:getServerEnvName(r)}}),(null==s?void 0:s.targetServerSwitch)&&r)){const t=createTargetServerSwitchEvent({operation:e,serverUrl:r.url});s.targetServerSwitch(t)}}),[e,a,t,s]),l=useMemo((()=>e.servers.map((r=>{const t=joinWithSeparator(replaceVariables(r),e.path);return _jsx(StyledDropdownMenuItem,{onAction:m(r),children:_jsx(PanelItem,{header:r.description,title:t,actions:[_jsx(StyledCopyButton,{data:t,toasterPlacement:"left",onCopyClick:n},t)],active:r.url===i,withCheckmark:!0})},t)}))),[e.servers,e.path,m,n,i]);return _jsx(Dropdown,{className:r,trigger:_jsxs(PathWrapper,{variant:"ghost",children:[_jsx(HttpVerb,{color:e.httpVerb,children:e.httpVerb}),_jsx(Path,{children:e.path})]}),withArrow:!0,children:_jsx(DropdownMenu,{children:l})})};
 //# sourceMappingURL=ServerListDropdown.js.map

package/lib-esm/events/index.d.ts

@@ -3,3 +3,6 @@ export { AnalyticsEventType } from './types';
 export { createLanguageSwitchEvent } from './languageSwitch';
 export { createPanelToggleEvent } from './panelToggle';
 export { createCodeSampleCopyEvent } from './codeSampleCopy';
+export { createTargetServerSwitchEvent } from './serverSwitch';
+export { createTryItOpenEvent } from './tryItOpen';
+export { createTryItSentEvent } from './tryItSent';

package/lib-esm/events/index.js

@@ -1,2 +1,2 @@
-export{AnalyticsEventType}from"./types";export{createLanguageSwitchEvent}from"./languageSwitch";export{createPanelToggleEvent}from"./panelToggle";export{createCodeSampleCopyEvent}from"./codeSampleCopy";
+export{AnalyticsEventType}from"./types";export{createLanguageSwitchEvent}from"./languageSwitch";export{createPanelToggleEvent}from"./panelToggle";export{createCodeSampleCopyEvent}from"./codeSampleCopy";export{createTargetServerSwitchEvent}from"./serverSwitch";export{createTryItOpenEvent}from"./tryItOpen";export{createTryItSentEvent}from"./tryItSent";
 //# sourceMappingURL=index.js.map

package/lib-esm/events/serverSwitch.d.ts

@@ -0,0 +1,2 @@
+import type { TargetServerSwitchedEvent, TargetServerSwitchProps } from './types';
+export declare const createTargetServerSwitchEvent: ({ operation, serverUrl, }: TargetServerSwitchProps) => TargetServerSwitchedEvent;

package/lib-esm/events/serverSwitch.js

@@ -0,0 +1,2 @@
+import{createTrackingEvent}from"./creator";import{AnalyticsEventType}from"./types";const targetServerSwitchEvent=createTrackingEvent(AnalyticsEventType.TargetServerSwitched);export const createTargetServerSwitchEvent=({operation:e,serverUrl:r})=>targetServerSwitchEvent({resource:"Redocly_CodeSample",action:"TargetServerSwitched",operationId:e.id,operationPath:e.path,operationHttpVerb:e.httpVerb,operationSummary:e.name,serverUrl:r});
+//# sourceMappingURL=serverSwitch.js.map

package/lib-esm/events/tryItOpen.d.ts

@@ -0,0 +1,2 @@
+import type { TryItOpenedEvent, TryItOpenProps } from './types';
+export declare const createTryItOpenEvent: ({ operation }: TryItOpenProps) => TryItOpenedEvent;

package/lib-esm/events/tryItOpen.js

@@ -0,0 +1,2 @@
+import{createTrackingEvent}from"./creator";import{AnalyticsEventType}from"./types";const tryItOpenEvent=createTrackingEvent(AnalyticsEventType.TryItOpen);export const createTryItOpenEvent=({operation:t})=>tryItOpenEvent({resource:"Redocly_OperationTryIt",action:"Opened",operationId:t.id,operationPath:t.path,operationHttpVerb:t.httpVerb,operationSummary:t.name});
+//# sourceMappingURL=tryItOpen.js.map

package/lib-esm/events/tryItSent.d.ts

@@ -0,0 +1,2 @@
+import type { TryItSentEvent, TryItSentProps } from './types';
+export declare const createTryItSentEvent: ({ operation, isSuccess }: TryItSentProps) => TryItSentEvent;

package/lib-esm/events/tryItSent.js

@@ -0,0 +1,2 @@
+import{createTrackingEvent}from"./creator";import{AnalyticsEventType}from"./types";const tryItSentEvent=createTrackingEvent(AnalyticsEventType.TryItSent);export const createTryItSentEvent=({operation:t,isSuccess:e})=>tryItSentEvent({resource:"Redocly_OperationTryIt",action:e?"Sent":"ValidationFailed",operationId:t.id,operationPath:t.path,operationHttpVerb:t.httpVerb,operationSummary:t.name});
+//# sourceMappingURL=tryItSent.js.map

package/lib-esm/events/types.d.ts

@@ -21,16 +21,25 @@ export interface TargetServerSwitchProps {
     operation: OperationModel;
     serverUrl: string;
 }
+export interface TryItOpenProps {
+    operation: OperationModel;
+}
+export interface TryItSentProps {
+    operation: OperationModel;
+    isSuccess: boolean;
+}
 export declare enum AnalyticsEventType {
     CodeSampleLanguageSwitched = "CodeSampleLanguageSwitched",
     CodeSampleCopied = "CodeSampleCopied",
     OperationServerExpanded = "OperationServerExpanded",
     PanelToggle = "PanelToggle",
-    TargetServerSwitched = "TargetServerSwitched"
+    TargetServerSwitched = "TargetServerSwitched",
+    TryItOpen = "TryItOpen",
+    TryItSent = "TryItSent"
 }
 export interface AnalyticsEvent {
     eventType: AnalyticsEventType;
-    resource: 'Redocly_CodeSample' | 'Redocly_Operation';
+    resource: 'Redocly_CodeSample' | 'Redocly_Operation' | 'Redocly_OperationTryIt';
     action: 'LanguageSwitched' | 'PanelToggled' | 'Opened' | 'Closed' | 'NavigatedOverrideLink' | 'Sent' | 'ValidationFailed' | 'CodeSampleCopied' | 'TargetServerSwitched';
     operationId?: string;
     operationPath: string;
@@ -49,8 +58,9 @@ export interface CodeSamplesCopiedEvent extends AnalyticsEvent {
     exampleId?: string;
     exampleMimeType?: string;
 }
+export type PanelType = 'request' | 'responses' | 'request-samples' | 'response-samples';
 export interface PanelToggleEvent extends AnalyticsEvent {
-    panelType: 'request' | 'responses' | 'request-samples' | 'response-samples';
+    panelType: PanelType;
     state: 'expanded' | 'collapsed';
     operationId: string;
     operationPath: string;
@@ -60,9 +70,14 @@ export interface PanelToggleEvent extends AnalyticsEvent {
 export interface TargetServerSwitchedEvent extends AnalyticsEvent {
     serverUrl: string;
 }
+export type TryItOpenedEvent = AnalyticsEvent;
+export type TryItSentEvent = AnalyticsEvent;
+export type EventType = CodeSamplesLanguageSwitchedEvent | CodeSamplesCopiedEvent | TryItOpenedEvent | TryItSentEvent | PanelToggleEvent | TargetServerSwitchedEvent;
 export type Events = {
     codeSamplesLanguageSwitch?: (event: CodeSamplesLanguageSwitchedEvent) => void;
     codeSamplesCopy?: (event: CodeSamplesCopiedEvent) => void;
+    tryItOpen?: (event: TryItOpenedEvent) => void;
+    tryItSent?: (event: TryItSentEvent) => void;
     panelToggle?: (event: PanelToggleEvent) => void;
     targetServerSwitch?: (event: TargetServerSwitchedEvent) => void;
 };

package/lib-esm/events/types.js

@@ -1,2 +1,2 @@
-export var AnalyticsEventType;!function(e){e.CodeSampleLanguageSwitched="CodeSampleLanguageSwitched",e.CodeSampleCopied="CodeSampleCopied",e.OperationServerExpanded="OperationServerExpanded",e.PanelToggle="PanelToggle",e.TargetServerSwitched="TargetServerSwitched"}(AnalyticsEventType||(AnalyticsEventType={}));
+export var AnalyticsEventType;!function(e){e.CodeSampleLanguageSwitched="CodeSampleLanguageSwitched",e.CodeSampleCopied="CodeSampleCopied",e.OperationServerExpanded="OperationServerExpanded",e.PanelToggle="PanelToggle",e.TargetServerSwitched="TargetServerSwitched",e.TryItOpen="TryItOpen",e.TryItSent="TryItSent"}(AnalyticsEventType||(AnalyticsEventType={}));
 //# sourceMappingURL=types.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/openapi-docs",
-  "version": "3.11.0-next.1",
+  "version": "3.11.0-next.2",
   "description": "Redocly OpenAPI Docs",
   "main": "lib/index.js",
   "module": "lib-esm/index.js",
@@ -46,7 +46,7 @@
     "util": "~0.12.5",
     "web-vitals": "3.3.1",
     "@redocly/config": "0.26.1",
-    "@redocly/replay": "0.14.0-next.1"
+    "@redocly/replay": "0.14.0-next.2"
   },
   "devDependencies": {
     "@shikijs/transformers": "1.24.0",
@@ -92,7 +92,7 @@
     "webpack": "5.94.0",
     "webpack-cli": "5.1.4",
     "webpack-dev-server": "5.2.1",
-    "@redocly/theme": "0.55.0-next.1"
+    "@redocly/theme": "0.55.0-next.2"
   },
   "scripts": {
     "start": "npm run copy-highlight-hook && webpack serve --mode=development --hot",