@redocly/openapi-docs 3.17.0 → 3.18.0-custom.0

package/lib/components/Security/OAuthScopes.d.ts

@@ -1,11 +1,11 @@
 import type { PropsWithChildren } from 'react';
-import type { OpenAPISecurityScheme } from '../../types/index.js';
 import type { SecurityRequirement } from '../../models/index.js';
-type Flow = OpenAPISecurityScheme['flows'];
+import type { OAuth2Flow, OAuth2Flows } from '../../types/index.js';
 interface OAuthScopesMainProps {
     id: string;
     securities: SecurityRequirement[];
-    flows?: Flow;
+    flow?: OAuth2Flow;
+    flows?: OAuth2Flows;
 }
 export declare const OAuthScopes: import("react").NamedExoticComponent<PropsWithChildren<OAuthScopesMainProps>>;
 export {};

package/lib/components/Security/OAuthScopes.js

@@ -1,33 +1,34 @@
-import{jsx as r,Fragment as p,jsxs as c}from"react/jsx-runtime";import{memo as S,useState as v}from"react";import{ChevronRightIcon as b}from"@redocly/theme/icons/ChevronRightIcon/ChevronRightIcon";import{Markdown as d}from"../Markdown/index.js";import{SecuritySchemeItem as a}from"./SecuritySchemeItem.js";import{Tag as m}from"./styled.js";import{useTranslate as l}from"../../hooks/index.js";import{getOptionalScopes as O,getRequiredScopes as x}from"./helper.js";import{styled as i}from"../../styled-components.js";function y({id:e,securities:t,flows:n}){const o=x(e,t);return c(p,{children:[r(w,{flows:n,requiredScopes:o}),r(q,{flows:n,requiredScopes:o})]})}function q({flows:e,requiredScopes:t}){return e&&Object.keys(e).map(n=>r(j,{flow:e[n],requiredScopes:t},n))}function j({flow:e,requiredScopes:t}){const n=l(),[o,h]=v(!1),f=Object.keys(e?.scopes||{}),u=O(t,f);return u.length===0?null:c(p,{children:[r(a,{label:c(A,{onClick:()=>{h(s=>!s)},children:[n(o?"openapi.hideOptionalScopes":"openapi.showOptionalScopes",o?"Hide optional scopes":"Show optional scopes"),r(C,{isOpen:o,children:r(b,{size:"var(--font-size-base)",color:"var(--tree-content-color-default)"})})]}),value:" "}),r(z,{isOpen:o,children:u.map(s=>r(a,{label:r(g,{className:"tag-grey",children:s}),value:r(d,{source:e?.scopes[s]||""})},s))})]})}function w({requiredScopes:e,flows:t}){const n=l();return e.length===0?null:t&&Object.keys(t).length>0?Object.keys(t).map(o=>r(k,{flow:t[o],requiredScopes:e},o)):r(a,{label:n("openapi.requiredScopes","Required scopes"),value:r(R,{children:e.map(o=>r(m,{className:"tag-grey",children:o},o))})})}function k({flow:e,requiredScopes:t}){const n=l();return c(p,{children:[r(a,{label:n("openapi.requiredScopes","Required scopes"),value:" "}),t.map(o=>r(a,{label:r(g,{className:"tag-grey",children:o}),value:r(d,{source:e?.scopes[o]||""})},o))]})}const g=i(m)`
+import{jsx as o,jsxs as c,Fragment as g}from"react/jsx-runtime";import{memo as f,useState as u}from"react";import{ChevronRightIcon as S}from"@redocly/theme/icons/ChevronRightIcon/ChevronRightIcon";import{Markdown as h}from"../Markdown/index.js";import{SecuritySchemeItem as l}from"./SecuritySchemeItem.js";import{Tag as v}from"./styled.js";import{useTranslate as x}from"../../hooks/index.js";import{getOptionalScopes as y,getRequiredScopes as O}from"./helper.js";import{styled as t}from"../../styled-components.js";import{ScopeTagWithTooltip as b}from"./ScopeTagWithTooltip.js";import{RequiredScopesList as w}from"./RequiredScopesList.js";import{normalizeScopes as C}from"../../utils/security-scope.js";const j=24;function q({id:e,securities:n,flow:a,flows:r}){const i=O(e,n);return a?o(z,{flow:a,requiredScopes:i}):o(I,{children:o(w,{schemeId:e,securities:n,flows:r})})}function z({flow:e,requiredScopes:n}){const a=x(),[r,i]=u(!1),m=Object.keys(e.scopes||{}),d=C(n),p=y(d,m);return p.length===0?null:c(g,{children:[o(l,{label:c(R,{onClick:()=>{i(s=>!s)},children:[a(r?"openapi.hideOptionalScopes":"openapi.showOptionalScopes",r?"Hide optional scopes":"Show optional scopes"),o(_,{isOpen:r,children:o(S,{size:"var(--font-size-base)",color:"var(--tree-content-color-default)"})})]}),value:" "}),o(T,{isOpen:r,children:p.map(s=>o(l,{label:o(b,{className:"tag-grey",text:s,maxChars:j,TagComponent:A,compact:!0}),value:o(W,{children:o(h,{source:e.scopes[s]||""})})},s))})]})}const A=t(v)`
   font-family: var(--font-family-base);
   font-size: var(--font-size-base);
-  line-height: var(--line-height-base);
   align-self: flex-start;
   padding: 0 var(--spacing-xs);
   border: var(--tag-border-width) var(--tag-border-style) var(--tag-bg-color);
   border-radius: var(--tag-border-radius);
-`,A=i.div`
+  color: var(--color-warm-grey-8);
+`,R=t.div`
   cursor: pointer;
   display: flex;
   gap: var(--spacing-xxs);
   align-items: center;
   user-select: none;
-`,R=i.div`
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--spacing-xxs);
-  word-break: normal;
-`,z=i.div`
+`,T=t.div`
   max-height: ${e=>e.isOpen?"1000px":"0"};
   opacity: ${e=>e.isOpen?"1":"0"};
   overflow: hidden;
   transition:
     max-height 0.5s ease-in-out,
     opacity 0.5s ease-in-out;
-`,C=i.span`
+`,_=t.span`
   display: inline-flex;
   align-items: center;
   justify-content: center;
   transform: ${e=>e.isOpen?"rotate(90deg)":"rotate(0deg)"};
   transition: transform 0.5s ease-in-out;
-`,B=S(y);export{B as OAuthScopes};
+`,I=t.div`
+  margin-top: var(--spacing-xs);
+`,W=t.div`
+  p {
+    margin-bottom: 0;
+  }
+`,G=f(q);export{G as OAuthScopes};

package/lib/components/Security/RequiredScopes.d.ts

@@ -0,0 +1,6 @@
+import type { ReactElement } from 'react';
+interface RequiredScopesProps {
+    scopes?: string[];
+}
+export declare function RequiredScopes({ scopes }: RequiredScopesProps): ReactElement | null;
+export {};

package/lib/components/Security/RequiredScopes.js

