@redocly/reference-docs 3.0.0-alpha.3 → 3.0.0-alpha.6

package/lib/components/console/ConsoleTabs/styled.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tab=exports.TabsWrap=void 0;var templateObject_1,templateObject_2,templateObject_3,templateObject_4,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importStar)(require("styled-components"));exports.TabsWrap=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  display: flex;\n  font-size: 12px;\n  button {\n    margin: 0;\n  }\n"],["\n  display: flex;\n  font-size: 12px;\n  button {\n    margin: 0;\n  }\n"]))),exports.Tab=styled_components_1.default.button(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  outline: none;\n  border: none;\n  background-color: var(--try-it-panel-tab-background-color);\n  text-align: center;\n  cursor: pointer;\n  color: var(--color-content-inverse);\n  min-width: 80px;\n  min-height: 30px;\n  border-radius: var(--global-border-radius);\n  font-size: 12px;\n  padding: 0 10px;\n  border-top: 4px solid transparent;\n  border-bottom: 4px solid transparent;\n\n  &:first-child {\n    border-radius: var(--global-border-radius) 0 0 var(--global-border-radius);\n  }\n\n  &:last-child {\n    border-radius: 0 var(--global-border-radius) var(--global-border-radius) 0;\n  }\n\n  ","\n\n  ","\n"],["\n  outline: none;\n  border: none;\n  background-color: var(--try-it-panel-tab-background-color);\n  text-align: center;\n  cursor: pointer;\n  color: var(--color-content-inverse);\n  min-width: 80px;\n  min-height: 30px;\n  border-radius: var(--global-border-radius);\n  font-size: 12px;\n  padding: 0 10px;\n  border-top: 4px solid transparent;\n  border-bottom: 4px solid transparent;\n\n  &:first-child {\n    border-radius: var(--global-border-radius) 0 0 var(--global-border-radius);\n  }\n\n  &:last-child {\n    border-radius: 0 var(--global-border-radius) var(--global-border-radius) 0;\n  }\n\n  ","\n\n  ","\n"])),(function(r){return r.active&&(0,styled_components_1.css)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n        border-bottom: 4px solid var(--try-it-panel-active-tab-border-color);\n        background-color: var(--try-it-panel-active-tab-background-color);\n      "],["\n        border-bottom: 4px solid var(--try-it-panel-active-tab-border-color);\n        background-color: var(--try-it-panel-active-tab-background-color);\n      "])))||""}),(function(r){return r.disabled&&(0,styled_components_1.css)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n        cursor: default;\n        color: var(--try-it-panel-disabled-tab-color);\n      "],["\n        cursor: default;\n        color: var(--try-it-panel-disabled-tab-color);\n      "])))||""}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Tab=exports.TabsWrap=void 0;var templateObject_1,templateObject_2,templateObject_3,templateObject_4,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importStar)(require("styled-components"));exports.TabsWrap=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  display: flex;\n  font-size: 12px;\n  button {\n    margin: 0;\n  }\n"],["\n  display: flex;\n  font-size: 12px;\n  button {\n    margin: 0;\n  }\n"]))),exports.Tab=styled_components_1.default.button(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  outline: none;\n  border: none;\n  background-color: var(--panel-try-it-tabs-background-color);\n  text-align: center;\n  cursor: pointer;\n  color: var(--panel-try-it-tabs-text-color);\n  min-width: 80px;\n  min-height: 30px;\n  border-radius: var(--border-radius);\n  font-size: var(--panel-try-it-tabs-font-size);\n  font-family: var(--panel-try-it-tabs-font-family);\n  font-weight: var(--panel-try-it-tabs-font-weight);\n  padding: 0 10px;\n  border-bottom: 4px solid var(--panel-try-it-tabs-border-color);\n\n  &:first-child {\n    border-radius: var(--border-radius) 0 0 var(--border-radius);\n  }\n\n  &:last-child {\n    border-radius: 0 var(--border-radius) var(--border-radius) 0;\n  }\n\n  &:hover:not(:disabled) {\n    border-color: var(--panel-try-it-tabs-hover-border-color);\n    background-color: var(--panel-try-it-tabs-hover-background-color);\n  }\n\n  ","\n\n  ","\n"],["\n  outline: none;\n  border: none;\n  background-color: var(--panel-try-it-tabs-background-color);\n  text-align: center;\n  cursor: pointer;\n  color: var(--panel-try-it-tabs-text-color);\n  min-width: 80px;\n  min-height: 30px;\n  border-radius: var(--border-radius);\n  font-size: var(--panel-try-it-tabs-font-size);\n  font-family: var(--panel-try-it-tabs-font-family);\n  font-weight: var(--panel-try-it-tabs-font-weight);\n  padding: 0 10px;\n  border-bottom: 4px solid var(--panel-try-it-tabs-border-color);\n\n  &:first-child {\n    border-radius: var(--border-radius) 0 0 var(--border-radius);\n  }\n\n  &:last-child {\n    border-radius: 0 var(--border-radius) var(--border-radius) 0;\n  }\n\n  &:hover:not(:disabled) {\n    border-color: var(--panel-try-it-tabs-hover-border-color);\n    background-color: var(--panel-try-it-tabs-hover-background-color);\n  }\n\n  ","\n\n  ","\n"])),(function(r){return r.active&&(0,styled_components_1.css)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n        border-color: var(--panel-try-it-tabs-active-border-color);\n        background-color: var(--panel-try-it-tabs-active-background-color);\n      "],["\n        border-color: var(--panel-try-it-tabs-active-border-color);\n        background-color: var(--panel-try-it-tabs-active-background-color);\n      "])))||""}),(function(r){return r.disabled&&(0,styled_components_1.css)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n        cursor: default;\n        border-color: var(--panel-try-it-tabs-disables-border-color)\n        background-color: var(--panel-try-it-tabs-disabled-background-color);\n        color: var(--panel-try-it-tabs-disabled-text-color);\n      "],["\n        cursor: default;\n        border-color: var(--panel-try-it-tabs-disables-border-color)\n        background-color: var(--panel-try-it-tabs-disabled-background-color);\n        color: var(--panel-try-it-tabs-disabled-text-color);\n      "])))||""}));
 //# sourceMappingURL=styled.js.map

package/lib/components/console/OAuth2Flow.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { FormApi, FormState } from 'informed';
 import type { InputActionButtonProps } from '../common/TextField';