@@ -0,0 +1,17 @@
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{styled as o}from"../../styled-components.js";import{normalizeScopes as m}from"../../utils/security-scope.js";import{useTranslate as g}from"../../hooks/index.js";import{ScopeTagWithTooltip as c}from"./ScopeTagWithTooltip.js";const l=4,S=32;function j({scopes:d}){const t=g(),s=m(d);if(s.length===0)return null;const h=s.slice(0,l),a=s.slice(l),n=a.length;return r(x,{children:[e(p,{children:"("}),r(u,{children:[t("openapi.requiredScopes","Required scopes"),":"," "]}),r(f,{children:[h.map(i=>e(c,{className:"tag-grey",text:i,maxChars:S},i)),n>0&&e(c,{arrowPosition:"left",className:"tag-grey",text:`+${n}`,tip:e(v,{children:a.map(i=>e("div",{children:i},i))}),ariaLabel:t("openapi.showMoreScopes",`Show ${n} more scopes`)})]}),e(p,{children:")"})]})}const x=o.span`
+  display: inline;
+  margin-left: var(--spacing-xxs);
+`,u=o.span`
+  color: var(--color-warm-grey-8);
+  line-height: var(--line-height-base);
+`,f=o.span`
+  display: inline;
+  padding: 0 var(--spacing-xxs);
+`,v=o.div`
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xxs);
+`,p=o.span`
+  color: var(--text-color-description);
+  line-height: var(--line-height-base);
+`;export{j as RequiredScopes};

package/lib/components/Security/RequiredScopesList.d.ts

@@ -0,0 +1,14 @@
+import type { ComponentType, ReactElement, ReactNode } from 'react';
+import type { SecurityRequirement } from '../../models/index.js';
+import type { OAuth2Flows } from '../../types/index.js';
+interface RequiredScopesListProps {
+    schemeId: string;
+    securities: SecurityRequirement[];
+    flows?: OAuth2Flows;
+    TagComponent?: ComponentType<{
+        className?: string;
+        children: ReactNode;
+    }>;
+}
+export declare function RequiredScopesList({ schemeId, securities, flows, TagComponent, }: RequiredScopesListProps): ReactElement | null;
+export {};

package/lib/components/Security/RequiredScopesList.js

@@ -0,0 +1,13 @@
+import{jsx as r,Fragment as g,jsxs as u}from"react/jsx-runtime";import{SecuritySchemeItem as s}from"./SecuritySchemeItem.js";import{useTranslate as f}from"../../hooks/index.js";import{getRequiredScopes as S}from"./helper.js";import{normalizeScopes as b,buildScopeDescriptionIndex as v}from"../../utils/security-scope.js";import{ScopeTagWithTooltip as x}from"./ScopeTagWithTooltip.js";import{Tag as h}from"./styled.js";import{Markdown as y}from"../Markdown/index.js";import{styled as i}from"../../styled-components.js";const T=24;function A({schemeId:n,securities:m,flows:o,TagComponent:c=q}){const p=f(),l=S(n,m),t=b(l);if(t.length===0)return null;const a=o?v(o):null,d=!!a;return u(g,{children:[r(s,{label:p("openapi.requiredScopes","Required scopes"),value:" "}),t.map(e=>r(s,{label:r(x,{className:"tag-grey",text:e,maxChars:T,TagComponent:c,compact:!0}),value:d?r(_,{children:r(y,{source:a?.get(e)||""})}):" "},e))]})}const _=i.div`
+  p {
+    margin-bottom: 0;
+  }
+`,q=i(h)`
+  font-family: var(--font-family-base);
+  font-size: var(--font-size-base);
+  align-self: flex-start;
+  padding: 0 var(--spacing-xs);
+  border: var(--tag-border-width) var(--tag-border-style) var(--tag-bg-color);
+  border-radius: var(--tag-border-radius);
+  color: var(--color-warm-grey-8);
+`;export{A as RequiredScopesList};

package/lib/components/Security/ScopeTagWithTooltip.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentType, ReactElement, ReactNode } from 'react';
+type TagComponentProps = {
+    className?: string;
+    children: ReactNode;
+};
+interface ScopeTagWithTooltipProps {
+    className?: string;
+    text: string;
+    maxChars?: number;
+    tip?: string | ReactNode;
+    ariaLabel?: string;
+    TagComponent?: ComponentType<TagComponentProps>;
+    arrowPosition?: 'left' | 'right' | 'center';
+    compact?: boolean;
+}
+export declare function ScopeTagWithTooltip({ className, text, maxChars, tip, ariaLabel, TagComponent, arrowPosition, compact, }: ScopeTagWithTooltipProps): ReactElement;
+export {};

package/lib/components/Security/ScopeTagWithTooltip.js

@@ -0,0 +1,33 @@
+import{jsx as e}from"react/jsx-runtime";import{css as l}from"styled-components";import{Tooltip as h}from"@redocly/theme/components/Tooltip/Tooltip";import{styled as a}from"../../styled-components.js";import{getVisibleScopeLabel as b,isScopeTruncated as v}from"../../utils/security-scope.js";import{Tag as g}from"./styled.js";function k({className:i,text:r,maxChars:n=32,tip:s,ariaLabel:f,TagComponent:t=g,arrowPosition:u="center",compact:o=!1}){const c=b(r,n),d=s===void 0&&v(r,n)?r:s;return d?e(m,{$compact:o,children:e(h,{placement:"bottom",arrowPosition:u,tip:d,children:e(T,{role:"button",tabIndex:0,"aria-label":f??r,children:e(t,{className:i,children:e(p,{$compact:o,children:c})})})})}):e(m,{$compact:o,children:e(t,{className:i,children:e(p,{$compact:o,children:c})})})}const p=a.span`
+  display: inline-flex;
+  font-family: var(--font-family-base);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 16rem;
+  color: var(--color-warm-grey-8);
+  ${({$compact:i})=>!i&&l`
+      &&& {
+        font-size: var(--font-size-sm);
+      }
+    `}
+`,T=a.span`
+  cursor: default;
+
+  &:focus-visible {
+    outline: 1px solid var(--link-color-primary);
+    border-radius: var(--border-radius-md);
+  }
+`,m=a.span`
+  display: inline-block;
+  vertical-align: baseline;
+  line-height: var(--line-height-base);
+  ${({$compact:i})=>i?l`
+          margin: 0;
+        `:l`
+          margin: calc(var(--spacing-unit) / 2) var(--spacing-xxs) calc(var(--spacing-unit) / 2) 0;
+          &:last-child {
+            margin-right: 0;
+          }
+        `}
+`;export{k as ScopeTagWithTooltip};

package/lib/components/Security/Security.js