-import type { SecurityDetails } from '../../utils';
+import type { SecurityDetails } from '../../types';
 import type { RedocProNormalizedOptions } from '../../services';
 export interface OAuth2FlowProps {
     authorizationUrl: string;
@@ -17,6 +17,7 @@ export interface OAuth2FlowProps {
     form: FormState;
     formApi: FormApi;
     flow: 'implicit' | 'authorizationCode';
+    tokenEndpointAuthMethod?: string | string[];
     clientId?: string;
     defaultValues?: SecurityDetails;
 }

package/lib/components/console/OAuth2Flow.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OAuth2Flow=void 0;var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),theme_1=require("@redocly/theme"),redoc_lib_1=require("../../redoc-lib"),LinearProgress_1=require("../common/LinearProgress"),form_1=require("../common/form"),TextField_1=require("../common/TextField"),Checkbox_1=require("../common/Checkbox"),OAuth2_1=require("../../services/OAuth2"),utils_1=require("../../utils"),utils_2=require("../../services/utils"),utils_3=require("./utils"),Scope_1=(0,tslib_1.__importDefault)(require("./Scope"));function requiredValidator(e){if(!e)return"Field is required"}var OAuth2Flow=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return Object.defineProperty(t,"state",{enumerable:!0,configurable:!0,writable:!0,value:{error:null,loading:!1,showPkceOptions:!1}}),Object.defineProperty(t,"clearToken",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.props.formApi.setValue("auth."+t.props.id+".token","")}}),Object.defineProperty(t,"togglePkceOptions",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.setState((function(e){return{showPkceOptions:!e.showPkceOptions}}))}}),Object.defineProperty(t,"handleCodeVerifierChange",{enumerable:!0,configurable:!0,writable:!0,value:function(e){var l=e.target.value;return(0,tslib_1.__awaiter)(t,void 0,void 0,(function(){var e;return(0,tslib_1.__generator)(this,(function(t){switch(t.label){case 0:return[4,(0,OAuth2_1.deriveCodeChallenge)(l)];case 1:return e=t.sent(),this.setState({codeVerifier:l,validCodeChallenge:e}),[2]}}))}))}}),t}return(0,tslib_1.__extends)(t,e),Object.defineProperty(t.prototype,"values",{get:function(){var e,t;return(null===(t=null===(e=this.props.form.values)||void 0===e?void 0:e.auth)||void 0===t?void 0:t[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"errors",{get:function(){var e,t;return(null===(t=null===(e=this.props.form.errors)||void 0===e?void 0:e.auth)||void 0===t?void 0:t[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"pkceInputActionButtonProps",{get:function(){var e=this;if(void 0!==this.state.codeVerifier&&this.state.codeChallenge!==this.state.validCodeChallenge)return{label:"sync",onClick:function(){e.state.codeVerifier&&e.setState({codeChallenge:e.state.validCodeChallenge})}}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"componentDidMount",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e=this;if(this.props.usePkce){var t=(0,utils_2.randString)(43);(0,OAuth2_1.deriveCodeChallenge)(t).then((function(l){e.setState({codeVerifier:t,codeChallenge:l,validCodeChallenge:l})}))}}}),Object.defineProperty(t.prototype,"handleAuthorize",{enumerable:!1,configurable:!0,writable:!0,value:function(e){var t=this;if(e){this.props.formApi.validate();var l=this.props,r=l.flow,i=l.usePkce,n=l.id,a=l.tokenUrl,o=l.authCorsProxyUrl;if((0,utils_2.isEmptyObject)(this.errors)){this.setState({loading:!0,error:null});var c=o?o+(0,utils_3.normalizeUrlProtocol)(e):e,s=o&&a?o+(0,utils_3.normalizeUrlProtocol)(a):a,u=this.props.formApi.getValue("auth."+n+".scopes"),d={authorizationUrl:c.startsWith("http")?c:this.props.server+c,clientId:this.values.client_id,scopes:u,redirectUri:this.context.oAuth2RedirectURI,routingBasePath:this.context.routingBasePath,successCallback:function(e){t.props.formApi.setValue("auth."+t.props.id+".token",e),t.setState({loading:!1,error:null})},errorCallback:function(e){t.setState({loading:!1,error:(null==e?void 0:e.message)||"Failed to retrieve the access token"})}};"implicit"===r&&OAuth2_1.OAuth2.authorizeImplicit(d),"authorizationCode"===r&&OAuth2_1.OAuth2.authorizeAuthorizationCode((0,tslib_1.__assign)((0,tslib_1.__assign)((0,tslib_1.__assign)({},d),{tokenUrl:(null==s?void 0:s.startsWith("http"))?s:this.props.server+s,clientSecret:this.values.client_secret}),i&&{codeVerifier:this.state.codeVerifier,codeChallenge:this.state.codeChallenge}))}}}}),Object.defineProperty(t.prototype,"handleLogout",{enumerable:!1,configurable:!0,writable:!0,value:function(){this.clearToken(),this.setState({error:null})}}),Object.defineProperty(t.prototype,"handleCancel",{enumerable:!1,configurable:!0,writable:!0,value:function(){this.setState({loading:!1,error:null}),OAuth2_1.OAuth2.clearRedirectData(this.props.flow)}}),Object.defineProperty(t.prototype,"render",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e=this,t=this.state,l=t.error,r=t.loading,i=this.props,n=i.id,a=i.scopes,o=i.authorizationUrl,c=i.flow,s=i.usePkce,u=i.defaultValues;if(!o)return React.createElement(form_1.FormError,null,"No flow info");var d=(0,utils_1.fromSessionStorage)("auth."+n+".token")||JSON.stringify(null==u?void 0:u.token);d=d?JSON.parse(d):"";var p=(0,utils_1.getSecurityDetailsOptions)(n,"client_id"),m={field:"auth."+n+".client_id",fullWidth:!0,initialValue:(0,utils_1.fromSessionStorage)("auth."+n+".client_id")||this.props.clientId||(null==u?void 0:u.client_id),initValue:(0,utils_1.fromSessionStorage)("auth."+n+".client_id")||this.props.clientId||(null==u?void 0:u.client_id),placeholder:"Your OAuth2 app Client ID",validate:requiredValidator,validateOnBlur:!0,validateOnChange:!0};return React.createElement("div",null,React.createElement(form_1.FormWrapper,null,React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null," Client ID: "),p?React.createElement(TextField_1.FormDropdown,(0,tslib_1.__assign)({},m,{options:p})):React.createElement(TextField_1.FormTextField,(0,tslib_1.__assign)({},m,{"data-cy":"client-id-input",panel:"try-it"}))),"authorizationCode"===c&&React.createElement(React.Fragment,null,(!(null==s?void 0:s.hideClientSecretInput)||!s)&&React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Client Secret:"),React.createElement(TextField_1.FormTextField,{type:"password",fullWidth:!0,field:"auth."+n+".client_secret",initialValue:(0,utils_1.fromSessionStorage)("auth."+n+".client_secret")||(null==u?void 0:u.client_secret),validateOnBlur:!0,validateOnChange:!0,panel:"try-it","data-cy":"client-secret-input"})),s&&!s.disableManualConfiguration&&React.createElement(PkceOptionsWrapper,null,React.createElement(Checkbox_1.Checkbox,{id:"pkce-opitons-toggle",label:"Configure PKCE manually",checked:this.state.showPkceOptions,onChange:this.togglePkceOptions,"data-cy":"pkce-options-toggle"}),this.state.showPkceOptions&&React.createElement(PkceDetails,null,React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Code Verifier"),React.createElement(TextField_1.TextField,{fullWidth:!0,value:this.state.codeVerifier,onChange:this.handleCodeVerifierChange,panel:"try-it","data-cy":"code-verifier-input"})),React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Code Challenge"),React.createElement(TextField_1.TextField,{fullWidth:!0,value:this.state.codeChallenge,onChange:function(t){var l=t.target.value;e.setState({codeChallenge:l})},inputActionButton:this.pkceInputActionButtonProps,panel:"try-it","data-cy":"code-challenge-input"}))))),React.createElement(TextField_1.FormTextField,{fullWidth:!0,field:"auth."+n+".token",type:"hidden",initialValue:d,panel:"try-it"}),React.createElement(Scope_1.default,{id:n,scopes:a}),this.values.token&&this.values.token.access_token?React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null," Access Token: "),React.createElement(TextField_1.TextField,{disabled:!0,type:"password",fullWidth:!0,value:this.values.token.access_token,panel:"try-it"})):null),React.createElement(ButtonsWrapper,null,this.values.token&&this.values.token.access_token?React.createElement(theme_1.Button,{fullWidth:!0,onClick:function(){e.handleLogout()}},"Log out"):r?React.createElement(React.Fragment,null,React.createElement(theme_1.Button,{fullWidth:!0,onClick:function(){e.handleCancel()}},"Cancel"),React.createElement(LinearProgress_1.LinearProgress,null)):React.createElement(theme_1.Button,{fullWidth:!0,disabled:!(0,utils_2.isEmptyObject)(this.errors),onClick:function(){e.handleAuthorize(o)}},"Authorize")),r||l||!this.values.token||!this.values.token.access_token&&React.createElement(form_1.FormWrapper,null,React.createElement(form_1.FormControl,null,r?React.createElement(form_1.FormWarning,null,"Please, finish your authorization flow or cancel authorization."):l?React.createElement(React.Fragment,null,React.createElement(OriginalErrorMessage,null,React.createElement(form_1.FormError,null,l))):this.values.token&&this.values.token.access_token?null:React.createElement(form_1.FormWarning,null," No Access Token. Please, Authorize. "))))}}),Object.defineProperty(t,"contextType",{enumerable:!0,configurable:!0,writable:!0,value:redoc_lib_1.OptionsContext}),t}(React.Component);exports.OAuth2Flow=OAuth2Flow;var templateObject_1,templateObject_2,templateObject_3,templateObject_4,OriginalErrorMessage=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  font-family: var(--font-family-monospaced);\n  margin-top: 10px;\n  line-height: 1;\n  padding-left: 10px;\n  border-left: 1px solid gray;\n"],["\n  font-family: var(--font-family-monospaced);\n  margin-top: 10px;\n  line-height: 1;\n  padding-left: 10px;\n  border-left: 1px solid gray;\n"]))),ButtonsWrapper=styled_components_1.default.div(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 15px;\n"],["\n  margin-bottom: 15px;\n"]))),PkceOptionsWrapper=styled_components_1.default.div(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  padding: 8px 0 20px;\n"],["\n  padding: 8px 0 20px;\n"]))),PkceDetails=styled_components_1.default.div(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  padding: 4px 0;\n"],["\n  padding: 4px 0;\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OAuth2Flow=void 0;var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),Button_1=require("@redocly/theme/Button"),redoc_lib_1=require("../../redoc-lib"),LinearProgress_1=require("../common/LinearProgress"),form_1=require("../common/form"),TextField_1=require("../common/TextField"),Checkbox_1=require("../common/Checkbox"),OAuth2_1=require("../../services/OAuth2"),utils_1=require("../../utils"),utils_2=require("../../services/utils"),utils_3=require("./utils"),Scope_1=(0,tslib_1.__importDefault)(require("./Scope"));function requiredValidator(e){if(!e)return"Field is required"}var OAuth2Flow=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return Object.defineProperty(t,"state",{enumerable:!0,configurable:!0,writable:!0,value:{error:null,loading:!1,showPkceOptions:!1}}),Object.defineProperty(t,"clearToken",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.props.formApi.setValue("auth."+t.props.id+".token","")}}),Object.defineProperty(t,"togglePkceOptions",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.setState((function(e){return{showPkceOptions:!e.showPkceOptions}}))}}),Object.defineProperty(t,"handleCodeVerifierChange",{enumerable:!0,configurable:!0,writable:!0,value:function(e){var l=e.target.value;return(0,tslib_1.__awaiter)(t,void 0,void 0,(function(){var e;return(0,tslib_1.__generator)(this,(function(t){switch(t.label){case 0:return[4,(0,OAuth2_1.deriveCodeChallenge)(l)];case 1:return e=t.sent(),this.setState({codeVerifier:l,validCodeChallenge:e}),[2]}}))}))}}),t}return(0,tslib_1.__extends)(t,e),Object.defineProperty(t.prototype,"values",{get:function(){var e,t;return(null===(t=null===(e=this.props.form.values)||void 0===e?void 0:e.auth)||void 0===t?void 0:t[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"errors",{get:function(){var e,t;return(null===(t=null===(e=this.props.form.errors)||void 0===e?void 0:e.auth)||void 0===t?void 0:t[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"pkceInputActionButtonProps",{get:function(){var e=this;if(void 0!==this.state.codeVerifier&&this.state.codeChallenge!==this.state.validCodeChallenge)return{label:"sync",onClick:function(){e.state.codeVerifier&&e.setState({codeChallenge:e.state.validCodeChallenge})}}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"componentDidMount",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e=this;if(this.props.usePkce){var t=(0,utils_2.randString)(43);(0,OAuth2_1.deriveCodeChallenge)(t).then((function(l){e.setState({codeVerifier:t,codeChallenge:l,validCodeChallenge:l})}))}}}),Object.defineProperty(t.prototype,"handleAuthorize",{enumerable:!1,configurable:!0,writable:!0,value:function(e){var t=this;if(e){this.props.formApi.validate();var l=this.props,r=l.flow,n=l.usePkce,i=l.id,o=l.tokenUrl,a=l.authCorsProxyUrl,c=l.tokenEndpointAuthMethod;if((0,utils_2.isEmptyObject)(this.errors)){this.setState({loading:!0,error:null});var s=a?a+(0,utils_3.normalizeUrlProtocol)(e):e,u=a&&o?a+(0,utils_3.normalizeUrlProtocol)(o):o,d=this.props.formApi.getValue("auth."+i+".scopes"),p={authorizationUrl:s.startsWith("http")?s:this.props.server+s,clientId:this.values.client_id,scopes:d,redirectUri:this.context.oAuth2RedirectURI,routingBasePath:this.context.routingBasePath,successCallback:function(e){t.props.formApi.setValue("auth."+t.props.id+".token",e),t.setState({loading:!1,error:null})},errorCallback:function(e){t.setState({loading:!1,error:(null==e?void 0:e.message)||"Failed to retrieve the access token"})}};"implicit"===r&&OAuth2_1.OAuth2.authorizeImplicit(p),(0,utils_3.validateTokenEndpointMethod)(c)?"authorizationCode"===r&&OAuth2_1.OAuth2.authorizeAuthorizationCode((0,tslib_1.__assign)((0,tslib_1.__assign)((0,tslib_1.__assign)({},p),{tokenUrl:(null==u?void 0:u.startsWith("http"))?u:this.props.server+u,clientSecret:this.values.client_secret,extraHeaders:(0,utils_3.getOAuth2TokenEndpointAuthHeader)({authMethod:c,clientId:this.values.client_id,clientSecret:this.values.client_secret})}),n&&{codeVerifier:this.state.codeVerifier,codeChallenge:this.state.codeChallenge})):console.log("Unsupported token endpoint auth method: "+c)}}}}),Object.defineProperty(t.prototype,"handleLogout",{enumerable:!1,configurable:!0,writable:!0,value:function(){this.clearToken(),this.setState({error:null})}}),Object.defineProperty(t.prototype,"handleCancel",{enumerable:!1,configurable:!0,writable:!0,value:function(){this.setState({loading:!1,error:null}),OAuth2_1.OAuth2.clearRedirectData(this.props.flow)}}),Object.defineProperty(t.prototype,"render",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e=this,t=this.state,l=t.error,r=t.loading,n=this.props,i=n.id,o=n.scopes,a=n.authorizationUrl,c=n.flow,s=n.usePkce,u=n.defaultValues;if(!a)return React.createElement(form_1.FormError,null,"No flow info");var d=(0,utils_1.fromSessionStorage)("auth."+i+".token")||JSON.stringify(null==u?void 0:u.token);d=d?JSON.parse(d):"";var p=(0,utils_1.getSecurityDetailsOptions)(i,"client_id"),h={field:"auth."+i+".client_id",fullWidth:!0,initialValue:(0,utils_1.fromSessionStorage)("auth."+i+".client_id")||this.props.clientId||(null==u?void 0:u.client_id),initValue:(0,utils_1.fromSessionStorage)("auth."+i+".client_id")||this.props.clientId||(null==u?void 0:u.client_id),placeholder:"Your OAuth2 app Client ID",validate:requiredValidator,validateOnBlur:!0,validateOnChange:!0};return React.createElement("div",null,React.createElement(form_1.FormWrapper,null,React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null," Client ID: "),p?React.createElement(TextField_1.FormDropdown,(0,tslib_1.__assign)({},h,{options:p})):React.createElement(TextField_1.FormTextField,(0,tslib_1.__assign)({},h,{"data-cy":"client-id-input",panel:"try-it"}))),"authorizationCode"===c&&React.createElement(React.Fragment,null,(!(null==s?void 0:s.hideClientSecretInput)||!s)&&React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Client Secret:"),React.createElement(TextField_1.FormTextField,{type:"password",fullWidth:!0,field:"auth."+i+".client_secret",initialValue:(0,utils_1.fromSessionStorage)("auth."+i+".client_secret")||(null==u?void 0:u.client_secret),validateOnBlur:!0,validateOnChange:!0,panel:"try-it","data-cy":"client-secret-input"})),s&&!s.disableManualConfiguration&&React.createElement(PkceOptionsWrapper,null,React.createElement(Checkbox_1.Checkbox,{id:"pkce-opitons-toggle",label:"Configure PKCE manually",checked:this.state.showPkceOptions,onChange:this.togglePkceOptions,"data-cy":"pkce-options-toggle"}),this.state.showPkceOptions&&React.createElement(PkceDetails,null,React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Code Verifier"),React.createElement(TextField_1.TextField,{fullWidth:!0,value:this.state.codeVerifier,onChange:this.handleCodeVerifierChange,panel:"try-it","data-cy":"code-verifier-input"})),React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Code Challenge"),React.createElement(TextField_1.TextField,{fullWidth:!0,value:this.state.codeChallenge,onChange:function(t){var l=t.target.value;e.setState({codeChallenge:l})},inputActionButton:this.pkceInputActionButtonProps,panel:"try-it","data-cy":"code-challenge-input"}))))),React.createElement(TextField_1.FormTextField,{fullWidth:!0,field:"auth."+i+".token",type:"hidden",initialValue:d,panel:"try-it"}),React.createElement(Scope_1.default,{id:i,scopes:o}),this.values.token&&this.values.token.access_token?React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null," Access Token: "),React.createElement(TextField_1.TextField,{disabled:!0,type:"password",fullWidth:!0,value:this.values.token.access_token,panel:"try-it"})):null),React.createElement(ButtonsWrapper,null,this.values.token&&this.values.token.access_token?React.createElement(Button_1.Button,{fullWidth:!0,onClick:function(){e.handleLogout()}},"Log out"):r?React.createElement(React.Fragment,null,React.createElement(Button_1.Button,{fullWidth:!0,onClick:function(){e.handleCancel()}},"Cancel"),React.createElement(LinearProgress_1.LinearProgress,null)):React.createElement(Button_1.Button,{fullWidth:!0,disabled:!(0,utils_2.isEmptyObject)(this.errors),onClick:function(){e.handleAuthorize(a)}},"Authorize")),r||l||!this.values.token||!this.values.token.access_token&&React.createElement(form_1.FormWrapper,null,React.createElement(form_1.FormControl,null,r?React.createElement(form_1.FormWarning,null,"Please, finish your authorization flow or cancel authorization."):l?React.createElement(React.Fragment,null,React.createElement(OriginalErrorMessage,null,React.createElement(form_1.FormError,null,l))):this.values.token&&this.values.token.access_token?null:React.createElement(form_1.FormWarning,null," No Access Token. Please, Authorize. "))))}}),Object.defineProperty(t,"contextType",{enumerable:!0,configurable:!0,writable:!0,value:redoc_lib_1.OptionsContext}),t}(React.Component);exports.OAuth2Flow=OAuth2Flow;var templateObject_1,templateObject_2,templateObject_3,templateObject_4,OriginalErrorMessage=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  font-family: var(--font-family-monospaced);\n  margin-top: 10px;\n  line-height: 1;\n  padding-left: 10px;\n  border-left: 1px solid gray;\n"],["\n  font-family: var(--font-family-monospaced);\n  margin-top: 10px;\n  line-height: 1;\n  padding-left: 10px;\n  border-left: 1px solid gray;\n"]))),ButtonsWrapper=styled_components_1.default.div(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 15px;\n"],["\n  margin-bottom: 15px;\n"]))),PkceOptionsWrapper=styled_components_1.default.div(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  padding: 8px 0 20px;\n"],["\n  padding: 8px 0 20px;\n"]))),PkceDetails=styled_components_1.default.div(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  padding: 4px 0;\n"],["\n  padding: 4px 0;\n"])));
 //# sourceMappingURL=OAuth2Flow.js.map

package/lib/components/console/OAuth2TokenInput.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
-import type { SecurityDetails } from '../../utils';
+import type { SecurityDetails } from '../../types';
 export interface OAuth2TokenInputProps {
     flow: {
         refreshUrl?: string;
+        'x-tokenEndpointAuthMethod'?: 'none' | 'client_secret_basic' | string;
         scopes: Record<string, string>;
         tokenUrl: string;
     };

package/lib/components/console/OAuth2TokenInput.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OAuth2TokenInput=void 0;var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),theme_1=require("@redocly/theme"),form_1=require("../common/form"),utils_1=require("../../utils"),OAuth2_1=require("../../services/OAuth2"),TextField_1=require("../common/TextField"),Scope_1=(0,tslib_1.__importDefault)(require("./Scope")),utils_2=require("./utils");function validateToken(e){if(!e)return"Token is required"}var OAuth2TokenInput=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return Object.defineProperty(t,"state",{enumerable:!0,configurable:!0,writable:!0,value:{error:"",loading:!1,tokenMasked:!0}}),Object.defineProperty(t,"clearToken",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.props.formApi.setValue("auth."+t.props.id+".token",""),(0,utils_1.toSessionStorage)("auth."+t.props.id+".token","")}}),Object.defineProperty(t,"toggleTokenMask",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.setState({tokenMasked:!t.state.tokenMasked})}}),Object.defineProperty(t,"requestToken",{enumerable:!0,configurable:!0,writable:!0,value:function(){return(0,tslib_1.__awaiter)(t,void 0,void 0,(function(){var e,t,r,o,i,l,n,a=this;return(0,tslib_1.__generator)(this,(function(s){switch(s.label){case 0:return this.state.loading?[2]:(e=this.props,t=e.server,r=e.flow,o=e.authCorsProxyUrl,i=o&&r.tokenUrl?o+(0,utils_2.normalizeUrlProtocol)(r.tokenUrl):r.tokenUrl,this.errors.client_id||this.errors.client_secret?(console.log("Provide client_id and client_secret"),[2]):(l=this.values.client_id,n=this.values.client_secret,l&&n?(this.setState({loading:!0}),[4,OAuth2_1.OAuth2.authorizeClientCredentials({tokenUrl:i.startsWith("http")?i:t+i,clientId:l,clientSecret:n,scopes:this.values.scopes,successCallback:function(e){a.props.formApi.setValue("auth."+a.props.id+".token",e),a.setState({loading:!1})},errorCallback:function(e){a.clearToken(),a.setState({error:e.message,loading:!1})}})]):(console.log("Provide client_id and client_secret"),[2])));case 1:return s.sent(),[2]}}))}))}}),t}return(0,tslib_1.__extends)(t,e),Object.defineProperty(t.prototype,"values",{get:function(){var e,t,r;return(null===(r=null===(t=null===(e=this.props.form)||void 0===e?void 0:e.values)||void 0===t?void 0:t.auth)||void 0===r?void 0:r[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"errors",{get:function(){var e,t;return(null===(t=null===(e=this.props.form.errors)||void 0===e?void 0:e.auth)||void 0===t?void 0:t[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"render",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e=this.state,t=e.loading,r=e.error,o=e.tokenMasked,i=this.props,l=i.id,n=i.defaultValues,a=Object.keys(this.props.flow.scopes),s=(0,utils_1.fromSessionStorage)("auth."+l+".token")||JSON.stringify(null==n?void 0:n.token);s=s?JSON.parse(s):"";var u=(0,utils_1.getSecurityDetailsOptions)(l,"client_id"),c={field:"auth."+l+".client_id",fullWidth:!0,initialValue:(0,utils_1.fromSessionStorage)("auth."+l+".client_id")||this.props.clientId||(null==n?void 0:n.client_id),initValue:(0,utils_1.fromSessionStorage)("auth."+l+".client_id")||this.props.clientId||(null==n?void 0:n.client_id),placeholder:"Your OAuth2 app Client ID"};return React.createElement(React.Fragment,null,React.createElement(form_1.FormWrapper,null,React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Client ID:"),u?React.createElement(TextField_1.FormDropdown,(0,tslib_1.__assign)({},c,{options:u})):React.createElement(TextField_1.FormTextField,(0,tslib_1.__assign)({},c,{type:"password",panel:"try-it"}))),React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Client Secret:"),React.createElement(TextField_1.FormTextField,{type:"password",fullWidth:!0,field:"auth."+l+".client_secret",initialValue:(0,utils_1.fromSessionStorage)("auth."+l+".client_secret")||(null==n?void 0:n.client_secret),panel:"try-it"})),React.createElement(TextField_1.FormTextField,{fullWidth:!0,field:"auth."+l+".token",type:"hidden",initialValue:s,validate:validateToken}),React.createElement(Scope_1.default,{id:l,scopes:a})),React.createElement(theme_1.Button,{color:"primary",onClick:this.requestToken,blinking:t},t?"Loading...":"Request Token"),React.createElement(form_1.FormHeader,null," Access Token "),r?React.createElement(form_1.FormError,{style:{marginBottom:"1em"}},"Failed to request token: ",React.createElement("pre",null,r)," "):this.values.token&&this.values.token.access_token?React.createElement(form_1.TokenField,null,React.createElement(form_1.TokenValue,{length:this.values.token.access_token.length,masked:o},this.values.token.access_token),React.createElement(form_1.TokenShowHide,{onClick:this.toggleTokenMask},o?"Show":"Hide"," "),React.createElement(form_1.TokenClear,{onClick:this.clearToken}," Clear ")):React.createElement(form_1.FormError,{style:{marginBottom:"1em"}},"No token"))}}),t}(React.Component);exports.OAuth2TokenInput=OAuth2TokenInput,exports.default=OAuth2TokenInput;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OAuth2TokenInput=void 0;var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),theme_1=require("@redocly/theme"),form_1=require("../common/form"),utils_1=require("../../utils"),OAuth2_1=require("../../services/OAuth2"),TextField_1=require("../common/TextField"),Scope_1=(0,tslib_1.__importDefault)(require("./Scope")),utils_2=require("./utils");function validateToken(e){if(!e)return"Token is required"}var OAuth2TokenInput=function(e){function t(){var t=null!==e&&e.apply(this,arguments)||this;return Object.defineProperty(t,"state",{enumerable:!0,configurable:!0,writable:!0,value:{error:"",loading:!1,tokenMasked:!0}}),Object.defineProperty(t,"clearToken",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.props.formApi.setValue("auth."+t.props.id+".token",""),(0,utils_1.toSessionStorage)("auth."+t.props.id+".token","")}}),Object.defineProperty(t,"toggleTokenMask",{enumerable:!0,configurable:!0,writable:!0,value:function(){t.setState({tokenMasked:!t.state.tokenMasked})}}),Object.defineProperty(t,"requestToken",{enumerable:!0,configurable:!0,writable:!0,value:function(){return(0,tslib_1.__awaiter)(t,void 0,void 0,(function(){var e,t,r,o,i,n,l,a,s=this;return(0,tslib_1.__generator)(this,(function(u){switch(u.label){case 0:return this.state.loading?[2]:(e=this.props,t=e.server,r=e.flow,o=e.authCorsProxyUrl,i=o&&r.tokenUrl?o+(0,utils_2.normalizeUrlProtocol)(r.tokenUrl):r.tokenUrl,this.errors.client_id||this.errors.client_secret?(console.log("Provide client_id and client_secret"),[2]):(n=this.values.client_id,l=this.values.client_secret,n&&l?(this.setState({loading:!0}),a=r["x-tokenEndpointAuthMethod"],(0,utils_2.validateTokenEndpointMethod)(a)?[4,OAuth2_1.OAuth2.authorizeClientCredentials({tokenUrl:i.startsWith("http")?i:t+i,clientId:n,clientSecret:l,scopes:this.values.scopes,extraHeaders:(0,utils_2.getOAuth2TokenEndpointAuthHeader)({authMethod:a,clientId:n,clientSecret:l}),successCallback:function(e){s.props.formApi.setValue("auth."+s.props.id+".token",e),s.setState({loading:!1})},errorCallback:function(e){s.clearToken(),s.setState({error:e.message,loading:!1})}})]:(console.log("Unsupported token endpoint auth method: "+a),[2])):(console.log("Provide client_id and client_secret"),[2])));case 1:return u.sent(),[2]}}))}))}}),t}return(0,tslib_1.__extends)(t,e),Object.defineProperty(t.prototype,"values",{get:function(){var e,t,r;return(null===(r=null===(t=null===(e=this.props.form)||void 0===e?void 0:e.values)||void 0===t?void 0:t.auth)||void 0===r?void 0:r[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"errors",{get:function(){var e,t;return(null===(t=null===(e=this.props.form.errors)||void 0===e?void 0:e.auth)||void 0===t?void 0:t[this.props.id])||{}},enumerable:!1,configurable:!0}),Object.defineProperty(t.prototype,"render",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e=this.state,t=e.loading,r=e.error,o=e.tokenMasked,i=this.props,n=i.id,l=i.defaultValues,a=Object.keys(this.props.flow.scopes),s=(0,utils_1.fromSessionStorage)("auth."+n+".token")||JSON.stringify(null==l?void 0:l.token);s=s?JSON.parse(s):"";var u=(0,utils_1.getSecurityDetailsOptions)(n,"client_id"),c={field:"auth."+n+".client_id",fullWidth:!0,initialValue:(0,utils_1.fromSessionStorage)("auth."+n+".client_id")||this.props.clientId||(null==l?void 0:l.client_id),initValue:(0,utils_1.fromSessionStorage)("auth."+n+".client_id")||this.props.clientId||(null==l?void 0:l.client_id),placeholder:"Your OAuth2 app Client ID"};return React.createElement(React.Fragment,null,React.createElement(form_1.FormWrapper,null,React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Client ID:"),u?React.createElement(TextField_1.FormDropdown,(0,tslib_1.__assign)({},c,{options:u})):React.createElement(TextField_1.FormTextField,(0,tslib_1.__assign)({},c,{type:"password",panel:"try-it"}))),React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,"Client Secret:"),React.createElement(TextField_1.FormTextField,{type:"password",fullWidth:!0,field:"auth."+n+".client_secret",initialValue:(0,utils_1.fromSessionStorage)("auth."+n+".client_secret")||(null==l?void 0:l.client_secret),panel:"try-it"})),React.createElement(TextField_1.FormTextField,{fullWidth:!0,field:"auth."+n+".token",type:"hidden",initialValue:s,validate:validateToken}),React.createElement(Scope_1.default,{id:n,scopes:a})),React.createElement(theme_1.Button,{color:"primary",onClick:this.requestToken,blinking:t},t?"Loading...":"Request Token"),React.createElement(form_1.FormHeader,null," Access Token "),r?React.createElement(form_1.FormError,{style:{marginBottom:"1em"}},"Failed to request token: ",React.createElement("pre",null,r)," "):this.values.token&&this.values.token.access_token?React.createElement(form_1.TokenField,null,React.createElement(form_1.TokenValue,{length:this.values.token.access_token.length,masked:o},this.values.token.access_token),React.createElement(form_1.TokenShowHide,{onClick:this.toggleTokenMask},o?"Show":"Hide"," "),React.createElement(form_1.TokenClear,{onClick:this.clearToken}," Clear ")):React.createElement(form_1.FormError,{style:{marginBottom:"1em"}},"No token"))}}),t}(React.Component);exports.OAuth2TokenInput=OAuth2TokenInput,exports.default=OAuth2TokenInput;
 //# sourceMappingURL=OAuth2TokenInput.js.map

package/lib/components/console/OpenIDConnect.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import type { FormApi, FormState } from 'informed';
 import type { SecurityScheme } from '../../redoc-lib';
-import type { SecurityDetails } from '../../utils';
+import type { SecurityDetails } from '../../types';
 export interface OpenIDConnectProps {
     server: string;
     authCorsProxyUrl: Maybe<string>;
@@ -13,3 +13,6 @@ export interface OpenIDConnectProps {
     defaultValues?: SecurityDetails;
 }
 export declare function OpenIDConnect(props: OpenIDConnectProps): JSX.Element;
+export declare function Error({ message }: {
+    message: string;
+}): JSX.Element;

package/lib/components/console/OpenIDConnect.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.OpenIDConnect=void 0;var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),OpenIDConnect_1=require("../../services/OpenIDConnect"),LinearProgress_1=require("../common/LinearProgress"),form_1=require("../common/form"),OAuth2Flow_1=require("./OAuth2Flow");function OpenIDConnect(e){var t,n=this,r=e.scheme,o=e.defaultValues,a=React.useState({}),l=a[0],c=a[1],i=React.useState(),s=i[0],u=i[1],m=React.useState(!1),p=m[0],_=m[1];React.useEffect((function(){d(r.openIdConnectUrl)}),[r.openIdConnectUrl]);var d=function(e){return(0,tslib_1.__awaiter)(n,void 0,void 0,(function(){var t,n;return(0,tslib_1.__generator)(this,(function(r){switch(r.label){case 0:_(!0),u(""),r.label=1;case 1:return r.trys.push([1,3,,4]),[4,(0,OpenIDConnect_1.discoverOpenIDConnect)(e)];case 2:return t=r.sent(),c(t),[3,4];case 3:return n=r.sent(),u(n.message),[3,4];case 4:return _(!1),[2]}}))}))};return React.createElement("div",null,p?React.createElement("div",null,React.createElement("div",null,"Fetching OpenID Connect metadata..."),React.createElement(LinearProgress_1.LinearProgress,null)):React.createElement("div",null,s?React.createElement(form_1.FormError,null,s):(null===(t=null==l?void 0:l.response_types_supported)||void 0===t?void 0:t.includes("token"))?React.createElement(React.Fragment,null,React.createElement(FlowName,null,"OAuth2 Implicit Flow"),React.createElement(OAuth2Flow_1.OAuth2Flow,{key:e.id,authorizationUrl:l.authorization_endpoint,authCorsProxyUrl:e.authCorsProxyUrl,scopes:l.scopes_supported,server:e.server,id:e.id,form:e.form,formApi:e.formApi,clientId:e.clientId,flow:"implicit",defaultValues:o})):React.createElement("div",null,"Unsupported flow")))}exports.OpenIDConnect=OpenIDConnect;var templateObject_1,FlowName=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  margin-top: 5px;\n  margin-bottom: 10px;\n"],["\n  margin-top: 5px;\n  margin-bottom: 10px;\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.Error=exports.OpenIDConnect=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importStar)(require("react")),OpenIDConnect_1=require("../../services/OpenIDConnect"),LinearProgress_1=require("../common/LinearProgress"),form_1=require("../common/form"),OAuth2Flow_1=require("./OAuth2Flow"),styled_1=require("./styled");function OpenIDConnect(e){var t,r,n=this,l=e.scheme,o=e.defaultValues,a=(0,react_1.useState)({}),u=a[0],i=a[1],c=(0,react_1.useState)(),s=c[0],d=c[1],_=(0,react_1.useState)(!1),p=_[0],f=_[1];(0,react_1.useEffect)((function(){m(l.openIdConnectUrl)}),[l.openIdConnectUrl]);var m=function(e){return(0,tslib_1.__awaiter)(n,void 0,void 0,(function(){var t,r;return(0,tslib_1.__generator)(this,(function(n){switch(n.label){case 0:f(!0),d(""),n.label=1;case 1:return n.trys.push([1,3,,4]),[4,(0,OpenIDConnect_1.discoverOpenIDConnect)(e)];case 2:return t=n.sent(),i(t),[3,4];case 3:return r=n.sent(),d(r.message),[3,4];case 4:return f(!1),[2]}}))}))};return p?react_1.default.createElement(Loading,null):s?react_1.default.createElement(Error,{message:s}):react_1.default.createElement("div",null,react_1.default.createElement("div",null,(null===(t=null==u?void 0:u.response_types_supported)||void 0===t?void 0:t.includes("token"))?react_1.default.createElement(react_1.default.Fragment,null,react_1.default.createElement(styled_1.FlowName,null,"OAuth2 Implicit Flow"),react_1.default.createElement(OAuth2Flow_1.OAuth2Flow,{key:e.id,authorizationUrl:u.authorization_endpoint,authCorsProxyUrl:e.authCorsProxyUrl,scopes:u.scopes_supported,server:e.server,id:e.id,form:e.form,formApi:e.formApi,clientId:e.clientId,flow:"implicit",defaultValues:o})):(null===(r=null==u?void 0:u.response_types_supported)||void 0===r?void 0:r.includes("code"))?react_1.default.createElement(react_1.default.Fragment,null,react_1.default.createElement(styled_1.FlowName,null,"OAuth2 Authorization Flow"),react_1.default.createElement(OAuth2Flow_1.OAuth2Flow,{key:e.id,authorizationUrl:u.authorization_endpoint,tokenUrl:u.token_endpoint,authCorsProxyUrl:e.authCorsProxyUrl,scopes:u.scopes_supported,server:e.server,id:e.id,form:e.form,formApi:e.formApi,clientId:e.clientId,tokenEndpointAuthMethod:null==u?void 0:u.token_endpoint_auth_methods_supported,flow:"authorizationCode",defaultValues:o})):react_1.default.createElement("div",null,"Unsupported flow")))}function Loading(){return react_1.default.createElement("div",null,react_1.default.createElement("div",null,react_1.default.createElement("div",null,"Fetching OpenID Connect metadata..."),react_1.default.createElement(LinearProgress_1.LinearProgress,null)))}function Error(e){var t=e.message;return react_1.default.createElement("div",null,react_1.default.createElement("div",null,react_1.default.createElement(form_1.FormError,null,t)))}exports.OpenIDConnect=OpenIDConnect,exports.Error=Error;
 //# sourceMappingURL=OpenIDConnect.js.map

package/lib/components/console/ParameterArray.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { FieldModel } from '../../redoc-lib';
+interface ParameterArrayProps {
+    name: string;
+    param: FieldModel;
+    place: string;
+    renderParameter: any;
+}
+export declare const ParameterArray: ({ name, param, place, renderParameter, }: ParameterArrayProps) => JSX.Element;
+export {};

package/lib/components/console/ParameterArray.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ParameterArray=void 0;var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),form_1=require("../common/form"),ParameterArray=function(e){var t,n,r,a,o,l=e.name,i=e.param,c=e.place,s=e.renderParameter,m=React.useState([]),d=m[0],p=m[1],u=(null===(t=i.schema.items)||void 0===t?void 0:t.fields)?null===(n=i.schema.items)||void 0===n?void 0:n.fields:[{schema:(null===(r=i.schema.items)||void 0===r?void 0:r.schema)||i.schema.items,name:"",required:i.required,description:null===(a=i.schema.items)||void 0===a?void 0:a.description,externalDocs:null===(o=i.schema.items)||void 0===o?void 0:o.externalDocs,deprecated:!1,toggle:function(){return null},expanded:!1}];return React.createElement(React.Fragment,null,React.createElement(Row,null,React.createElement(form_1.FormLabel,{required:i.required},l,"(",d.length," items)"),React.createElement("span",{onClick:function(){p((0,tslib_1.__spreadArray)((0,tslib_1.__spreadArray)([],d,!0),[d.length?d[d.length-1]+1:0],!1))}},"Add item +")),null==d?void 0:d.map((function(e,t){return React.createElement(Row,{key:e},React.createElement(Delete,{onClick:function(){return t=e,void p(d.filter((function(e){return e!==t})));var t}},"delete"),u.map((function(n){return s(n,c,l+".["+e+"]","["+t+"]"+(n.name&&"."+n.name))})))})))};exports.ParameterArray=ParameterArray;var templateObject_1,templateObject_2,Row=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  display: flex;\n  width: 100%;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  margin-bottom: 10px;\n  label {\n    padding-bottom: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 1.5;\n  }\n  span {\n    cursor: pointer;\n    margin-left: auto;\n    color: var(--text-color-secondary);\n    &:hover {\n      color: #fff;\n    }\n  }\n"],["\n  display: flex;\n  width: 100%;\n  align-items: center;\n  justify-content: space-between;\n  flex-wrap: wrap;\n  margin-bottom: 10px;\n  label {\n    padding-bottom: 0;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    line-height: 1.5;\n  }\n  span {\n    cursor: pointer;\n    margin-left: auto;\n    color: var(--text-color-secondary);\n    &:hover {\n      color: #fff;\n    }\n  }\n"]))),Delete=styled_components_1.default.span(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  position: relative;\n"],["\n  background: transparent;\n  border: none;\n  cursor: pointer;\n  position: relative;\n"])));
+//# sourceMappingURL=ParameterArray.js.map

package/lib/components/console/RequestBody/RequestBody.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import type { RequestBodyProps } from './types';
+export declare const RequestBody: React.NamedExoticComponent<RequestBodyProps>;

package/lib/components/console/RequestBody/RequestBody.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RequestBody=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importStar)(require("react")),mobx_react_1=require("mobx-react"),deepmerge_1=(0,tslib_1.__importDefault)(require("deepmerge")),redoc_lib_1=require("../../../redoc-lib"),Samples_1=require("../../Samples"),utils_1=require("../../../services/utils"),helper_1=require("../../common/FileUpload/helper"),types_1=require("../../../types"),Dropdown_1=require("../../common/Dropdown"),RequestBodyForm_1=require("../RequestBodyForm"),RequestMimeLabel_1=require("../RequestMimeLabel"),CodemirrorInput_1=(0,tslib_1.__importDefault)(require("../CodemirrorInput")),utils_2=require("../utils"),utils_3=require("../../../utils"),RequestBodyComponent=(0,mobx_react_1.observer)((function(e){var t,r,a=e.body,l=e.formApi,o=e.resolvedBody,i=e.properties,n=e.id,u=e.validate,d=a.content,s=function(e){var t;if(!d||!d.hasSample)return"";var r=null===(t=d.active)||void 0===t?void 0:t.examples;if(!(null==r?void 0:r[e]))return"";var a=null==r?void 0:r[e].value,l=i?(0,deepmerge_1.default)(a,i,{arrayMerge:utils_1.arrayMergeStrategy}):a;return JSON.stringify(l,null,2)},m=null===(t=null==d?void 0:d.operation)||void 0===t?void 0:t.activeExampleName,_=function(e){null==d||d.activateExampleName(e),null==l||l.setValue("body",s(e))},p=function(e,t){null==l||l.setValue("body."+e,t)};(0,react_1.useEffect)((function(){var e,t;if(null===(e=null==d?void 0:d.operation)||void 0===e?void 0:e.activeMimeName){var r=(0,utils_2.getStorageExampleKey)(n,d.operation.activeMimeName,m,null===(t=null==d?void 0:d.active)||void 0===t?void 0:t.examples);null==l||l.setValue("body",(0,utils_3.fromSessionStorage)(r)||s(m||""))}else null==l||l.setValue("body",JSON.stringify(i||{},null,2))}),[m,null===(r=null==d?void 0:d.operation)||void 0===r?void 0:r.activeMimeName,null==d?void 0:d.active]);var c=(0,react_1.useCallback)((function(e,t,r){return void 0===e&&(e=""),void 0===t&&(t=""),void 0===r&&(r=[]),function(a){(0,utils_3.toSessionStorage)((0,utils_2.getStorageExampleKey)(n,e,t,r),a)}}),[n]);return react_1.default.createElement(react_1.default.Fragment,null,react_1.default.createElement(redoc_lib_1.MediaTypesSwitch,{content:a.content,renderDropdown:function(e){return react_1.default.createElement(redoc_lib_1.DropdownOrLabel,(0,tslib_1.__assign)({},e,{variant:"dark",fullWidth:!0,Label:RequestMimeLabel_1.RequestMimeLabel,Dropdown:Dropdown_1.Dropdown}))}},(function(e){var t=e.examples||{},r=Object.keys(t),a=e.schema,d=(0,helper_1.isRootFileUpload)(a||{},e.name)||e.name===types_1.MediaTypes.MULTIPART||e.name===types_1.MediaTypes.URL_ENCODED,s=(0,Samples_1.useExampleKey)(e.operation,t).exampleKey,m=(0,utils_3.fromSessionStorage)((0,utils_2.getStorageExampleKey)(n,e.name,s,t))||(0,utils_2.encodeSample)(t[s],i);return react_1.default.createElement(react_1.default.Fragment,null,r.length&&1!==r.length&&react_1.default.createElement(Samples_1.ExampleSwitch,{examples:t,onChange:_,exampleKey:s,panel:"try-it"})||null,d?react_1.default.createElement(RequestBodyForm_1.RequestBodyForm,{mediaType:e,formApi:l,onChange:p}):react_1.default.createElement(CodemirrorInput_1.default,{id:"body"+n,field:"body",initialValue:m,schema:((null==o?void 0:o.content[e.name])||{}).schema,mode:e.name,validate:u,onChange:c(e.name,s,t)}))})))}));exports.RequestBody=(0,react_1.memo)(RequestBodyComponent);
+//# sourceMappingURL=RequestBody.js.map

package/lib/components/console/RequestBody/index.d.ts

@@ -0,0 +1,2 @@
+export { RequestBody } from './RequestBody';
+export * from './types';

package/lib/components/console/RequestBody/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RequestBody=void 0;var tslib_1=require("tslib"),RequestBody_1=require("./RequestBody");Object.defineProperty(exports,"RequestBody",{enumerable:!0,get:function(){return RequestBody_1.RequestBody}}),(0,tslib_1.__exportStar)(require("./types"),exports);
+//# sourceMappingURL=index.js.map

package/lib/components/console/RequestBody/types.d.ts

@@ -0,0 +1,10 @@
+import type { FormApi } from 'informed';
+import type { RequestBodyModel, OpenAPIRequestBody } from '../../../redoc-lib';
+export interface RequestBodyProps {
+    body: RequestBodyModel;
+    resolvedBody: OpenAPIRequestBody;
+    validate: () => string | undefined;
+    formApi?: FormApi;
+    id: string;
+    properties: any;
+}

package/lib/components/console/RequestBody/types.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});
+//# sourceMappingURL=types.js.map

package/lib/components/console/RequestBodyForm.d.ts

@@ -1,9 +1,10 @@
-import React from 'react';
+/// <reference types="react" />
 import type { FormApi } from 'informed';
 import type { FieldModel, MediaTypeModel } from '../../redoc-lib';
+import type { UploadFileType } from '../../models';
 export declare const RequestBodyForm: (props: {
     mediaType: MediaTypeModel;
-    onChange: React.ChangeEventHandler<HTMLInputElement>;
+    onChange(key: string, file: UploadFileType): void;
     formApi?: FormApi<import("informed").FormValues> | undefined;
 }) => JSX.Element | null;
 export declare function getRequestBodyFormFields(mediaType: MediaTypeModel): FieldModel[];

package/lib/components/console/RequestMimeLabel.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RequestMimeLabel=void 0;var templateObject_1,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),shared_1=require("../shared");exports.RequestMimeLabel=(0,styled_components_1.default)(shared_1.MimeLabel)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  border-radius: var(--panels-border-radius);\n  margin-bottom: 10px;\n"],["\n  border-radius: var(--panels-border-radius);\n  margin-bottom: 10px;\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RequestMimeLabel=void 0;var templateObject_1,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),shared_1=require("../shared");exports.RequestMimeLabel=(0,styled_components_1.default)(shared_1.MimeLabel)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  border-radius: var(--panel-border-radius);\n  margin-bottom: 10px;\n"],["\n  border-radius: var(--panel-border-radius);\n  margin-bottom: 10px;\n"])));
 //# sourceMappingURL=RequestMimeLabel.js.map

package/lib/components/console/ResponsePanel.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ResponsePanel=void 0;var templateObject_1,templateObject_2,templateObject_3,templateObject_4,templateObject_5,tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),ResponseBody_1=require("./ResponseBody"),ResponseHeadersList_1=require("./ResponseHeadersList"),ResponseBadges=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 10px;\n"],["\n  margin-bottom: 10px;\n"]))),ResponseBadgeBase=styled_components_1.default.div(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  display: inline-block;\n  margin-right: 20px;\n  padding: 2px 0;\n  text-align: center;\n  color: var(--color-content-inverse);\n"],["\n  display: inline-block;\n  margin-right: 20px;\n  padding: 2px 0;\n  text-align: center;\n  color: var(--color-content-inverse);\n"]))),ResponseBadge=(0,styled_components_1.default)(ResponseBadgeBase)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  color: ",";\n"],["\n  color: ",";\n"])),(function(e){var t=e.code;return t>=200&&t<300?"var(--response-success-text-color)":t>=300&&t<400?"var(--response-redirect-text-color)":t>400?"var(--response-error-text-color)":"var(--response-info-text-color)"})),ErrorHeader=styled_components_1.default.header(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  font-weight: bold;\n  margin-bottom: 10px;\n"],["\n  font-weight: bold;\n  margin-bottom: 10px;\n"]))),ErrorDetails=styled_components_1.default.code(templateObject_5||(templateObject_5=(0,tslib_1.__makeTemplateObject)(["\n  border-left: 3px solid #ff4040;\n  padding-left: 5px;\n"],["\n  border-left: 3px solid #ff4040;\n  padding-left: 5px;\n"]))),ResponsePanel=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return(0,tslib_1.__extends)(t,e),Object.defineProperty(t.prototype,"render",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e,t=this.props,n=t.error,a=t.response,r=t.time,l=a||n&&n.response,s=l&&l.data&&l.data.length||0;return e=s>1e6?(s/1e6).toFixed(2)+" MB":s>1e3?(s/1e3).toFixed(2)+" KB":s+" B",n&&!n.response||!l?React.createElement(React.Fragment,null,React.createElement(ErrorHeader,null," Could not get any response "),React.createElement(ErrorDetails,null,n&&n.message||"Unknown error"),React.createElement("br",null),React.createElement(ErrorHeader,null," Why this might have happened:"),React.createElement("div",null," - CORS is misconfigured on the server"),React.createElement("div",null," - The server couldn't sent a response"),React.createElement("div",null," - No internet access"),React.createElement("div",null," - Documentation issue - contact API owner"),React.createElement("div",null," - Misconfigured security definition")):l?React.createElement(React.Fragment,null,React.createElement(ResponseBadges,null,React.createElement(ResponseBadge,{code:l.status},React.createElement("span",null," Status: "),l.status," ",l.statusText),React.createElement(ResponseBadgeBase,null,React.createElement("span",null," Time: "),r,"ms"),React.createElement(ResponseBadgeBase,null,React.createElement("span",null," Size: "),e)),React.createElement("div",null,React.createElement(ResponseHeadersList_1.ResponseHeadersList,{headers:l.headers}),React.createElement(ResponseBody_1.ResponseBody,{response:l}))):React.createElement(React.Fragment,null,"Something went wrong")}}),t}(React.PureComponent);exports.ResponsePanel=ResponsePanel;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ResponsePanel=void 0;var templateObject_1,templateObject_2,templateObject_3,templateObject_4,templateObject_5,tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),ResponseBody_1=require("./ResponseBody"),ResponseHeadersList_1=require("./ResponseHeadersList"),ResponseBadges=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 10px;\n"],["\n  margin-bottom: 10px;\n"]))),ResponseBadgeBase=styled_components_1.default.div(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  display: inline-block;\n  margin-right: 20px;\n  padding: 2px 0;\n  text-align: center;\n  color: var(--text-color-inverse);\n"],["\n  display: inline-block;\n  margin-right: 20px;\n  padding: 2px 0;\n  text-align: center;\n  color: var(--text-color-inverse);\n"]))),ResponseBadge=(0,styled_components_1.default)(ResponseBadgeBase)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  color: ",";\n"],["\n  color: ",";\n"])),(function(e){var t=e.code;return t>=200&&t<300?"var(--response-success-text-color)":t>=300&&t<400?"var(--response-redirect-text-color)":t>400?"var(--response-error-text-color)":"var(--response-info-text-color)"})),ErrorHeader=styled_components_1.default.header(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  font-weight: bold;\n  margin-bottom: 10px;\n"],["\n  font-weight: bold;\n  margin-bottom: 10px;\n"]))),ErrorDetails=styled_components_1.default.code(templateObject_5||(templateObject_5=(0,tslib_1.__makeTemplateObject)(["\n  border-left: 3px solid #ff4040;\n  padding-left: 5px;\n"],["\n  border-left: 3px solid #ff4040;\n  padding-left: 5px;\n"]))),ResponsePanel=function(e){function t(){return null!==e&&e.apply(this,arguments)||this}return(0,tslib_1.__extends)(t,e),Object.defineProperty(t.prototype,"render",{enumerable:!1,configurable:!0,writable:!0,value:function(){var e,t=this.props,n=t.error,a=t.response,r=t.time,l=a||n&&n.response,s=l&&l.data&&l.data.length||0;return e=s>1e6?(s/1e6).toFixed(2)+" MB":s>1e3?(s/1e3).toFixed(2)+" KB":s+" B",n&&!n.response||!l?React.createElement(React.Fragment,null,React.createElement(ErrorHeader,null," Could not get any response "),React.createElement(ErrorDetails,null,n&&n.message||"Unknown error"),React.createElement("br",null),React.createElement(ErrorHeader,null," Why this might have happened:"),React.createElement("div",null," - CORS is misconfigured on the server"),React.createElement("div",null," - The server couldn't send a response"),React.createElement("div",null," - No internet access"),React.createElement("div",null," - Documentation issue - contact API owner"),React.createElement("div",null," - Misconfigured security definition")):l?React.createElement(React.Fragment,null,React.createElement(ResponseBadges,null,React.createElement(ResponseBadge,{code:l.status},React.createElement("span",null," Status: "),l.status," ",l.statusText),React.createElement(ResponseBadgeBase,null,React.createElement("span",null," Time: "),r,"ms"),React.createElement(ResponseBadgeBase,null,React.createElement("span",null," Size: "),e)),React.createElement("div",null,React.createElement(ResponseHeadersList_1.ResponseHeadersList,{headers:l.headers}),React.createElement(ResponseBody_1.ResponseBody,{response:l}))):React.createElement(React.Fragment,null,"Something went wrong")}}),t}(React.PureComponent);exports.ResponsePanel=ResponsePanel;
 //# sourceMappingURL=ResponsePanel.js.map

package/lib/components/console/ServerVariable.d.ts

@@ -7,5 +7,5 @@ interface ServerVariableProps {
     description?: string;
     defaultValue: string;
 }
-export default function ServerVariable(props: ServerVariableProps): JSX.Element;
+export default function ServerVariable({ name, value, description, variableEnum, onChange, defaultValue, }: ServerVariableProps): JSX.Element;
 export {};

package/lib/components/console/ServerVariable.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var tslib_1=require("tslib"),React=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),form_1=require("../common/form"),TextField_1=require("../common/TextField"),styled_1=require("./styled");function ServerVariable(e){var t=e.name,l=e.value,r=e.description,n=e.variableEnum,a=e.onChange,o=e.defaultValue,i=n?n.map((function(e,t){return{value:e,idx:t}})):[];return React.createElement(form_1.FormControl,null,React.createElement(form_1.FormLabel,null,t,":"),i&&i.length?React.createElement(styled_1.TryItDropdown,{fullWidth:!0,variant:"dark",value:l,options:i,onChange:function(e){return a(e.value)}}):React.createElement(TextField_1.TextField,{fullWidth:!0,value:l,onChange:function(e){return a(e.target.value)},placeholder:o,panel:"try-it"}),r&&React.createElement(Description,null,r))}exports.default=ServerVariable;var templateObject_1,Description=styled_components_1.default.small(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  display: inline-block;\n  margin-top: 5px;\n  color: #d0d0d0;\n"],["\n  display: inline-block;\n  margin-top: 5px;\n  color: #d0d0d0;\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var tslib_1=require("tslib"),react_1=(0,tslib_1.__importStar)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),redoc_lib_1=require("../../redoc-lib"),form_1=require("../common/form"),TextField_1=require("../common/TextField"),styled_1=require("./styled");function ServerVariable(e){var t=e.name,r=e.value,l=e.description,a=e.variableEnum,n=e.onChange,o=e.defaultValue,u=(0,react_1.useCallback)((function(e){return n(e.target.value)}),[n]),c=(0,react_1.useCallback)((function(e){return n(e.value)}),[n]),d=a?a.map((function(e,t){return{value:e,idx:t}})):[];return react_1.default.createElement(form_1.FormControl,null,react_1.default.createElement(form_1.FormLabel,null,t,":"),d&&d.length?react_1.default.createElement(styled_1.TryItDropdown,{fullWidth:!0,variant:"dark",value:r,options:d,onChange:c}):react_1.default.createElement(TextField_1.TextField,{fullWidth:!0,value:r,onChange:u,placeholder:o,panel:"try-it"}),l&&react_1.default.createElement(StyledMarkdown,{compact:!0,source:l}))}exports.default=ServerVariable;var templateObject_1,StyledMarkdown=(0,styled_components_1.default)(redoc_lib_1.Markdown)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  margin-top: 5px;\n  color: #d0d0d0;\n"],["\n  margin-top: 5px;\n  color: #d0d0d0;\n"])));
 //# sourceMappingURL=ServerVariable.js.map

package/lib/components/console/ServersDropdown/ServersDropdown.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { ServersDropdownProps } from './types';
+export declare const ServersDropdown: ({ operation, onChange }: ServersDropdownProps) => JSX.Element;

package/lib/components/console/ServersDropdown/ServersDropdown.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ServersDropdown=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importStar)(require("react")),mobx_react_1=require("mobx-react"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),utils_1=require("../../../utils"),form_1=require("../../common/form"),utils_2=require("../utils"),ServerVariable_1=(0,tslib_1.__importDefault)(require("../ServerVariable")),hooks_1=require("../../../hooks"),styled_1=require("../styled");exports.ServersDropdown=(0,mobx_react_1.observer)((function(e){var r=e.operation,t=e.onChange,a=(0,utils_1.fromSessionStorage)("serverUrl"),l=r.servers.findIndex((function(e){return e.url===a})),s=(0,react_1.useState)(l<0?0:l),i=s[0],n=s[1],o=(0,react_1.useState)({}),u=o[0],_=o[1];(0,hooks_1.useMount)((function(){var e=(0,utils_2.getServerWithVariables)(r.servers,i);t(e),_(e.variables)}));var v=r.servers.map((function(e,r){return{idx:r,serverUrl:e.url,value:"\n          "+(0,utils_2.expandDefaultServerVariables)((0,utils_2.expandVariables)(e.url,u),e.variables)+"\n        - "+(e.description||"Default")+"\n      "}})),d=Object.keys(u);return react_1.default.createElement(ServerDropdownWrap,{"data-cy":"console-target-server"},react_1.default.createElement(form_1.FormLabel,{htmlFor:"server"},"Target server: "),react_1.default.createElement(form_1.FormControl,null,react_1.default.createElement(styled_1.TryItDropdown,{variant:"dark",value:v[i].value,options:v,fullWidth:!0,onChange:function(e){var a=r.servers.find((function(r){return r.url===e.serverUrl})),l=r.servers.findIndex((function(r){return r.url===e.serverUrl})),s=(0,utils_2.getDefaultOrStoredVariables)(a);t({url:e.serverUrl||"",variables:s}),(0,utils_1.toSessionStorage)("serverUrl",e.serverUrl||""),n(l),_(s)}})),null==d?void 0:d.map((function(e){var a,l=null===(a=r.servers[i].variables)||void 0===a?void 0:a[e];if(l)return react_1.default.createElement(ServerVariable_1.default,{key:e,name:e,value:u[e],defaultValue:l.default,onChange:function(a){return function(e,a){var l,s=r.servers[i],n=a||""===a?a:(0,utils_2.getDefaultOrStoredVariables)(s)[e],o=(0,tslib_1.__assign)((0,tslib_1.__assign)({},u),((l={})[e]=n,l));_(o),(0,utils_2.updateVariablesStorage)(e,n),t((0,tslib_1.__assign)((0,tslib_1.__assign)({},s),{variables:o}))}(e,a)},variableEnum:l.enum,description:l.description})})))}));var templateObject_1,ServerDropdownWrap=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 20px;\n"],["\n  margin-bottom: 20px;\n"])));
+//# sourceMappingURL=ServersDropdown.js.map