@@ -1 +1 @@
-import{jsx as r,Fragment as f,jsxs as y}from"react/jsx-runtime";import{useState as h,useRef as C}from"react";import{Portal as b}from"@redocly/theme/components/Portal/Portal";import{useModalScrollLock as w}from"@redocly/theme/core/openapi";import{SecurityButton as M}from"./SecurityButton.js";import{SecurityModal as S}from"./SecurityModal.js";import{useTelemetry as g}from"../../hooks/index.js";function _({securities:t}){const[i,c]=h(!1),l=g(),e=C(null);if(w(i),!t.length)return null;const m=()=>{const o=t.flatMap(s=>s.schemes),n=[...new Set(o.map(s=>s.type))],u=o.length,a=n.length>1,p=Date.now();e.current={securityTypes:n,schemesCount:u,isCombined:a,modalOpenTime:p},l.sendViewSecurityDetailsClickedMessage({id:"openapi-docs-security-button",object:"button",uri:window.location.href,securityTypes:n,schemesCount:u,isCombined:a}),c(!0)},d=()=>{if(e.current){const o=Date.now()-e.current.modalOpenTime;l.sendViewSecurityDetailsClosedMessage({id:"openapi-docs-security-button",object:"button",uri:window.location.href,securityTypes:e.current.securityTypes,schemesCount:e.current.schemesCount,isCombined:e.current.isCombined,timeInModalMs:o}),e.current=null}c(!1)};return y(f,{children:[r(M,{securities:t,onClick:m}),i&&r(b,{mountId:"api-content",children:r(S,{securities:t,onClose:d})})]})}export{_ as Security};
+import{jsx as r,Fragment as f,jsxs as y}from"react/jsx-runtime";import{useState as h,useRef as C}from"react";import{Portal as b}from"@redocly/theme/components/Portal/Portal";import{useModalScrollLock as w}from"@redocly/theme/core/openapi";import{SecurityButton as M}from"./SecurityButton.js";import{SecurityModal as S}from"./SecurityModal.js";import{useTelemetry as g}from"../../hooks/index.js";function _({securities:t}){const[i,c]=h(!1),l=g(),e=C(null);if(w(i),!t.length)return null;const m=()=>{const o=t.flatMap(s=>s.schemes),n=[...new Set(o.map(s=>s.type))],u=o.length,a=n.length>1,p=Date.now();e.current={securityTypes:n,schemesCount:u,isCombined:a,modalOpenTime:p},l.sendViewSecurityDetailsClickedMessage([{id:"openapi-docs-security-button",object:"button",uri:window.location.href,securityTypes:n,schemesCount:u,isCombined:a}]),c(!0)},d=()=>{if(e.current){const o=Date.now()-e.current.modalOpenTime;l.sendViewSecurityDetailsClosedMessage([{id:"openapi-docs-security-button",object:"button",uri:window.location.href,securityTypes:e.current.securityTypes,schemesCount:e.current.schemesCount,isCombined:e.current.isCombined,timeInModalMs:o}]),e.current=null}c(!1)};return y(f,{children:[r(M,{securities:t,onClick:m}),i&&r(b,{mountId:"api-content",children:r(S,{securities:t,onClose:d})})]})}export{_ as Security};

package/lib/components/Security/SecurityButton.js

@@ -1,15 +1,14 @@
-import{jsx as r,jsxs as o}from"react/jsx-runtime";import{Fragment as d}from"react";import{SecurityIcon as v}from"@redocly/theme/icons/SecurityIcon/SecurityIcon";import{Panel as u}from"@redocly/theme/components/Panel/Panel";import{Button as h}from"@redocly/theme/components/Button/Button";import{Tooltip as y}from"@redocly/theme/components/Tooltip/Tooltip";import{WarningFilledIcon as b}from"@redocly/theme/icons/WarningFilledIcon/WarningFilledIcon";import{useTranslate as x}from"../../hooks/index.js";import{styled as e}from"../../styled-components.js";import{deprecatedCss as w}from"../common/index.js";function N({securities:a,onClick:m}){const i=x();return r(j,{header:()=>o(k,{children:[r(v,{}),r(B,{children:i("openapi.security","Security")}),r(T,{onClick:m,variant:"link",children:i("openapi.viewSecurityDetails","View details")})]}),isExpandable:!1,children:r(C,{children:a.map((t,n)=>{const s=a.length>1&&t.schemes.length>1,f=t.schemes.map(({id:l,deprecated:c=!1},g)=>o(d,{children:[o(S,{deprecated:c,children:[l,c&&r(y,{tip:i("openapi.badges.deprecated","Deprecated"),children:r(b,{color:"var(--badge-deprecated-bg-color)"})})]}),g<t.schemes.length-1&&r(p,{children:" and "})]},l));return o(d,{children:[s?"(":"",f,s?")":"",n<a.length-1&&r(p,{children:" or "})]},n)})})})}const S=e.span`
-  ${({deprecated:a})=>a&&w}
-  display: flex;
+import{jsx as e,jsxs as i}from"react/jsx-runtime";import{Fragment as d}from"react";import{SecurityIcon as v}from"@redocly/theme/icons/SecurityIcon/SecurityIcon";import{Panel as u}from"@redocly/theme/components/Panel/Panel";import{Button as b}from"@redocly/theme/components/Button/Button";import{Tooltip as y}from"@redocly/theme/components/Tooltip/Tooltip";import{WarningFilledIcon as x}from"@redocly/theme/icons/WarningFilledIcon/WarningFilledIcon";import{useTranslate as w}from"../../hooks/index.js";import{styled as r}from"../../styled-components.js";import{deprecatedCss as S}from"../common/index.js";import{RequiredScopes as j}from"./RequiredScopes.js";function W({securities:a,onClick:m}){const o=w();return e(T,{header:()=>i(B,{children:[e(v,{}),e(D,{children:o("openapi.security","Security")}),e(C,{onClick:m,variant:"link",children:o("openapi.viewSecurityDetails","View details")})]}),isExpandable:!1,children:e(H,{children:a.map((t,n)=>{const s=a.length>1&&t.schemes.length>1,h=t.schemes.map(({id:l,scopes:g,deprecated:c=!1},f)=>i(d,{children:[i(k,{deprecated:c,children:[l,c&&e(y,{tip:o("openapi.badges.deprecated","Deprecated"),children:e(x,{color:"var(--badge-deprecated-bg-color)"})})]}),e(j,{scopes:g}),f<t.schemes.length-1&&e(p,{children:" and "})]},l));return i(d,{children:[s?"(":"",h,s?")":"",n<a.length-1&&e(p,{children:" or "})]},n)})})})}const k=r.span`
+  ${({deprecated:a})=>a&&S}
+  display: inline-flex;
   align-items: center;
   gap: var(--spacing-xxs);
-  display: inline-flex;
-};
-`,j=e(u)`
+  font-weight: var(--font-weight-medium);
+`,T=r(u)`
   margin-top: var(--spacing-base);
   border: var(--panel-border);
   border-radius: var(--panel-border-radius);
-`,k=e.div`
+`,B=r.div`
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -19,19 +18,20 @@ import{jsx as r,jsxs as o}from"react/jsx-runtime";import{Fragment as d}from"reac
   background-color: var(--layer-color);
   border-bottom: var(--panel-border);
   border-radius: var(--panel-border-radius) var(--panel-border-radius) 0 0;
-`,T=e(h)`
+`,C=r(b)`
   margin-left: auto;
   font-size: var(--font-size-sm);
-`,B=e.span`
+`,D=r.span`
   font-family: var(--font-family-base);
   font-weight: var(--font-weight-medium);
   color: var(--text-color-primary);
-`,C=e.div`
-  flex: 1;
-  text-overflow: ellipsis;
+`,H=r.div`
+  display: block;
   overflow: hidden;
   padding: var(--spacing-xs) var(--spacing-sm);
   color: var(--text-color-primary);
-`,p=e.span`
+  line-height: var(--line-height-base);
+`,p=r.span`
   color: var(--text-color-description);
-`;export{N as SecurityButton};
+  line-height: var(--line-height-base);
+`;export{W as SecurityButton};

package/lib/components/Security/SecurityFlow.js