package/lib/components/console/ServersDropdown/index.d.ts

@@ -0,0 +1 @@
+export { ServersDropdown } from './ServersDropdown';

package/lib/components/console/ServersDropdown/index.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ServersDropdown=void 0;var ServersDropdown_1=require("./ServersDropdown");Object.defineProperty(exports,"ServersDropdown",{enumerable:!0,get:function(){return ServersDropdown_1.ServersDropdown}});
+//# sourceMappingURL=index.js.map

package/lib/components/console/ServersDropdown/types.d.ts

@@ -0,0 +1,5 @@
+import type { OperationModel, Server } from '../../../redoc-lib';
+export interface ServersDropdownProps {
+    operation: OperationModel;
+    onChange: (server: Server) => void;
+}

package/lib/components/console/ServersDropdown/types.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});
+//# sourceMappingURL=types.js.map

package/lib/components/console/TryItPanel.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { PanelComponentProps } from '../Panel';
+import type { PanelComponentProps } from '@redocly/theme';
 export declare function TryItPanel({ header, error, success, ...rest }: React.PropsWithChildren<{
     header: string;
     error?: boolean;

package/lib/components/console/TryItPanel.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.TryItPanel=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importDefault)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),Panel_1=require("../Panel"),redoc_lib_1=require("../../redoc-lib"),PanelBody_1=require("../Panel/PanelBody");function TryItPanel(e){var r=e.header,n=e.error,t=e.success,l=(0,tslib_1.__rest)(e,["header","error","success"]);return react_1.default.createElement(StyledTryItPanel,(0,tslib_1.__assign)({},l,{header:function(e){var a=e.toggle,o=e.expanded;return react_1.default.createElement(Panel_1.Header,{onClick:a,isExpanded:o,"data-cy":l["data-cy"]},react_1.default.createElement(Panel_1.Trigger,null,react_1.default.createElement(Panel_1.Title,null,r),react_1.default.createElement(redoc_lib_1.ShelfIcon,{direction:o?"down":"right"})),n&&react_1.default.createElement(redoc_lib_1.CrossIcon,{size:"14px",color:"--color-error-500"})||null,t&&react_1.default.createElement(redoc_lib_1.LockIcon,{size:"14px",color:"--color-success-500"})||null)}}))}exports.TryItPanel=TryItPanel;var templateObject_1,StyledTryItPanel=(0,styled_components_1.default)(Panel_1.Panel)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  "," {\n    color: white;\n    border: 1px solid ",";\n    padding: 10px;\n  }\n\n  "," path {\n    fill: white;\n  }\n\n  "," {\n    padding: 15px 10px;\n    background-color: #3e4c59;\n    border: 1px solid ",";\n    border-top: 0;\n  }\n"],["\n  "," {\n    color: white;\n    border: 1px solid ",";\n    padding: 10px;\n  }\n\n  "," path {\n    fill: white;\n  }\n\n  "," {\n    padding: 15px 10px;\n    background-color: #3e4c59;\n    border: 1px solid ",";\n    border-top: 0;\n  }\n"])),Panel_1.Header,(function(e){return e.error?"#ff908b":"#89949f"}),redoc_lib_1.ShelfIcon,PanelBody_1.PanelBody,(function(e){return e.error?"#ff908b":"#89949f"}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.TryItPanel=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importDefault)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),theme_1=require("@redocly/theme"),Panel_1=require("../Panel"),redoc_lib_1=require("../../redoc-lib");function TryItPanel(e){var r=e.header,t=e.error,n=e.success,l=(0,tslib_1.__rest)(e,["header","error","success"]);return react_1.default.createElement(StyledTryItPanel,(0,tslib_1.__assign)({className:"panel-try-it-nested"},l,{header:function(e){var a=e.toggle,o=e.expanded,d=void 0!==o&&o;return react_1.default.createElement(theme_1.PanelHeader,{onClick:a,expanded:d,"data-cy":l["data-cy"]},react_1.default.createElement(Panel_1.Trigger,null,react_1.default.createElement(theme_1.PanelHeaderTitle,null,r),react_1.default.createElement(theme_1.ShelfIcon,{direction:d?"down":"right"})),t&&react_1.default.createElement(redoc_lib_1.CrossIcon,{size:"14px",color:"--color-error-500"})||null,n&&react_1.default.createElement(redoc_lib_1.LockIcon,{size:"14px",color:"--color-success-500"})||null)}}))}exports.TryItPanel=TryItPanel;var templateObject_1,StyledTryItPanel=(0,styled_components_1.default)(theme_1.Panel)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  "," {\n    border: 1px solid\n      ",";\n    padding: 10px;\n  }\n\n  "," {\n    border: 1px solid\n      ",";\n    border-top: 0;\n  }\n"],["\n  "," {\n    border: 1px solid\n      ",";\n    padding: 10px;\n  }\n\n  "," {\n    border: 1px solid\n      ",";\n    border-top: 0;\n  }\n"])),theme_1.PanelHeader,(function(e){return e.error?"var(--color-error-300)":"var(--panel-try-it-nested-heading-border-color)"}),theme_1.PanelBody,(function(e){return e.error?"var(--color-error-300)":"var(--panel-try-it-nested-body-border-color)"}));
 //# sourceMappingURL=TryItPanel.js.map

package/lib/components/console/styled.d.ts

@@ -10,7 +10,6 @@ export declare const ConsoleBody: import("styled-components").StyledComponent<"d
 export declare const CloseButton: import("styled-components").StyledComponent<"span", any, {}, never>;
 export declare const invertedInputStyles: import("styled-components").FlattenSimpleInterpolation;
 export declare const TryItDropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
-    dense?: boolean | undefined;
     fullWidth?: boolean | undefined;
     variant?: "dark" | "light" | undefined;
 }, never>;
@@ -18,3 +17,4 @@ export declare const PanelPreCodeBlock: import("styled-components").StyledCompon
     'data-component-name': string;
 }, "data-component-name">;
 export declare const ResponseHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const FlowName: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/components/console/styled.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ResponseHeader=exports.PanelPreCodeBlock=exports.TryItDropdown=exports.invertedInputStyles=exports.CloseButton=exports.ConsoleBody=exports.ConsoleWrap=exports.blink=void 0;var tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importStar)(require("styled-components")),theme_1=require("@redocly/theme"),Dropdown_1=require("../common/Dropdown"),shake=(0,styled_components_1.keyframes)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  10%, 90% {\n    transform: translate3d(-1px, 0, 0);\n  }\n\n  20%, 80% {\n    transform: translate3d(2px, 0, 0);\n  }\n\n  30%, 50%, 70% {\n    transform: translate3d(-4px, 0, 0);\n  }\n\n  40%, 60% {\n    transform: translate3d(4px, 0, 0);\n  }\n"],["\n  10%, 90% {\n    transform: translate3d(-1px, 0, 0);\n  }\n\n  20%, 80% {\n    transform: translate3d(2px, 0, 0);\n  }\n\n  30%, 50%, 70% {\n    transform: translate3d(-4px, 0, 0);\n  }\n\n  40%, 60% {\n    transform: translate3d(4px, 0, 0);\n  }\n"])));exports.blink=(0,styled_components_1.keyframes)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  0% {\n    background-color: #007abf;\n  }\n\n  50% {\n    background-color: #59C3FF;\n  }\n\n  100% {\n    background-color: #007abf;\n  }\n"],["\n  0% {\n    background-color: #007abf;\n  }\n\n  50% {\n    background-color: #59C3FF;\n  }\n\n  100% {\n    background-color: #007abf;\n  }\n"])));var templateObject_1,templateObject_2,templateObject_3,templateObject_4,templateObject_5,templateObject_6,templateObject_7,templateObject_8,templateObject_9,templateObject_10,shakeAnimation=(0,styled_components_1.css)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n"],["\n  animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n"])),shake);exports.ConsoleWrap=styled_components_1.default.div(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  background-color: var(--samples-panel-background-color);\n  color: var(--color-content-inverse);\n  font-family: var(--code-font-family);\n  border-radius: var(--panels-border-radius);\n  overflow: hidden;\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  max-height: calc(85vh - ","px);\n  margin-bottom: 10px;\n  ",";\n  > div:last-child {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n"],["\n  background-color: var(--samples-panel-background-color);\n  color: var(--color-content-inverse);\n  font-family: var(--code-font-family);\n  border-radius: var(--panels-border-radius);\n  overflow: hidden;\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  max-height: calc(85vh - ","px);\n  margin-bottom: 10px;\n  ",";\n  > div:last-child {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n"])),(function(n){var e=n.scrollYOffset;return e?e():0}),(function(n){return n.shaking&&shakeAnimation})),exports.ConsoleBody=styled_components_1.default.div(templateObject_5||(templateObject_5=(0,tslib_1.__makeTemplateObject)(["\n  flex: 1;\n  padding: 20px 20px 15px;\n  overflow: auto;\n  display: ",";\n  flex-direction: column;\n  position: relative;\n  background-color: var(--samples-panel-background-color);\n"],["\n  flex: 1;\n  padding: 20px 20px 15px;\n  overflow: auto;\n  display: ",";\n  flex-direction: column;\n  position: relative;\n  background-color: var(--samples-panel-background-color);\n"])),(function(n){return n.hidden?"none":"flex"})),exports.CloseButton=styled_components_1.default.span(templateObject_6||(templateObject_6=(0,tslib_1.__makeTemplateObject)(["\n  cursor: pointer;\n  font-size: 24px;\n  font-weight: bold;\n  color: var(--color-content-inverse);\n"],["\n  cursor: pointer;\n  font-size: 24px;\n  font-weight: bold;\n  color: var(--color-content-inverse);\n"]))),exports.invertedInputStyles=(0,styled_components_1.css)(templateObject_7||(templateObject_7=(0,tslib_1.__makeTemplateObject)(["\n  border: none;\n  outline: none;\n  padding: 8px;\n  border-radius: var(--global-border-radius);\n  background-color: var(--samples-panel-controls-background-color);\n  color: var(--color-content-inverse);\n  font-family: var(--code-font-family);\n  font-size: var(--font-size-base);\n\n  &::placeholder {\n    opacity: 0.6;\n    color: var(--color-content-inverse);\n  }\n\n  &:-webkit-autofill {\n    background-color: var(--samples-panel-background-color);\n  }\n"],["\n  border: none;\n  outline: none;\n  padding: 8px;\n  border-radius: var(--global-border-radius);\n  background-color: var(--samples-panel-controls-background-color);\n  color: var(--color-content-inverse);\n  font-family: var(--code-font-family);\n  font-size: var(--font-size-base);\n\n  &::placeholder {\n    opacity: 0.6;\n    color: var(--color-content-inverse);\n  }\n\n  &:-webkit-autofill {\n    background-color: var(--samples-panel-background-color);\n  }\n"]))),exports.TryItDropdown=(0,styled_components_1.default)(Dropdown_1.Dropdown)(templateObject_8||(templateObject_8=(0,tslib_1.__makeTemplateObject)(["\n  .dropdown-select,\n  label {\n    background-color: var(--try-it-panel-controls-background-color);\n    border-color: var(--try-it-panel-controls-background-color);\n  }\n"],["\n  .dropdown-select,\n  label {\n    background-color: var(--try-it-panel-controls-background-color);\n    border-color: var(--try-it-panel-controls-background-color);\n  }\n"]))),exports.PanelPreCodeBlock=(0,styled_components_1.default)(theme_1.PreformattedCodeBlock)(templateObject_9||(templateObject_9=(0,tslib_1.__makeTemplateObject)(["\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n"],["\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n"]))),exports.ResponseHeader=styled_components_1.default.div(templateObject_10||(templateObject_10=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 10px;\n\n  &:not(:first-child) {\n    margin-top: 10px;\n  }\n"],["\n  margin-bottom: 10px;\n\n  &:not(:first-child) {\n    margin-top: 10px;\n  }\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FlowName=exports.ResponseHeader=exports.PanelPreCodeBlock=exports.TryItDropdown=exports.invertedInputStyles=exports.CloseButton=exports.ConsoleBody=exports.ConsoleWrap=exports.blink=void 0;var tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importStar)(require("styled-components")),theme_1=require("@redocly/theme"),Dropdown_1=require("../common/Dropdown"),shake=(0,styled_components_1.keyframes)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  10%, 90% {\n    transform: translate3d(-1px, 0, 0);\n  }\n\n  20%, 80% {\n    transform: translate3d(2px, 0, 0);\n  }\n\n  30%, 50%, 70% {\n    transform: translate3d(-4px, 0, 0);\n  }\n\n  40%, 60% {\n    transform: translate3d(4px, 0, 0);\n  }\n"],["\n  10%, 90% {\n    transform: translate3d(-1px, 0, 0);\n  }\n\n  20%, 80% {\n    transform: translate3d(2px, 0, 0);\n  }\n\n  30%, 50%, 70% {\n    transform: translate3d(-4px, 0, 0);\n  }\n\n  40%, 60% {\n    transform: translate3d(4px, 0, 0);\n  }\n"])));exports.blink=(0,styled_components_1.keyframes)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  0% {\n    background-color: #007abf;\n  }\n\n  50% {\n    background-color: #59C3FF;\n  }\n\n  100% {\n    background-color: #007abf;\n  }\n"],["\n  0% {\n    background-color: #007abf;\n  }\n\n  50% {\n    background-color: #59C3FF;\n  }\n\n  100% {\n    background-color: #007abf;\n  }\n"])));var templateObject_1,templateObject_2,templateObject_3,templateObject_4,templateObject_5,templateObject_6,templateObject_7,templateObject_8,templateObject_9,templateObject_10,templateObject_11,shakeAnimation=(0,styled_components_1.css)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n"],["\n  animation: "," 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n"])),shake);exports.ConsoleWrap=styled_components_1.default.div(templateObject_4||(templateObject_4=(0,tslib_1.__makeTemplateObject)(["\n  background-color: var(--panel-samples-background-color);\n  color: var(--panel-samples-text-color);\n  font-family: var(--panel-samples-font-family);\n  border-radius: var(--panel-border-radius);\n  overflow: hidden;\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  max-height: calc(85vh - ","px);\n  margin-bottom: 10px;\n  ",";\n  > div:last-child {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n"],["\n  background-color: var(--panel-samples-background-color);\n  color: var(--panel-samples-text-color);\n  font-family: var(--panel-samples-font-family);\n  border-radius: var(--panel-border-radius);\n  overflow: hidden;\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  max-height: calc(85vh - ","px);\n  margin-bottom: 10px;\n  ",";\n  > div:last-child {\n    border-top-left-radius: 0;\n    border-top-right-radius: 0;\n  }\n"])),(function(e){var n=e.scrollYOffset;return n?n():0}),(function(e){return e.shaking&&shakeAnimation})),exports.ConsoleBody=styled_components_1.default.div(templateObject_5||(templateObject_5=(0,tslib_1.__makeTemplateObject)(["\n  flex: 1;\n  padding: var(--panel-samples-body-padding);\n  overflow: auto;\n  display: ",";\n  flex-direction: column;\n  position: relative;\n  background-color: var(--panel-samples-body-background-color);\n"],["\n  flex: 1;\n  padding: var(--panel-samples-body-padding);\n  overflow: auto;\n  display: ",";\n  flex-direction: column;\n  position: relative;\n  background-color: var(--panel-samples-body-background-color);\n"])),(function(e){return e.hidden?"none":"flex"})),exports.CloseButton=styled_components_1.default.span(templateObject_6||(templateObject_6=(0,tslib_1.__makeTemplateObject)(["\n  cursor: pointer;\n  font-size: 24px;\n  font-weight: bold;\n  color: var(--text-color-inverse);\n"],["\n  cursor: pointer;\n  font-size: 24px;\n  font-weight: bold;\n  color: var(--text-color-inverse);\n"]))),exports.invertedInputStyles=(0,styled_components_1.css)(templateObject_7||(templateObject_7=(0,tslib_1.__makeTemplateObject)(["\n  border: none;\n  outline: none;\n  padding: 8px;\n  border-radius: var(--border-radius);\n  background-color: var(--panel-try-it-input-background-color);\n  color: var(--panel-try-it-input-text-color);\n  font-family: var(--code-font-family);\n  font-size: var(--font-size-base);\n  border: var(--panel-try-it-input-border);\n\n  &::placeholder {\n    opacity: 0.6;\n    color: var(--text-color-inverse);\n  }\n\n  &:-webkit-autofill {\n    background-color: var(--panel-samples-background-color);\n  }\n"],["\n  border: none;\n  outline: none;\n  padding: 8px;\n  border-radius: var(--border-radius);\n  background-color: var(--panel-try-it-input-background-color);\n  color: var(--panel-try-it-input-text-color);\n  font-family: var(--code-font-family);\n  font-size: var(--font-size-base);\n  border: var(--panel-try-it-input-border);\n\n  &::placeholder {\n    opacity: 0.6;\n    color: var(--text-color-inverse);\n  }\n\n  &:-webkit-autofill {\n    background-color: var(--panel-samples-background-color);\n  }\n"]))),exports.TryItDropdown=(0,styled_components_1.default)(Dropdown_1.Dropdown)(templateObject_8||(templateObject_8=(0,tslib_1.__makeTemplateObject)(["\n  .dropdown-select,\n  label {\n    background-color: var(--panel-try-it-dropdown-background-color);\n    border: var(--panel-try-it-dropdown-border);\n    color: var(--panel-try-it-dropdown-color);\n  }\n"],["\n  .dropdown-select,\n  label {\n    background-color: var(--panel-try-it-dropdown-background-color);\n    border: var(--panel-try-it-dropdown-border);\n    color: var(--panel-try-it-dropdown-color);\n  }\n"]))),exports.PanelPreCodeBlock=(0,styled_components_1.default)(theme_1.PreformattedCodeBlock)(templateObject_9||(templateObject_9=(0,tslib_1.__makeTemplateObject)(["\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n"],["\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n"]))),exports.ResponseHeader=styled_components_1.default.div(templateObject_10||(templateObject_10=(0,tslib_1.__makeTemplateObject)(["\n  margin-bottom: 10px;\n\n  &:not(:first-child) {\n    margin-top: 10px;\n  }\n"],["\n  margin-bottom: 10px;\n\n  &:not(:first-child) {\n    margin-top: 10px;\n  }\n"]))),exports.FlowName=styled_components_1.default.div(templateObject_11||(templateObject_11=(0,tslib_1.__makeTemplateObject)(["\n  margin-top: 5px;\n  margin-bottom: 10px;\n"],["\n  margin-top: 5px;\n  margin-bottom: 10px;\n"])));
 //# sourceMappingURL=styled.js.map

package/lib/components/console/utils.d.ts

@@ -1,5 +1,6 @@
-import type { FieldModel, OpenAPIServer, SecurityScheme, Server, ServerVariables, OperationModel } from '../../redoc-lib';
+import type { FieldModel, OpenAPIServer, SecurityScheme, Server, ServerVariables, OperationModel, ExampleModel } from '../../redoc-lib';
 import type { RedocProNormalizedOptions } from '../../services';
+import type { RequestBodyProps } from './RequestBody';
 export declare function normalizeUrlProtocol(url: string): string;
 export declare function updateStorage(state: GenericObject): void;
 export declare const getParameters: (parameters: FieldModel[], type: string) => GenericObject;
@@ -14,3 +15,13 @@ export declare function getFileNameFromHeaders(headers: Record<string, string>):
 export declare const makeRequestInterceptor: ({ requestInterceptor, sendXUserAgentInTryIt, disableTryItRequestUrlEncoding, }: Pick<RedocProNormalizedOptions, 'requestInterceptor' | 'sendXUserAgentInTryIt' | 'disableTryItRequestUrlEncoding'>, operation: OperationModel, securitySchemaAuth?: string | undefined) => (req: Request) => void | Request;
 export declare function requiredValidator(value: unknown): string | undefined;
 export declare function fromCookie(scheme: SecurityScheme): string | undefined;
+export declare const validateTokenEndpointMethod: (token: string[] | string | undefined) => boolean;
+export declare const getOAuth2TokenEndpointAuthHeader: ({ authMethod, clientId, clientSecret, }: {
+    authMethod?: string | string[] | undefined;
+    clientId: string;
+    clientSecret: string;
+}) => Record<'Authorization', string> | GenericObject;
+export declare function encodeSample(sample: ExampleModel, properties: RequestBodyProps['properties']): string;
+export declare const getStorageExampleKey: (operationId: string, activeMimeType: string, activeExample?: string | false | undefined, examples?: {
+    [name: string]: ExampleModel;
+} | undefined) => string;

package/lib/components/console/utils.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.fromCookie=exports.requiredValidator=exports.makeRequestInterceptor=exports.getFileNameFromHeaders=exports.unescapeQueryParams=exports.updateVariablesStorage=exports.getDefaultOrStoredVariables=exports.expandDefaultServerVariables=exports.expandVariables=exports.getInitialServerWithVariables=exports.getServerWithVariables=exports.getParameters=exports.updateStorage=exports.normalizeUrlProtocol=void 0;var tslib_1=require("tslib"),utils_1=require("../../utils");function normalizeUrlProtocol(e){return e.startsWith("//")?"https:"+e:e}function updateStorage(e){if(e.values.auth)for(var r=0,t=Object.keys(e.values.auth);r<t.length;r++){var a=t[r],i=e.values.auth[a];(0,utils_1.setSecurityDetails)(a,i)}updateParameterStorage(e)}function updateParameterStorage(e){for(var r,t=0,a=["path","query","header","cookie"];t<a.length;t++){var i=a[t];if(null===(r=e.values)||void 0===r?void 0:r[i])for(var o=0,s=Object.keys(e.values[i]);o<s.length;o++){var n=s[o];(0,utils_1.setParameterValue)(i,n,e.values[i][n])}}}exports.normalizeUrlProtocol=normalizeUrlProtocol,exports.updateStorage=updateStorage;var getParameters=function(e,r){return e.filter((function(e){return e.in===r})).reduce((function(e,r){var t=r.in,a=r.name;return e[a]=(0,utils_1.getParameterValue)(t||"",a),e}),{})};exports.getParameters=getParameters;var pathTemplateRegExp=/(?:{)(\w+)(?:})/g;function getServerWithVariables(e,r){void 0===r&&(r=0);var t=e[r],a=getDefaultOrStoredVariables(t);return(0,tslib_1.__assign)((0,tslib_1.__assign)({},t),{variables:a})}function getInitialServerWithVariables(e){var r=(0,utils_1.fromSessionStorage)("serverUrl"),t=e.find((function(e){return e.url===r}))||e[0],a=getDefaultOrStoredVariables(t);return(0,tslib_1.__assign)((0,tslib_1.__assign)({},t),{variables:a})}function expandVariables(e,r){return void 0===r&&(r={}),e.replace(pathTemplateRegExp,(function(e,t){return r[t]||e}))}function expandDefaultServerVariables(e,r){return void 0===r&&(r={}),e.replace(pathTemplateRegExp,(function(e,t){return r[t]&&r[t].default||e}))}function getDefaultOrStoredVariables(e){if(!(null==e?void 0:e.variables))return{};var r=(0,utils_1.fromSessionStorage)("variables"),t=r&&JSON.parse(r)||{},a={};return Object.entries(e.variables||{}).forEach((function(e){var r=e[0],i=e[1];a[r]=t[r]||i.default||""})),a}function updateVariablesStorage(e,r){var t,a=(0,utils_1.fromSessionStorage)("variables"),i=a&&JSON.parse(a)||{};(0,utils_1.toSessionStorage)("variables",JSON.stringify((0,tslib_1.__assign)((0,tslib_1.__assign)({},i),((t={})[e]=r,t))))}function unescapeQueryParams(e){return Object.entries(e).reduce((function(e,r){var t=r[0],a=r[1];return e[(0,utils_1.unescapeFormId)(t)]=a,e}),{})}function getFileNameFromHeaders(e){for(var r="filename=",t=0,a=Object.entries(e);t<a.length;t++){var i=a[t],o=i[0],s=i[1];if("content-disposition"===o.toLowerCase()){var n=s.split(";").find((function(e){return e.trim().startsWith(r)}));if(n)return n.split(r)[1]}}return""}exports.getServerWithVariables=getServerWithVariables,exports.getInitialServerWithVariables=getInitialServerWithVariables,exports.expandVariables=expandVariables,exports.expandDefaultServerVariables=expandDefaultServerVariables,exports.getDefaultOrStoredVariables=getDefaultOrStoredVariables,exports.updateVariablesStorage=updateVariablesStorage,exports.unescapeQueryParams=unescapeQueryParams,exports.getFileNameFromHeaders=getFileNameFromHeaders;var makeRequestInterceptor=function(e,r,t){var a=e.requestInterceptor,i=e.sendXUserAgentInTryIt,o=e.disableTryItRequestUrlEncoding;return function(e){var s,n,l,u;o&&(e=(0,tslib_1.__assign)((0,tslib_1.__assign)({},e),{url:decodeURIComponent(e.url)})),i&&(e.headers["X-User-Agent"]="Redocly Try it API console");var d=(null===(n=null===(s=null==r?void 0:r.requestValues)||void 0===s?void 0:s.header)||void 0===n?void 0:n.authorization)||(null===(u=null===(l=null==r?void 0:r.requestValues)||void 0===l?void 0:l.header)||void 0===u?void 0:u.Authorization);return!t&&d&&(e.headers.Authorization=d),a?a(e,r):e}};function requiredValidator(e){if(!e)return"Field is required"}exports.makeRequestInterceptor=makeRequestInterceptor,exports.requiredValidator=requiredValidator;var getCookie=function(e){var r=document.cookie.match("\\b"+e+"=([^;]*)\\b");return r?r[1]:void 0};function fromCookie(e){if("cookie"===e.in)return getCookie(e.name||"")}exports.fromCookie=fromCookie;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getStorageExampleKey=exports.encodeSample=exports.getOAuth2TokenEndpointAuthHeader=exports.validateTokenEndpointMethod=exports.fromCookie=exports.requiredValidator=exports.makeRequestInterceptor=exports.getFileNameFromHeaders=exports.unescapeQueryParams=exports.updateVariablesStorage=exports.getDefaultOrStoredVariables=exports.expandDefaultServerVariables=exports.expandVariables=exports.getInitialServerWithVariables=exports.getServerWithVariables=exports.getParameters=exports.updateStorage=exports.normalizeUrlProtocol=void 0;var tslib_1=require("tslib"),deepmerge_1=(0,tslib_1.__importDefault)(require("deepmerge")),types_1=require("../../types"),utils_1=require("../../services/utils"),utils_2=require("../../utils");function normalizeUrlProtocol(e){return e.startsWith("//")?"https:"+e:e}function updateStorage(e){if(e.values.auth)for(var r=0,t=Object.keys(e.values.auth);r<t.length;r++){var a=t[r],i=e.values.auth[a];(0,utils_2.setSecurityDetails)(a,i)}updateParameterStorage(e)}function updateParameterStorage(e){for(var r,t=0,a=["path","query","header","cookie"];t<a.length;t++){var i=a[t];if(null===(r=e.values)||void 0===r?void 0:r[i])for(var o=0,n=Object.keys(e.values[i]);o<n.length;o++){var s=n[o];(0,utils_2.setParameterValue)(i,s,e.values[i][s])}}}exports.normalizeUrlProtocol=normalizeUrlProtocol,exports.updateStorage=updateStorage;var getParameters=function(e,r){return e.filter((function(e){return e.in===r})).reduce((function(e,r){var t=r.in,a=r.name;return e[a]=(0,utils_2.getParameterValue)(t||"",a),e}),{})};exports.getParameters=getParameters;var pathTemplateRegExp=/(?:{)(\w+)(?:})/g;function getServerWithVariables(e,r){void 0===r&&(r=0);var t=e[r],a=getDefaultOrStoredVariables(t);return(0,tslib_1.__assign)((0,tslib_1.__assign)({},t),{variables:a})}function getInitialServerWithVariables(e){var r=(0,utils_2.fromSessionStorage)("serverUrl"),t=e.find((function(e){return e.url===r}))||e[0],a=getDefaultOrStoredVariables(t);return(0,tslib_1.__assign)((0,tslib_1.__assign)({},t),{variables:a})}function expandVariables(e,r){return void 0===r&&(r={}),e.replace(pathTemplateRegExp,(function(e,t){return r[t]||e}))}function expandDefaultServerVariables(e,r){return void 0===r&&(r={}),e.replace(pathTemplateRegExp,(function(e,t){return r[t]&&r[t].default||e}))}function getDefaultOrStoredVariables(e){if(!(null==e?void 0:e.variables))return{};var r=(0,utils_2.fromSessionStorage)("variables"),t=r&&JSON.parse(r)||{},a={};return Object.entries(e.variables||{}).forEach((function(e){var r=e[0],i=e[1];a[r]=t[r]||i.default||""})),a}function updateVariablesStorage(e,r){var t,a=(0,utils_2.fromSessionStorage)("variables"),i=a&&JSON.parse(a)||{};(0,utils_2.toSessionStorage)("variables",JSON.stringify((0,tslib_1.__assign)((0,tslib_1.__assign)({},i),((t={})[e]=r,t))))}function unescapeQueryParams(e){return Object.entries(e).reduce((function(e,r){var t=r[0],a=r[1];return e[(0,utils_2.unescapeFormId)(t)]=a,e}),{})}function getFileNameFromHeaders(e){for(var r="filename=",t=0,a=Object.entries(e);t<a.length;t++){var i=a[t],o=i[0],n=i[1];if("content-disposition"===o.toLowerCase()){var s=n.split(";").find((function(e){return e.trim().startsWith(r)}));if(s)return s.split(r)[1]}}return""}exports.getServerWithVariables=getServerWithVariables,exports.getInitialServerWithVariables=getInitialServerWithVariables,exports.expandVariables=expandVariables,exports.expandDefaultServerVariables=expandDefaultServerVariables,exports.getDefaultOrStoredVariables=getDefaultOrStoredVariables,exports.updateVariablesStorage=updateVariablesStorage,exports.unescapeQueryParams=unescapeQueryParams,exports.getFileNameFromHeaders=getFileNameFromHeaders;var makeRequestInterceptor=function(e,r,t){var a=e.requestInterceptor,i=e.sendXUserAgentInTryIt,o=e.disableTryItRequestUrlEncoding;return function(e){var n,s,u,l;o&&(e=(0,tslib_1.__assign)((0,tslib_1.__assign)({},e),{url:decodeURIComponent(e.url)})),i&&(e.headers["X-User-Agent"]="Redocly Try it API console");var d=(null===(s=null===(n=null==r?void 0:r.requestValues)||void 0===n?void 0:n.header)||void 0===s?void 0:s.authorization)||(null===(l=null===(u=null==r?void 0:r.requestValues)||void 0===u?void 0:u.header)||void 0===l?void 0:l.Authorization);return!t&&d&&(e.headers.Authorization=d),a?a(e,r):e}};function requiredValidator(e){if(!e)return"Field is required"}exports.makeRequestInterceptor=makeRequestInterceptor,exports.requiredValidator=requiredValidator;var getCookie=function(e){var r=document.cookie.match("\\b"+e+"=([^;]*)\\b");return r?r[1]:void 0};function fromCookie(e){if("cookie"===e.in)return getCookie(e.name||"")}exports.fromCookie=fromCookie;var validateTokenEndpointMethod=function(e){if(!e)return!0;var r=Array.isArray(e)?e:[e];return!(r.length&&!r.includes("none")&&!r.includes("client_secret_basic"))};exports.validateTokenEndpointMethod=validateTokenEndpointMethod;var getOAuth2TokenEndpointAuthHeader=function(e){var r=e.authMethod,t=e.clientId,a=e.clientSecret;return"client_secret_basic"===r||Array.isArray(r)&&r.includes("client_secret_basic")?{Authorization:"Basic "+btoa(t+":"+a)}:{}};function encodeSample(e,r){if(!e)return"";if(e.mime===types_1.MediaTypes.URL_ENCODED)return e.value;var t=e.value,a=r?(0,deepmerge_1.default)(t,r,{arrayMerge:utils_1.arrayMergeStrategy}):t;return JSON.stringify(a,null,2)}exports.getOAuth2TokenEndpointAuthHeader=getOAuth2TokenEndpointAuthHeader,exports.encodeSample=encodeSample;var getStorageExampleKey=function(e,r,t,a){var i=e+"_"+r;return t&&a&&Object.keys(a).includes(t)&&(i+="_"+t),i};exports.getStorageExampleKey=getStorageExampleKey;
 //# sourceMappingURL=utils.js.map

package/lib/components/index.d.ts

@@ -1,6 +1,7 @@
 export * from './NextSectionButton';
 export * from './StoreProvider';
 export * from './RedoclyReferenceDocs';
+export * from './RedoclyReferenceDocsMultiStandalone';
 export * from './pluggable';
 export * from './console/ConsoleLazy';
 export * from './ProProviders';

package/lib/components/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormError=exports.FormLabel=exports.FormControl=exports.Dropdown=exports.Checkbox=exports.TextField=exports.BackgroundStubFix=exports.ApiContentWrap=exports.NextSectionButtonWrap=exports.BackgroundStub=exports.ChangeViewButton=exports.ControlsWrap=exports.ToggleRightPanelButton=void 0;var tslib_1=require("tslib");(0,tslib_1.__exportStar)(require("./NextSectionButton"),exports),(0,tslib_1.__exportStar)(require("./StoreProvider"),exports),(0,tslib_1.__exportStar)(require("./RedoclyReferenceDocs"),exports),(0,tslib_1.__exportStar)(require("./pluggable"),exports),(0,tslib_1.__exportStar)(require("./console/ConsoleLazy"),exports),(0,tslib_1.__exportStar)(require("./ProProviders"),exports);var styled_elements_1=require("./styled.elements");Object.defineProperty(exports,"ToggleRightPanelButton",{enumerable:!0,get:function(){return styled_elements_1.ToggleRightPanelButton}}),Object.defineProperty(exports,"ControlsWrap",{enumerable:!0,get:function(){return styled_elements_1.ControlsWrap}}),Object.defineProperty(exports,"ChangeViewButton",{enumerable:!0,get:function(){return styled_elements_1.ChangeViewButton}}),Object.defineProperty(exports,"BackgroundStub",{enumerable:!0,get:function(){return styled_elements_1.BackgroundStub}}),Object.defineProperty(exports,"NextSectionButtonWrap",{enumerable:!0,get:function(){return styled_elements_1.NextSectionButtonWrap}}),Object.defineProperty(exports,"ApiContentWrap",{enumerable:!0,get:function(){return styled_elements_1.ApiContentWrap}}),Object.defineProperty(exports,"BackgroundStubFix",{enumerable:!0,get:function(){return styled_elements_1.BackgroundStubFix}});var TextField_1=require("./common/TextField");Object.defineProperty(exports,"TextField",{enumerable:!0,get:function(){return TextField_1.TextField}});var Checkbox_1=require("./common/Checkbox");Object.defineProperty(exports,"Checkbox",{enumerable:!0,get:function(){return Checkbox_1.Checkbox}});var Dropdown_1=require("./common/Dropdown");Object.defineProperty(exports,"Dropdown",{enumerable:!0,get:function(){return Dropdown_1.Dropdown}});var form_1=require("./common/form");Object.defineProperty(exports,"FormControl",{enumerable:!0,get:function(){return form_1.FormControl}}),Object.defineProperty(exports,"FormLabel",{enumerable:!0,get:function(){return form_1.FormLabel}}),Object.defineProperty(exports,"FormError",{enumerable:!0,get:function(){return form_1.FormError}});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormError=exports.FormLabel=exports.FormControl=exports.Dropdown=exports.Checkbox=exports.TextField=exports.BackgroundStubFix=exports.ApiContentWrap=exports.NextSectionButtonWrap=exports.BackgroundStub=exports.ChangeViewButton=exports.ControlsWrap=exports.ToggleRightPanelButton=void 0;var tslib_1=require("tslib");(0,tslib_1.__exportStar)(require("./NextSectionButton"),exports),(0,tslib_1.__exportStar)(require("./StoreProvider"),exports),(0,tslib_1.__exportStar)(require("./RedoclyReferenceDocs"),exports),(0,tslib_1.__exportStar)(require("./RedoclyReferenceDocsMultiStandalone"),exports),(0,tslib_1.__exportStar)(require("./pluggable"),exports),(0,tslib_1.__exportStar)(require("./console/ConsoleLazy"),exports),(0,tslib_1.__exportStar)(require("./ProProviders"),exports);var styled_elements_1=require("./styled.elements");Object.defineProperty(exports,"ToggleRightPanelButton",{enumerable:!0,get:function(){return styled_elements_1.ToggleRightPanelButton}}),Object.defineProperty(exports,"ControlsWrap",{enumerable:!0,get:function(){return styled_elements_1.ControlsWrap}}),Object.defineProperty(exports,"ChangeViewButton",{enumerable:!0,get:function(){return styled_elements_1.ChangeViewButton}}),Object.defineProperty(exports,"BackgroundStub",{enumerable:!0,get:function(){return styled_elements_1.BackgroundStub}}),Object.defineProperty(exports,"NextSectionButtonWrap",{enumerable:!0,get:function(){return styled_elements_1.NextSectionButtonWrap}}),Object.defineProperty(exports,"ApiContentWrap",{enumerable:!0,get:function(){return styled_elements_1.ApiContentWrap}}),Object.defineProperty(exports,"BackgroundStubFix",{enumerable:!0,get:function(){return styled_elements_1.BackgroundStubFix}});var TextField_1=require("./common/TextField");Object.defineProperty(exports,"TextField",{enumerable:!0,get:function(){return TextField_1.TextField}});var Checkbox_1=require("./common/Checkbox");Object.defineProperty(exports,"Checkbox",{enumerable:!0,get:function(){return Checkbox_1.Checkbox}});var Dropdown_1=require("./common/Dropdown");Object.defineProperty(exports,"Dropdown",{enumerable:!0,get:function(){return Dropdown_1.Dropdown}});var form_1=require("./common/form");Object.defineProperty(exports,"FormControl",{enumerable:!0,get:function(){return form_1.FormControl}}),Object.defineProperty(exports,"FormLabel",{enumerable:!0,get:function(){return form_1.FormLabel}}),Object.defineProperty(exports,"FormError",{enumerable:!0,get:function(){return form_1.FormError}});
 //# sourceMappingURL=index.js.map

package/lib/components/pluggable/PullRight.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PullRight=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importDefault)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),redoc_lib_1=require("../../redoc-lib"),CodePanel_1=require("../Panel/CodePanel"),MarkdownCodeBlock=(0,styled_components_1.default)(redoc_lib_1.Markdown)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: var(--samples-panel-heading-color, var(--samples-panel-text-color));\n  }\n\n  table {\n    color: #ffffff;\n    overflow-wrap: break-word;\n    word-break: break-word;\n\n    & tr {\n      td,\n      th {\n        background-color: var(--samples-panel-controls-background-color);\n      }\n    }\n\n    & tr:nth-child(2n) {\n      td,\n      th {\n        background-color: var(--samples-panel-markdown-background-color);\n      }\n    }\n\n    & thead tr th,\n    & tbody tr td {\n      background-color: var(--samples-panel-markdown-background-color);\n      border-color: var(--samples-panel-markdown-border-color);\n    }\n  }\n\n  code {\n    font-size: var(--code-block-font-size);\n    font-family: var(--code-block-font-family);\n    color: var(--code-block-color);\n    background-color: var(--code-block-background-color);\n  }\n\n  a,\n  a:visited {\n    color: var(--link-visited);\n  }\n\n  pre {\n    border: none;\n    padding: calc(var(--spacing-unit) * 4);\n    border-radius: var(--code-block-border-radius);\n    background: var(--code-block-preformatted-background-color);\n  }\n"],["\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: var(--samples-panel-heading-color, var(--samples-panel-text-color));\n  }\n\n  table {\n    color: #ffffff;\n    overflow-wrap: break-word;\n    word-break: break-word;\n\n    & tr {\n      td,\n      th {\n        background-color: var(--samples-panel-controls-background-color);\n      }\n    }\n\n    & tr:nth-child(2n) {\n      td,\n      th {\n        background-color: var(--samples-panel-markdown-background-color);\n      }\n    }\n\n    & thead tr th,\n    & tbody tr td {\n      background-color: var(--samples-panel-markdown-background-color);\n      border-color: var(--samples-panel-markdown-border-color);\n    }\n  }\n\n  code {\n    font-size: var(--code-block-font-size);\n    font-family: var(--code-block-font-family);\n    color: var(--code-block-color);\n    background-color: var(--code-block-background-color);\n  }\n\n  a,\n  a:visited {\n    color: var(--link-visited);\n  }\n\n  pre {\n    border: none;\n    padding: calc(var(--spacing-unit) * 4);\n    border-radius: var(--code-block-border-radius);\n    background: var(--code-block-preformatted-background-color);\n  }\n"])));function PullRight(n){var o=n.children;return react_1.default.createElement(StyledRightPanel,null,react_1.default.createElement(CodePanel_1.CodePanel,null,this.props.children&&react_1.default.createElement(MarkdownCodeBlock,{source:o})))}exports.PullRight=PullRight;var templateObject_1,templateObject_2,StyledRightPanel=(0,styled_components_1.default)(redoc_lib_1.SamplesPanel)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  float: right;\n  z-index: 1;\n  position: relative;\n  margin-bottom: 10px;\n"],["\n  float: right;\n  z-index: 1;\n  position: relative;\n  margin-bottom: 10px;\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PullRight=void 0;var tslib_1=require("tslib"),react_1=(0,tslib_1.__importDefault)(require("react")),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),redoc_lib_1=require("../../redoc-lib"),Panel_1=require("../Panel"),MarkdownCodeBlock=(0,styled_components_1.default)(redoc_lib_1.Markdown)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: var(--panel-samples-heading-text-color, var(--panel-samples-text-color));\n  }\n\n  table {\n    color: #ffffff;\n    overflow-wrap: break-word;\n    word-break: break-word;\n\n    & tr {\n      td,\n      th {\n        background-color: var(--samples-panel-controls-background-color);\n      }\n    }\n\n    & tr:nth-child(2n) {\n      td,\n      th {\n        background-color: var(--samples-panel-markdown-background-color);\n      }\n    }\n\n    & thead tr th,\n    & tbody tr td {\n      background-color: var(--samples-panel-markdown-background-color);\n      border-color: var(--samples-panel-markdown-border-color);\n    }\n  }\n\n  code {\n    font-size: var(--code-block-font-size);\n    font-family: var(--code-block-font-family);\n    color: var(--code-block-text-color);\n    background-color: var(--code-block-background-color);\n  }\n\n  a,\n  a:visited {\n    color: var(--link-visited);\n  }\n\n  pre {\n    border: none;\n    padding: calc(var(--spacing-unit) * 4);\n    border-radius: var(--code-block-border-radius);\n    background: var(--code-block-background-color);\n  }\n"],["\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    color: var(--panel-samples-heading-text-color, var(--panel-samples-text-color));\n  }\n\n  table {\n    color: #ffffff;\n    overflow-wrap: break-word;\n    word-break: break-word;\n\n    & tr {\n      td,\n      th {\n        background-color: var(--samples-panel-controls-background-color);\n      }\n    }\n\n    & tr:nth-child(2n) {\n      td,\n      th {\n        background-color: var(--samples-panel-markdown-background-color);\n      }\n    }\n\n    & thead tr th,\n    & tbody tr td {\n      background-color: var(--samples-panel-markdown-background-color);\n      border-color: var(--samples-panel-markdown-border-color);\n    }\n  }\n\n  code {\n    font-size: var(--code-block-font-size);\n    font-family: var(--code-block-font-family);\n    color: var(--code-block-text-color);\n    background-color: var(--code-block-background-color);\n  }\n\n  a,\n  a:visited {\n    color: var(--link-visited);\n  }\n\n  pre {\n    border: none;\n    padding: calc(var(--spacing-unit) * 4);\n    border-radius: var(--code-block-border-radius);\n    background: var(--code-block-background-color);\n  }\n"])));function PullRight(n){var o=n.children;return react_1.default.createElement(StyledRightPanel,null,react_1.default.createElement(Panel_1.CodePanel,null,this.props.children&&react_1.default.createElement(MarkdownCodeBlock,{source:o})))}exports.PullRight=PullRight;var templateObject_1,templateObject_2,StyledRightPanel=(0,styled_components_1.default)(redoc_lib_1.SamplesPanel)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  float: right;\n  z-index: 1;\n  position: relative;\n  margin-bottom: 10px;\n"],["\n  float: right;\n  z-index: 1;\n  position: relative;\n  margin-bottom: 10px;\n"])));
 //# sourceMappingURL=PullRight.js.map

package/lib/components/pluggable/styled.components.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FullWidthPanel=exports.ExamplesWrap=exports.SamplesWrap=void 0;var templateObject_1,templateObject_2,templateObject_3,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),redoc_lib_1=require("../../redoc-lib");exports.SamplesWrap=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  padding: calc(var(--spacing-unit) * 4);\n  border-radius: var(--panels-border-radius);\n  background-color: var(--samples-panel-background-color);\n"],["\n  padding: calc(var(--spacing-unit) * 4);\n  border-radius: var(--panels-border-radius);\n  background-color: var(--samples-panel-background-color);\n"]))),exports.ExamplesWrap=(0,styled_components_1.default)(exports.SamplesWrap)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  width: 100%;\n"],["\n  width: 100%;\n"]))),exports.FullWidthPanel=(0,styled_components_1.default)(redoc_lib_1.SamplesMiddlePanel)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  padding-left: var(--spacing-horizontal);\n  padding-right: var(--spacing-horizontal);\n  width: 100%;\n"],["\n  padding-left: var(--spacing-horizontal);\n  padding-right: var(--spacing-horizontal);\n  width: 100%;\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.FullWidthPanel=exports.ExamplesWrap=exports.SamplesWrap=void 0;var templateObject_1,templateObject_2,templateObject_3,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),redoc_lib_1=require("../../redoc-lib");exports.SamplesWrap=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  padding: calc(var(--spacing-unit) * 4);\n  border-radius: var(--panel-border-radius);\n  background-color: var(--panel-samples-background-color);\n"],["\n  padding: calc(var(--spacing-unit) * 4);\n  border-radius: var(--panel-border-radius);\n  background-color: var(--panel-samples-background-color);\n"]))),exports.ExamplesWrap=(0,styled_components_1.default)(exports.SamplesWrap)(templateObject_2||(templateObject_2=(0,tslib_1.__makeTemplateObject)(["\n  width: 100%;\n"],["\n  width: 100%;\n"]))),exports.FullWidthPanel=(0,styled_components_1.default)(redoc_lib_1.SamplesMiddlePanel)(templateObject_3||(templateObject_3=(0,tslib_1.__makeTemplateObject)(["\n  padding-left: var(--spacing-horizontal);\n  padding-right: var(--spacing-horizontal);\n  width: 100%;\n"],["\n  padding-left: var(--spacing-horizontal);\n  padding-right: var(--spacing-horizontal);\n  width: 100%;\n"])));
 //# sourceMappingURL=styled.components.js.map