@@ -1,21 +1,34 @@
-import{jsx as e,Fragment as m,jsxs as t}from"react/jsx-runtime";import{Badge as S}from"@redocly/theme/components/Badge/Badge";import{SecuritySchemeItem as a}from"./SecuritySchemeItem.js";import{titleize as w}from"../../utils/index.js";import{OAuthFlow as y}from"./OAuthFlow.js";import{StyledLink as d}from"./styled.js";import{Markdown as F}from"../Markdown/index.js";import{useTranslate as T}from"../../hooks/index.js";import{OAuthScopes as k}from"./OAuthScopes.js";import{styled as n}from"../../styled-components.js";function N({type:o,bearerFormat:h,name:u,flows:i,openIdConnectUrl:l,description:f,id:p,securities:g,in:b,deprecated:v=!1,oauth2MetadataUrl:s}){const r=T();if(!o||!p)return null;const x={http:t(m,{children:[e(a,{label:r("openapi.httpAuthorizationScheme","HTTP Authorization Scheme"),value:o}),e(a,{label:r("openapi.bearerFormat","Bearer Format"),value:h})]}),apiKey:e(a,{label:`${w(b||"")} ${r("openapi.parameterName","parameter name")}:`,value:u}),oauth2:t(m,{children:[e(a,{label:r("openapi.flowType","Flow type"),value:o}),i&&Object.keys(i).map(c=>e(y,{flow:i[c]},c))]}),openIdConnect:e(a,{label:r("openapi.connectUrl","Connect URL"),value:l&&e(d,{target:"_blank",rel:"noopener noreferrer",href:l,children:l})})};return t(j,{children:[t(z,{children:[e(_,{children:p}),v&&e(S,{deprecated:!0,children:r("openapi.badges.deprecated","Deprecated")})]}),e(F,{source:f}),s&&e(a,{label:r("openapi.oauth2MetadataUrl","OAuth2 Metadata URL"),value:e(d,{target:"_blank",rel:"noopener noreferrer",href:s,children:s})}),t(A,{children:[x[o]||null,e(k,{id:p,securities:g,flows:i})]})]})}const z=n.div`
+import{jsx as e,jsxs as r,Fragment as p}from"react/jsx-runtime";import{Badge as z}from"@redocly/theme/components/Badge/Badge";import{SecuritySchemeItem as n}from"./SecuritySchemeItem.js";import{titleize as A}from"../../utils/index.js";import{OAuthFlow as L}from"./OAuthFlow.js";import{StyledLink as v,Tag as O}from"./styled.js";import{Markdown as _}from"../Markdown/index.js";import{useTranslate as w}from"../../hooks/index.js";import{OAuthScopes as b}from"./OAuthScopes.js";import{styled as o}from"../../styled-components.js";import{RequiredScopesList as g}from"./RequiredScopesList.js";const j=["authorizationCode","clientCredentials","implicit","password","deviceAuthorization"];function k({flowType:l,flow:m,schemeId:h,securities:a}){const c=w();return r(p,{children:[e(n,{label:r(H,{className:"tag-grey",children:[e(N,{children:c("openapi.flowType","Flow type")})," ",e(P,{children:l})]}),value:e("span",{})}),r(C,{children:[e(L,{flow:m}),e(b,{id:h,securities:a,flow:m})]})]})}function V({type:l,bearerFormat:m,name:h,flows:a,openIdConnectUrl:c,description:y,id:t,securities:s,in:x,deprecated:T=!1,oauth2MetadataUrl:f}){const i=w();if(!l||!t)return null;const F={http:r(p,{children:[e(n,{label:i("openapi.httpAuthorizationScheme","HTTP Authorization Scheme"),value:l}),e(n,{label:i("openapi.bearerFormat","Bearer Format"),value:m}),e(g,{schemeId:t,securities:s,flows:a})]}),apiKey:r(p,{children:[e(n,{label:`${A(x||"")} ${i("openapi.parameterName","parameter name")}:`,value:h}),e(g,{schemeId:t,securities:s,flows:a})]}),oauth2:r(p,{children:[a&&Object.entries(a).filter(d=>{const[u,S]=d;return!!S&&j.includes(u)}).map(([d,u])=>e(k,{flowType:d,flow:u,schemeId:t,securities:s},d)),e(b,{id:t,securities:s,flows:a})]}),openIdConnect:r(p,{children:[e(n,{label:i("openapi.connectUrl","Connect URL"),value:c&&e(v,{target:"_blank",rel:"noopener noreferrer",href:c,children:c})}),e(g,{schemeId:t,securities:s,flows:a})]})};return r(W,{children:[r(I,{children:[e(R,{children:t}),T&&e(z,{deprecated:!0,children:i("openapi.badges.deprecated","Deprecated")})]}),e(_,{source:y}),f&&e(n,{label:i("openapi.oauth2MetadataUrl","OAuth2 Metadata URL"),value:e(v,{target:"_blank",rel:"noopener noreferrer",href:f,children:f})}),e(B,{children:F[l]||null})]})}const I=o.div`
   display: flex;
   align-items: center;
   gap: var(--spacing-xxs);
   margin: 0 0 var(--spacing-xs);
-`,j=n.div`
+`,W=o.div`
   background: var(--layer-color);
   padding: var(--spacing-base);
   border-radius: var(--border-radius);
   border: 1px solid var(--border-color-secondary);
   width: 100%;
   margin-top: var(--spacing-base);
-`,A=n.div`
+`,B=o.div`
   width: 100%;
   margin-top: var(--spacing-md);
-`,_=n.p`
+`,R=o.p`
   font-size: var(--font-size-base);
   margin: 0;
   text-transform: capitalize;
   font-weight: var(--font-weight-semibold);
-`;export{N as SecurityFlow};
+`,C=o.div`
+  display: flex;
+  flex-direction: column;
+  padding-left: var(--spacing-xs);
+  margin-bottom: var(--spacing-xxs);
+`,H=o(O)`
+  color: var(--color-warm-grey-8);
+  font-family: var(--font-family-base);
+`,N=o.span`
+  font-weight: var(--font-weight-regular);
+`,P=o.span`
+  color: var(--color-warm-grey-11);
+  font-weight: var(--font-weight-medium);
+`;export{V as SecurityFlow};

package/lib/components/ServerList/ServerList.js