package/lib/components/shared/HttpVerb.d.ts

@@ -1,4 +1,6 @@
 export declare const HttpVerb: import("styled-components").StyledComponent<"span", any, {
+    className: `operation-type ${string}`;
+    'data-component-name': string;
+} & {
     type: string;
-    compact?: boolean | undefined;
-}, never>;
+}, "className" | "data-component-name">;

package/lib/components/shared/HttpVerb.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HttpVerb=void 0;var templateObject_1,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components"));exports.HttpVerb=styled_components_1.default.span(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  display: inline-block;\n  color: var(--http-badge-color);\n  text-transform: uppercase;\n  text-align: center;\n  font-family: var(--http-badge-font-family);\n  border-radius: var(--http-badge-border-radius);\n  background-color: ",";\n  min-width: 58px;\n  padding: 0 8px;\n  font-size: var(--http-badge-font-size);\n  line-height: var(--http-badge-line-height);\n  font-weight: var(--http-badge-font-weight);\n"],["\n  display: inline-block;\n  color: var(--http-badge-color);\n  text-transform: uppercase;\n  text-align: center;\n  font-family: var(--http-badge-font-family);\n  border-radius: var(--http-badge-border-radius);\n  background-color: ",";\n  min-width: 58px;\n  padding: 0 8px;\n  font-size: var(--http-badge-font-size);\n  line-height: var(--http-badge-line-height);\n  font-weight: var(--http-badge-font-weight);\n"])),(function(t){return"var(--color-http-"+t.type+", var(--color-http-basic))"}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HttpVerb=void 0;var templateObject_1,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components")),OperationBadge_1=require("@redocly/theme/OperationBadge");exports.HttpVerb=(0,styled_components_1.default)(OperationBadge_1.OperationBadge)(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  display: inline-block;\n  padding: 0 8px;\n"],["\n  display: inline-block;\n  padding: 0 8px;\n"])));
 //# sourceMappingURL=HttpVerb.js.map

package/lib/components/shared/MimeLabel.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MimeLabel=void 0;var templateObject_1,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components"));exports.MimeLabel=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  background-color: var(--samples-panel-controls-background-color);\n  color: var(--color-content-inverse);\n  font-family: var(--code-font-family);\n  margin-bottom: 0;\n  height: 30px;\n  padding: 7px 10px;\n  font-size: 14px;\n  line-height: 16px;\n  border-radius: var(--global-border-radius);\n"],["\n  background-color: var(--samples-panel-controls-background-color);\n  color: var(--color-content-inverse);\n  font-family: var(--code-font-family);\n  margin-bottom: 0;\n  height: 30px;\n  padding: 7px 10px;\n  font-size: 14px;\n  line-height: 16px;\n  border-radius: var(--global-border-radius);\n"])));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.MimeLabel=void 0;var templateObject_1,tslib_1=require("tslib"),styled_components_1=(0,tslib_1.__importDefault)(require("styled-components"));exports.MimeLabel=styled_components_1.default.div(templateObject_1||(templateObject_1=(0,tslib_1.__makeTemplateObject)(["\n  background-color: var(--panel-samples-dropdown-background-color);\n  color: var(---panel-samples-dropdown-color);\n  font-family: var(--code-font-family);\n  margin-bottom: 0;\n  height: 36px;\n  padding: var(--dropdown-padding);\n  font-size: 14px;\n  line-height: 16px;\n  border: var(--panel-samples-dropdown-border);\n  border-radius: var(--border-radius);\n"],["\n  background-color: var(--panel-samples-dropdown-background-color);\n  color: var(---panel-samples-dropdown-color);\n  font-family: var(--code-font-family);\n  margin-bottom: 0;\n  height: 36px;\n  padding: var(--dropdown-padding);\n  font-size: 14px;\n  line-height: 16px;\n  border: var(--panel-samples-dropdown-border);\n  border-radius: var(--border-radius);\n"])));
 //# sourceMappingURL=MimeLabel.js.map

package/lib/components/shared/index.d.ts

@@ -1,4 +1,3 @@
 export * from './HttpVerb';
-export * from './SelectOnClick';
 export * from './NoSampleLabel';
 export * from './MimeLabel';

package/lib/components/shared/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var tslib_1=require("tslib");(0,tslib_1.__exportStar)(require("./HttpVerb"),exports),(0,tslib_1.__exportStar)(require("./SelectOnClick"),exports),(0,tslib_1.__exportStar)(require("./NoSampleLabel"),exports),(0,tslib_1.__exportStar)(require("./MimeLabel"),exports);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var tslib_1=require("tslib");(0,tslib_1.__exportStar)(require("./HttpVerb"),exports),(0,tslib_1.__exportStar)(require("./NoSampleLabel"),exports),(0,tslib_1.__exportStar)(require("./MimeLabel"),exports);
 //# sourceMappingURL=index.js.map