@@ -1,4 +1,4 @@
-import{jsx as i,jsxs as o}from"react/jsx-runtime";import{CopyButton as x}from"@redocly/theme/components/Buttons/CopyButton";import{getServerDisplayName as b}from"../../utils/helpers.js";import{PanelItemDescription as u,Title as y}from"../PanelItem/index.js";import{ViewNested as w}from"../ViewNested/index.js";import{Tag as S}from"../common/index.js";import{Markdown as T}from"../Markdown/index.js";import{styled as e}from"../../styled-components.js";import{ServerDescriptionTooltip as j}from"./ServerDescriptionTooltip.js";const q=({servers:h,path:f="",translate:r})=>i(D,{children:h.map(t=>{const a=t.url+f,p=Object.keys(t.variables||{}).length,d=p===1?"variable":"variables",l=`${p||""} ${r(`openapi.${d}`,d)}`,v=!!t.name&&!!t.description;return o("div",{children:[o(L,{children:[i(u,{"data-testid":"server-panel-item-name",children:b(t)}),v&&i(j,{description:t.description})]}),o(O,{children:[i(y,{suppressHydrationWarning:!0,children:a}),i(x,{data:a},a)]}),t.variables&&i(w,{expandText:`${r("openapi.actions.show","Show")} ${l}`,hideText:`${r("openapi.actions.hide","Hide")} ${l}`,expandByDefault:!1,expandable:!0,hideDivider:!0,children:i($,{children:Object.entries(t.variables||{}).map(([c,n])=>o(z,{children:[i(k,{children:c}),o(s,{children:[r("openapi.default","Default")," ",i(g,{children:n.default})]}),i(W,{source:n.description}),n.enum&&o(s,{children:[r("openapi.enum","Enum")," ",i(C,{children:n.enum.map(m=>i(g,{children:m},m))})]})]},c))})})]},t.url)})}),D=e.div`
+import{jsx as i,jsxs as o}from"react/jsx-runtime";import{CopyButton as u}from"@redocly/theme/components/Buttons/CopyButton";import{CheckmarkFilledIcon as y}from"@redocly/theme/icons/CheckmarkFilledIcon/CheckmarkFilledIcon";import{getServerDisplayName as w}from"../../utils/helpers.js";import{PanelItemDescription as h,Title as S}from"../PanelItem/index.js";import{ViewNested as T}from"../ViewNested/index.js";import{Tag as l}from"../common/index.js";import{Markdown as j}from"../Markdown/index.js";import{styled as t}from"../../styled-components.js";import{ServerDescriptionTooltip as D}from"./ServerDescriptionTooltip.js";const A=({servers:v,path:f="",translate:n})=>i($,{children:v.map(e=>{const s=e.url+f,d=Object.keys(e.variables||{}).length,c=d===1?"variable":"variables",m=`${d||""} ${n(`openapi.${c}`,c)}`,b=!!e.name&&!!e.description;return o("div",{children:[o(W,{children:[o(h,{"data-testid":"server-panel-item-name",children:[w(e),e["x-isLive"]&&o(l,{className:"tag-green",children:[i(y,{}),"Live"]})]}),b&&i(D,{description:e.description}),e["x-labels"]?.length&&i(h,{style:{margin:"var(--spacing-xs) 0"},children:e["x-labels"]?.map(r=>o(l,{className:`tag-${r.color}`,children:[r.label,": ",r.value]},r.value))})||null]}),o(I,{children:[i(S,{suppressHydrationWarning:!0,children:s}),i(u,{data:s},s)]}),e.variables&&i(T,{expandText:`${n("openapi.actions.show","Show")} ${m}`,hideText:`${n("openapi.actions.hide","Hide")} ${m}`,expandByDefault:!1,expandable:!0,hideDivider:!0,children:i(z,{children:Object.entries(e.variables||{}).map(([r,a])=>o(k,{children:[i(C,{children:r}),o(p,{children:[n("openapi.default","Default")," ",i(x,{children:a.default})]}),i(L,{source:a.description}),a.enum&&o(p,{children:[n("openapi.enum","Enum")," ",i(N,{children:a.enum.map(g=>i(x,{children:g},g))})]})]},r))})})]},e.url)})}),$=t.div`
   & > div {
     border-bottom: 1px solid var(--border-color-secondary);
     margin-bottom: var(--spacing-xs);
@@ -10,7 +10,7 @@ import{jsx as i,jsxs as o}from"react/jsx-runtime";import{CopyButton as x}from"@r
     margin-bottom: 0;
     padding-bottom: 0;
   }
-`,$=e.div`
+`,z=t.div`
   padding-left: var(--spacing-xxs);
   & > div {
     border-bottom: 1px solid var(--border-color-secondary);
@@ -28,37 +28,37 @@ import{jsx as i,jsxs as o}from"react/jsx-runtime";import{CopyButton as x}from"@r
     margin-bottom: 0;
     padding-bottom: 0;
   }
-`,z=e.div`
+`,k=t.div`
   display: flex;
   flex-direction: column;
   flex-wrap: wrap;
-`,W=e(T)`
+`,L=t(j)`
   font-size: var(--font-size-sm);
   line-height: var(--line-height-sm);
   color: var(--text-color-primary);
-`,s=e.span`
+`,p=t.span`
   display: flex;
   gap: var(--spacing-xxs);
   font-size: var(--font-size-sm);
   line-height: var(--line-height-sm);
   color: var(--text-color-primary);
-`,k=e(s)`
+`,C=t(p)`
   padding-bottom: var(--spacing-xxs);
   font-weight: var(--font-weight-semibold);
-`,C=e.span`
+`,N=t.span`
   display: flex;
   gap: var(--spacing-xxs);
   flex-wrap: wrap;
-`,g=e(S)`
+`,x=t(l)`
   font-size: var(--font-size-sm);
   line-height: var(--line-height-sm);
-`,L=e.div`
+`,W=t.div`
   display: flex;
   justify-content: start;
   align-items: center;
   gap: var(--spacing-xxs);
-`,O=e.div`
+`,I=t.div`
   display: flex;
   justify-content: space-between;
   align-items: center;
-`;export{q as ServerList};
+`;export{A as ServerList};

package/lib/components/ServerListDropdown/ServerListDropdown.js

@@ -1 +1 @@
-import{jsx as e,jsxs as f}from"react/jsx-runtime";import{useMemo as S,useCallback as c}from"react";import{useAtom as g,useAtomValue as w}from"jotai";import{DropdownMenu as y}from"@redocly/theme/components/Dropdown/DropdownMenu";import{Dropdown as A}from"@redocly/theme/components/Dropdown/Dropdown";import{getOperationColor as C}from"@redocly/theme/core/openapi";import{HttpVerb as b}from"../common/index.js";import{PathWrapper as k,Path as P,StyledCopyButton as V,StyledDropdownMenuItem as j}from"./styled.js";import{PanelItem as x}from"../PanelItem/index.js";import{joinWithSeparator as D}from"../../services/index.js";import{getServerDisplayName as M,replaceVariables as E}from"../../utils/index.js";import{environmentAtom as N}from"../../jotai/app.js";import{useActiveWithFallback as O,useTelemetry as W}from"../../hooks/index.js";import{getServerEnvName as p}from"../../utils/environments.js";import{createTargetServerSwitchEvent as I}from"../../events/index.js";import{globalStoreAtom as T}from"../../jotai/store.js";const $=({operation:r,className:h})=>{const n=W(),[[d],m]=g(N),{options:{events:i}}=w(T),s=O(r.servers.map(t=>({...t,key:t.url})),d.server),a=c(t=>{t.stopPropagation()},[]),l=c(t=>()=>{if(r.servers.length!==1&&(m({environment:p(t)}),n.sendSwitchServersClickedMessage({server:p(t)}),i?.targetServerSwitch&&t)){const o=I({operation:r,serverUrl:t.url});i.targetServerSwitch(o)}},[r,m,n,i]),v=S(()=>r.servers.map(t=>{const o=D(E(t),r.path);return e(j,{onAction:l(t),children:e(x,{header:M(t),title:o,actions:[e(V,{data:o,toasterPlacement:"left",onCopyClick:a},o)],active:t.url===s,withCheckmark:!0})},o)}),[r.servers,r.path,l,a,s]),u=C({isAdditionalOperation:r.isAdditionalOperation,httpVerb:r.httpVerb});return e(A,{className:h,trigger:f(k,{variant:"ghost",children:[e(b,{color:u,children:r.httpVerb}),e(P,{children:r.path})]}),withArrow:!0,children:e(y,{children:v})})};export{$ as ServerListDropdown};
+import{jsx as e,jsxs as S}from"react/jsx-runtime";import{useMemo as g,useCallback as a}from"react";import{useAtom as w,useAtomValue as y}from"jotai";import{DropdownMenu as A}from"@redocly/theme/components/Dropdown/DropdownMenu";import{Dropdown as C}from"@redocly/theme/components/Dropdown/Dropdown";import{getOperationColor as b}from"@redocly/theme/core/openapi";import{HttpVerb as k}from"../common/index.js";import{PathWrapper as j,Path as P,StyledCopyButton as V,StyledDropdownMenuItem as x}from"./styled.js";import{PanelItem as D}from"../PanelItem/index.js";import{joinWithSeparator as M}from"../../services/index.js";import{getServerDisplayName as E,replaceVariables as p}from"../../utils/index.js";import{environmentAtom as N}from"../../jotai/app.js";import{useActiveWithFallback as O,useTelemetry as W}from"../../hooks/index.js";import{getServerEnvName as h}from"../../utils/environments.js";import{createTargetServerSwitchEvent as _}from"../../events/index.js";import{globalStoreAtom as I}from"../../jotai/store.js";const $=({operation:r,className:d})=>{const m=W(),[[v],n]=w(N),{options:{events:i}}=y(I),s=O(r.servers.map(t=>({...t,key:t.url})),v.server),c=a(t=>{t.stopPropagation()},[]),l=a(t=>()=>{if(r.servers.length!==1&&(n({environment:h(t)}),m.sendSwitchServersClickedMessage([{object:"switch_servers",server:h(t)}]),i?.targetServerSwitch&&t)){const o=_({operation:r,serverUrl:t.url});i.targetServerSwitch(o)}},[r,n,m,i]),u=g(()=>r.servers.map(t=>{const o=r.isRpc?p(t):M(p(t),r.path);return e(x,{onAction:l(t),children:e(D,{header:E(t),title:o,actions:[e(V,{data:o,toasterPlacement:"left",onCopyClick:c},o)],active:t.url===s,withCheckmark:!0})},o)}),[r.servers,r.isRpc,r.path,l,c,s]),f=b({isAdditionalOperation:r.isAdditionalOperation,httpVerb:r.httpVerb});return e(C,{className:d,trigger:S(j,{variant:"ghost",children:[e(k,{color:f,children:r.httpVerb}),e(P,{children:r.path})]}),withArrow:!0,children:e(A,{children:u})})};export{$ as ServerListDropdown};

package/lib/components/TagItem/OperationsNavigation.js

@@ -1,6 +1,6 @@
-import{jsx as i,jsxs as y}from"react/jsx-runtime";import{useMemo as N,memo as j,useState as E,useCallback as W}from"react";import{useNavigate as B}from"react-router-dom";import{LayoutVariant as _}from"@redocly/config";import{useAtomValue as V}from"jotai/index";import{SamplesPanel as z}from"../common/index.js";import{layoutAtom as D}from"../../jotai/app.js";import{OperationNavigationItems as p}from"./OperationNavigationItems.js";import{StyledButton as K}from"./styled.js";import{useTranslate as L}from"../../hooks/index.js";import{styled as X}from"../../styled-components.js";import{isRenderableMenuItem as q}from"../../utils/menu.js";const m=8;function F({items:c,routingBasePath:n}){const o=L(),[r,O]=E(!1),u=B(),P=V(D)===_.STACKED,{operations:h,webhooks:d,schemas:f,mcpTools:g,showMoreCount:k,totalCount:w,mcpResources:C,mcpPrompts:x}=N(()=>{const s=c.filter(e=>q(e)),b=r?s:s.slice(0,m),{operations:v,additionalOperations:S,webhooks:M,schemas:T,mcpTools:R,mcpResources:A,mcpPrompts:I}=b.reduce((e,t)=>{if(t.type==="operation"&&t.isWebhook)e.webhooks.push(t);else if(t.type==="operation"){const l=t;l.isAdditionalOperation?e.additionalOperations.push(l):e.operations.push(l)}else t.type==="schema"?e.schemas.push(t):t.type==="tool"?e.mcpTools.push(t):t.type==="rsrc"?e.mcpResources.push(t):t.type==="prompt"&&e.mcpPrompts.push(t);return e},{operations:[],additionalOperations:[],webhooks:[],schemas:[],mcpTools:[],mcpResources:[],mcpPrompts:[]});return{operations:[...v,...S],schemas:T,mcpTools:R,webhooks:M,mcpResources:A,mcpPrompts:I,showMoreCount:!r&&s.length>m?s.length-m:0,totalCount:s.length}},[r,c]),a=W(s=>u(s),[u]);return w?y(G,{isStacked:P,"data-testid":"operation-navigation-list",children:[f.length>0&&i(p,{items:f,onClick:a,routingBasePath:n,translate:o,title:o("openapi.schemas","Schemas")}),g.length>0&&i(p,{items:g,onClick:a,routingBasePath:n,translate:o,title:o("openapi.mcp.tools","MCP Tools")}),C.length>0&&i(p,{items:C,onClick:a,routingBasePath:n,translate:o,title:o("openapi.mcp.resources","MCP Resources")}),x.length>0&&i(p,{items:x,onClick:a,routingBasePath:n,translate:o,title:o("openapi.mcp.prompts","MCP Prompts")}),h.length>0&&i(p,{items:h,onClick:a,routingBasePath:n,translate:o,title:o("openapi.operations","Operations")}),d.length>0&&i(p,{items:d,onClick:a,routingBasePath:n,translate:o,title:o("openapi.webhooks","Webhooks")}),!r&&!!k&&y(K,{variant:"link",size:"large","data-testid":"show-more-operations",fullWidth:!0,onClick:()=>O(!0),children:[o("openapi.actions.show","Show")," ",k," ",o("openapi.actions.more","more"),"..."]})]}):null}const io=j(F),G=X(z)`
+import{jsx as i,jsxs as y}from"react/jsx-runtime";import{useMemo as E,memo as W,useState as B,useCallback as _}from"react";import{useNavigate as V}from"react-router-dom";import{LayoutVariant as z}from"@redocly/config";import{useAtomValue as D}from"jotai/index";import{SamplesPanel as K}from"../common/index.js";import{layoutAtom as L}from"../../jotai/app.js";import{OperationNavigationItems as p}from"./OperationNavigationItems.js";import{StyledButton as X}from"./styled.js";import{useTranslate as q}from"../../hooks/index.js";import{styled as F}from"../../styled-components.js";import{isRenderableMenuItem as G}from"../../utils/menu.js";const m=8;function H({items:c,routingBasePath:s}){const o=q(),[l,P]=B(!1),h=V(),w=D(L)===z.STACKED,{operations:u,rpcOperations:d,webhooks:f,schemas:g,mcpTools:k,showMoreCount:C,totalCount:b,mcpResources:O,mcpPrompts:x}=E(()=>{const a=c.filter(e=>G(e)),v=l?a:a.slice(0,m),{operations:M,rpcOperations:R,additionalOperations:S,webhooks:T,schemas:A,mcpTools:I,mcpResources:N,mcpPrompts:j}=v.reduce((e,t)=>{if(t.type==="operation"&&t.isWebhook)e.webhooks.push(t);else if(t.type==="operation"){const r=t;r.isRpc?e.rpcOperations.push(r):r.isAdditionalOperation?e.additionalOperations.push(r):e.operations.push(r)}else t.type==="schema"?e.schemas.push(t):t.type==="tool"?e.mcpTools.push(t):t.type==="rsrc"?e.mcpResources.push(t):t.type==="prompt"&&e.mcpPrompts.push(t);return e},{operations:[],rpcOperations:[],additionalOperations:[],webhooks:[],schemas:[],mcpTools:[],mcpResources:[],mcpPrompts:[]});return{operations:[...M,...S],rpcOperations:R,schemas:A,mcpTools:I,webhooks:T,mcpResources:N,mcpPrompts:j,showMoreCount:!l&&a.length>m?a.length-m:0,totalCount:a.length}},[l,c]),n=_(a=>h(a),[h]);return b?y(J,{isStacked:w,"data-testid":"operation-navigation-list",children:[g.length>0&&i(p,{items:g,onClick:n,routingBasePath:s,translate:o,title:o("openapi.schemas","Schemas")}),k.length>0&&i(p,{items:k,onClick:n,routingBasePath:s,translate:o,title:o("openapi.mcp.tools","MCP Tools")}),O.length>0&&i(p,{items:O,onClick:n,routingBasePath:s,translate:o,title:o("openapi.mcp.resources","MCP Resources")}),x.length>0&&i(p,{items:x,onClick:n,routingBasePath:s,translate:o,title:o("openapi.mcp.prompts","MCP Prompts")}),d.length>0&&i(p,{items:d,onClick:n,routingBasePath:s,translate:o,title:o("openapi.rpcMethods","RPC methods")}),u.length>0&&i(p,{items:u,onClick:n,routingBasePath:s,translate:o,title:o("openapi.operations","Operations")}),f.length>0&&i(p,{items:f,onClick:n,routingBasePath:s,translate:o,title:o("openapi.webhooks","Webhooks")}),!l&&!!C&&y(X,{variant:"link",size:"large","data-testid":"show-more-operations",fullWidth:!0,onClick:()=>P(!0),children:[o("openapi.actions.show","Show")," ",C," ",o("openapi.actions.more","more"),"..."]})]}):null}const ro=W(H),J=F(K)`
   display: flex;
   flex-direction: column;
   gap: var(--spacing-xxs);
   padding-top: var(--spacing-xxl);
-`;export{io as OperationsNavigation,F as OperationsNavigationComponent};
+`;export{ro as OperationsNavigation,H as OperationsNavigationComponent};

package/lib/components/TagItem/TagItem.js

@@ -1,59 +1,72 @@
-import{jsx as r,jsxs as t}from"react/jsx-runtime";import{memo as w,useCallback as $}from"react";import{useNavigate as y}from"react-router-dom";import{useAtomValue as z}from"jotai";import{LayoutVariant as j}from"@redocly/config";import{css as M}from"styled-components";import{Markdown as p}from"@redocly/theme/components/Markdown/Markdown";import{breakpoints as T}from"@redocly/theme/core/openapi";import{Button as C}from"@redocly/theme/components/Button/Button";import{PageActions as I}from"@redocly/theme/components/PageActions/PageActions";import{H2 as A}from"@redocly/theme/components/Typography/H2";import{LinkIcon as L}from"@redocly/theme/icons/LinkIcon/LinkIcon";import{joinWithSeparator as P}from"../../services/history/helpers.js";import{Row as W,SamplesMiddlePanel as m,SamplesPanel as f,ShareLink as B}from"../common/index.js";import{Markdown as D}from"../Markdown/index.js";import{OperationsNavigation as H}from"./OperationsNavigation.js";import{layoutAtom as N}from"../../jotai/app.js";import{useTranslate as V}from"../../hooks/index.js";import{styled as l}from"../../styled-components.js";import{StyledShareLink as _}from"../common/linkify.js";function E({item:a,routingBasePath:i="",isExpanded:d}){const v=V(),{description:o,name:s,href:S}=a,c=y(),g=z(N),e=P(i,a.href),x=$(()=>{c(e)},[c,e]),n=!!a.items.length,k=typeof o=="object"?o?.raw:o,h=g===j.STACKED,b=k?.includes?.("{% schemaDefinition");return t(K,{expanded:d,isSchema:b,isStacked:h,children:[t(W,{layout:g,children:[t(m,{fullWidth:!n,isStacked:h,children:[t(u,{expandable:n,children:[r(B,{to:S,"aria-label":`link to ${s}`}),s,r(I,{pageSlug:e})]}),r(D,{source:o})]}),n&&r(H,{items:a.items,routingBasePath:i})]}),n&&!d&&t(O,{type:"button",variant:"text",size:"medium",onClick:x,children:["+ ",v("openapi.actions.show","Show")]})]})}const da=w(E),K=l.div`
+import{jsx as t,jsxs as n}from"react/jsx-runtime";import{memo as x,useCallback as S}from"react";import{useNavigate as b}from"react-router-dom";import{useAtomValue as y}from"jotai";import{LayoutVariant as T}from"@redocly/config";import{Markdown as m}from"@redocly/theme/components/Markdown/Markdown";import{breakpoints as r}from"@redocly/theme/core/openapi";import{Button as W}from"@redocly/theme/components/Button/Button";import{PageActions as M}from"@redocly/theme/components/PageActions/PageActions";import{H2 as z}from"@redocly/theme/components/Typography/H2";import{LinkIcon as j}from"@redocly/theme/icons/LinkIcon/LinkIcon";import{joinWithSeparator as C}from"../../services/history/helpers.js";import{Row as I,SamplesMiddlePanel as f,SamplesPanel as u,ShareLink as P}from"../common/index.js";import{Markdown as A}from"../Markdown/index.js";import{OperationsNavigation as L}from"./OperationsNavigation.js";import{layoutAtom as B}from"../../jotai/app.js";import{useTranslate as H}from"../../hooks/index.js";import{styled as e}from"../../styled-components.js";import{StyledShareLink as D}from"../common/linkify.js";function N({item:a,routingBasePath:i="",isExpanded:s}){const v=H(),{description:w,name:g,href:$}=a,c=b(),h=y(B),o=C(i,a.href),k=S(()=>{c(o)},[c,o]),d=!!a.items.length,l=h===T.STACKED,p=!d;return n(V,{expanded:s,children:[n(I,{layout:h,children:[n(_,{fullWidth:p,isStacked:l,children:[n(E,{fullWidth:p,isStacked:l,children:[n(K,{children:[t(P,{to:$,"aria-label":`link to ${g}`}),g]}),t(M,{pageSlug:o})]}),t(F,{fullWidth:p,isStacked:l,children:t(A,{source:w})})]}),d&&t(L,{items:a.items,routingBasePath:i})]}),d&&!s&&n(O,{type:"button",variant:"text",size:"medium",onClick:k,children:["+ ",v("openapi.actions.show","Show")]})]})}const ma=x(N),V=e.div`
   padding-top: var(--spacing-lg);
   padding-bottom: ${({expanded:a})=>a?"var(--spacing-xxl)":""};
+`,_=e(f)`
+  @media screen and (min-width: ${r.large}) {
+    padding-left: ${({fullWidth:a,isStacked:i})=>a&&!i?"0":void 0};
+    padding-right: ${({fullWidth:a,isStacked:i})=>a&&!i?"0":void 0};
+  }
+`,E=e.div`
+  display: flex;
+  align-items: flex-start;
+  margin: var(--h2-margin-top) 0 var(--h2-margin-bottom);
+
+  @media screen and (min-width: ${r.large}) {
+    padding-left: ${({fullWidth:a,isStacked:i})=>a&&!i?"calc(var(--panel-gap-horizontal) * 2)":void 0};
+    padding-right: ${({fullWidth:a,isStacked:i})=>a&&!i?"var(--panel-gap-horizontal)":void 0};
+    width: ${({fullWidth:a,isStacked:i})=>a&&!i?"calc(100% - var(--panel-samples-width))":void 0};
 
+    ${D} {
+      left: ${({fullWidth:a,isStacked:i})=>a&&!i?"unset":void 0};
+    }
+  }
+`,F=e.div`
   /* 
     Markdoc components inside markdown that use SamplesPanel should not have padding.
     E.g. SchemaDefinition, McpTool
     padding is added by the TagItem itself
   */
-  ${p} ${f} {
-    padding-right: 0;
+  ${m} ${u} {
     padding-left: 0;
+    padding-right: 0;
   }
 
-  ${({isSchema:a,isStacked:i})=>a&&!i&&M`
-      ${m} {
-        padding-left: 0;
-        padding-right: 0;
-      }
-
-      ${p} ${m} {
-        padding-left: calc(var(--panel-gap-horizontal) * 2);
-        padding-right: var(--panel-gap-horizontal);
-      }
+  @media screen and (min-width: ${r.large}) {
+    ${m} ${f} {
+      padding-left: ${({fullWidth:a,isStacked:i})=>a&&!i?"calc(var(--panel-gap-horizontal) * 2)":void 0};
+      padding-right: ${({fullWidth:a,isStacked:i})=>a&&!i?"var(--panel-gap-horizontal)":void 0};
+    }
 
-      ${p} ${f} {
-        padding-right: calc(var(--panel-gap-horizontal) * 2);
-        padding-left: var(--panel-gap-horizontal);
-      }
+    ${m} .schema-definition ${u} {
+      padding-left: ${({fullWidth:a,isStacked:i})=>a&&!i?"var(--panel-gap-horizontal)":void 0};
+      padding-right: ${({fullWidth:a,isStacked:i})=>a&&!i?"calc(var(--panel-gap-horizontal) * 2)":void 0};
+    }
+  }
+`,K=e(z)`
+  position: relative;
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-xs);
+  flex-wrap: wrap;
+  overflow-wrap: anywhere;
+  word-break: break-word;
+  margin: 0;
 
-      ${u} {
-        padding-left: calc(var(--panel-gap-horizontal) * 2);
-        padding-right: var(--panel-gap-horizontal);
-        width: calc(100% - var(--panel-samples-width));
-        ${_} {
-          left: unset;
-        }
-      }
-    `}
-`,O=l(C)`
+  :hover {
+    ${j} {
+      opacity: 1;
+      visibility: visible;
+    }
+  }
+`,O=e(W)`
   margin: var(--spacing-md) var(--spacing-xl) var(--spacing-xxs);
   width: calc(100% - var(--spacing-xl) * 2);
 
-  @media screen and (min-width: ${T.medium}) {
+  @media screen and (min-width: ${r.medium}) {
     --button-margin-md: calc(var(--spacing-xl) * 2);
 
     margin-left: var(--button-margin-md);
     margin-right: var(--button-margin-md);
     width: calc(100% - var(--button-margin-md) * 2);
   }
-`,u=l(A)`
-  display: flex;
-  :hover {
-    ${L} {
-      opacity: 1;
-      visibility: visible;
-    }
-  }
-`;export{da as TagItem,E as TagItemComponent};
+`;export{ma as TagItem,N as TagItemComponent};

package/lib/components/ViewNested/ViewNested.js

@@ -1,4 +1,4 @@
-import{jsx as o,Fragment as l,jsxs as t}from"react/jsx-runtime";import{css as c}from"styled-components";import{memo as w,useEffect as $,useState as j}from"react";import{isUndefined as C}from"@redocly/theme/core/openapi";import{cycleColorsByLevel as N}from"../PropertyDetails/cycleColorsByLevel.js";import{CircleIcon as S}from"../PropertyDetails/PlusCircleIcon.js";import{LabelValue as V}from"../common/styled.js";import{styled as d}from"../../styled-components.js";function _({expandByDefault:e,level:g,expandable:h=!1,expandText:v,hideText:x,hideDivider:y=!1,children:i,expandedAll:a,isNestedArray:n}){const[r,p]=j((e||n)??!1);$(()=>{C(a)||p(a)},[a]);const s=r?N(g):void 0;if(!h)return i;const b=()=>{p(u=>!u)};return n?t(l,{children:[o(V,{children:"Array ["}),o(f,{$isArrayInsideArray:n,className:"view-nested-wrapper",children:o(m,{color:s,children:i})})]}):o(l,{children:t(f,{$divider:!y&&!r,className:"view-nested-wrapper",children:[t(k,{onClick:b,children:[o(S,{sign:r?"-":"+",color:s}),!r&&v,r&&(x||"")]}),r&&o(m,{color:s,children:i})]})})}const U=w(_),k=d.button`
+import{jsx as o,Fragment as l,jsxs as s}from"react/jsx-runtime";import{css as d}from"styled-components";import{memo as w,useEffect as $,useState as j}from"react";import{isUndefined as C}from"@redocly/theme/core/openapi";import{cycleColorsByLevel as N}from"../PropertyDetails/cycleColorsByLevel.js";import{CircleIcon as S}from"../PropertyDetails/PlusCircleIcon.js";import{LabelValue as V}from"../common/styled.js";import{styled as c}from"../../styled-components.js";function _({expandByDefault:e,level:g,expandable:h=!1,expandText:v,hideText:x,hideDivider:y=!1,children:i,expandedAll:t,isNestedArray:n}){const[r,p]=j((e||n)??!1);$(()=>{C(t)||p(t)},[t]);const a=r?N(g):void 0;if(!h)return i;const b=()=>{p(u=>!u)};return n?s(l,{children:[o(V,{children:"Array ["}),o(f,{$isArrayInsideArray:n,className:"view-nested-wrapper",children:o(m,{color:a,children:i})})]}):o(l,{children:s(f,{$divider:!y&&!r,className:"view-nested-wrapper",children:[s(k,{onClick:b,children:[o(S,{sign:r?"-":"+",color:a}),!r&&v,r&&(x||"")]}),r&&o(m,{color:a,children:i})]})})}const U=w(_),k=c.button`
   background: none;
   border: none;
   cursor: pointer;
@@ -10,24 +10,24 @@ import{jsx as o,Fragment as l,jsxs as t}from"react/jsx-runtime";import{css as c}
   font-size: var(--font-size-base);
   font-family: var(--font-family-base);
   line-height: var(--line-height-base);
-  margin: var(--spacing-xxs) 0 var(--spacing-xs);
+  margin-top: var(--spacing-xxs);
   width: 100%;
-`,m=d.div`
+`,m=c.div`
   padding-left: var(--schema-nested-offset);
   border-left: 1px solid ${({color:e})=>e||"var(--border-color-primary)"};
   margin: -10px 0 0 9px;
-  ${({color:e})=>e&&c`
+  ${({color:e})=>e&&d`
       .schema-name {
         color: ${e};
       }
     `}
-`,f=d.div`
+`,f=c.div`
   width: 100%;
-  ${({$isArrayInsideArray:e})=>e&&c`
+  ${({$isArrayInsideArray:e})=>e&&d`
       padding-top: var(--schema-property-details-spacing);
     `}
 
-  ${({$divider:e})=>e&&c`
+  ${({$divider:e})=>e&&d`
       border-bottom: 1px solid var(--border-color-primary);
       padding-bottom: var(--schema-property-details-spacing);
     `}

package/lib/components/common/BodyContent/BodyContent.d.ts

@@ -6,6 +6,8 @@ interface BodyContentProps {
     description?: string | GenericObject;
     content?: MediaContentModel;
     deepLink?: string;
+    isRpc?: boolean;
+    title?: string;
 }
 export declare const BodyContent: import("react").NamedExoticComponent<BodyContentProps>;
 export {};