@redocly/openapi-docs 3.12.0 → 3.13.0-next.0

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

@@ -6,7 +6,8 @@ export interface DropdownProps<T> {
     className?: string;
     triggerVariant?: 'ghost' | 'outlined';
     triggerSize?: string;
+    withSearch?: boolean;
 }
-declare function DropdownComponent<T>({ options, value, onChange, className, triggerVariant, triggerSize, }: DropdownProps<T>): import("react/jsx-runtime").JSX.Element;
+declare function DropdownComponent<T>({ options, value, onChange, className, triggerVariant, triggerSize, withSearch, }: DropdownProps<T>): import("react/jsx-runtime").JSX.Element;
 export declare const Dropdown: typeof DropdownComponent;
 export {};

package/lib/components/common/Dropdown/Dropdown.js

@@ -1,8 +1,8 @@
-import{jsx as n}from"react/jsx-runtime";import{Dropdown as d}from"@redocly/theme/components/Dropdown/Dropdown";import{CheckmarkIcon as c}from"@redocly/theme/icons/CheckmarkIcon/CheckmarkIcon";import{DropdownMenu as p}from"@redocly/theme/components/Dropdown/DropdownMenu";import{DropdownMenuItem as f}from"@redocly/theme/components/Dropdown/DropdownMenuItem";import{Button as g}from"@redocly/theme/components/Button/Button";import{typedMemo as h}from"@redocly/theme/core/openapi";import{styled as o}from"../../../styled-components.js";function u({options:r,value:t,onChange:a,className:l,triggerVariant:m="outlined",triggerSize:s="small"}){const i=r.find(e=>e.value===t)?.label;return r.length===1?n(b,{children:i}):n(d,{className:l,trigger:n(g,{variant:m,size:s,type:"button",children:i}),withArrow:!0,children:n(p,{children:r.map(e=>n(w,{active:e.value===t,onAction:()=>a(e),suffix:e.value===t&&n(v,{}),children:e.label},e.label))})})}const C=h(u),v=o(c)`
+import{jsx as r,Fragment as p,jsxs as w}from"react/jsx-runtime";import{useMemo as y,useState as S}from"react";import{Dropdown as k}from"@redocly/theme/components/Dropdown/Dropdown";import{CheckmarkIcon as C}from"@redocly/theme/icons/CheckmarkIcon/CheckmarkIcon";import{DropdownMenu as D}from"@redocly/theme/components/Dropdown/DropdownMenu";import{DropdownMenuItem as I}from"@redocly/theme/components/Dropdown/DropdownMenuItem";import{Button as j}from"@redocly/theme/components/Button/Button";import{SearchIcon as z}from"@redocly/theme/icons/SearchIcon/SearchIcon";import{typedMemo as M}from"@redocly/theme/core/openapi";import{styled as n}from"../../../styled-components.js";import{useTranslate as N}from"../../../hooks/index.js";function A({options:o,value:t,onChange:l,className:f,triggerVariant:g="outlined",triggerSize:u="small",withSearch:v=!1}){const[i,s]=S(""),c=N(),d=o.find(e=>e.value===t)?.label,h=y(()=>o.filter(e=>e.label?.toLowerCase().includes(i.toLowerCase())??!1),[o,i]);if(o.length===1)return r(R,{children:d});const x=e=>{s(e.target.value)},b=()=>v?w(p,{children:[r(L,{prefix:r(_,{children:r(z,{color:"var(--icon-color-additional)",onClick:e=>e.stopPropagation()})}),content:r(F,{placeholder:c("openapi.discriminator.searchPlaceholder","Search items"),onClick:e=>e.stopPropagation(),onChange:x,value:i})}),r(T,{children:h.length?h.map(e=>r(a,{active:e.value===t,onAction:()=>l(e),suffix:e.value===t&&r(m,{}),children:e.label},e.label)):r(P,{content:c("openapi.discriminator.searchNoResults","No items found")})})]}):r(p,{children:o.map(e=>r(a,{active:e.value===t,onAction:()=>l(e),suffix:e.value===t&&r(m,{}),children:e.label},e.label))});return r(k,{className:f,trigger:r(j,{variant:g,size:u,type:"button",children:d}),withArrow:!0,onClose:()=>s(""),children:r(D,{children:b()})})}const U=M(A),m=n(C)`
   width: 16px;
   height: 16px;
   margin-left: auto;
-`,w=o(f)`
+`,a=n(I)`
   --dropdown-menu-item-justify-content: space-between;
 
   width: 100%;
@@ -12,7 +12,46 @@ import{jsx as n}from"react/jsx-runtime";import{Dropdown as d}from"@redocly/theme
   padding: var(--spacing-xxs) var(--spacing-sm);
   font-size: var(--font-size-base);
   line-height: var(--line-height-base);
-`,b=o.span`
+`,L=n(a)`
+  gap: 0;
+  padding: var(--spacing-xxs) var(--spacing-xs);
+  &:hover {
+    background-color: transparent;
+  }
+`,P=n(a)`
+  height: 66px;
+  justify-content: center;
+  &:hover,
+  &:focus-visible {
+    background-color: transparent;
+  }
+`,T=n.div`
+  overflow-y: auto;
+  max-height: 300px;
+`,_=n.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  cursor: pointer;
+  flex-shrink: 0;
+`,F=n.input`
+  width: 100%;
+  border: none;
+  outline: none;
+  background: transparent;
+  color: var(--text-color-primary);
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-base);
+  font-family: var(--font-family-base);
+  padding: 0;
+  margin-left: var(--spacing-xxs);
+
+  &::placeholder {
+    color: var(--search-trigger-color);
+  }
+`,R=n.span`
   margin-right: var(--spacing-unit);
   cursor: default;
   background: none;
@@ -23,4 +62,4 @@ import{jsx as n}from"react/jsx-runtime";import{Dropdown as d}from"@redocly/theme
   line-height: var(--line-height-lg);
   font-family: var(--font-family-base);
   font-weight: var(--font-weight-regular);
-`;export{C as Dropdown};
+`;export{U as Dropdown};

package/lib/components/common/SchemaSelection/SchemaSelection.js

@@ -1 +1 @@
-import{jsx as m}from"react/jsx-runtime";import{useCallback as E,useEffect as I,useRef as T,useState as g}from"react";import{useAtom as h}from"jotai";import{Segmented as w}from"@redocly/theme/components/Segmented/Segmented";import{isUndefined as x}from"@redocly/theme/core/openapi";import{Dropdown as y}from"../Dropdown/index.js";import{operationStore as A}from"../../../jotai/operation.js";const b=5;function z({options:t,onChange:r,pointer:u,schema:n,defaultOneOfIdx:d}){const[p,c]=h(A(u)),S=p.activeOneOf[n.pointer]??d,o=t[S]?.value,[i,O]=g(!1),s=T(null);I(()=>{if(!s.current)return;const e=()=>{const v=s.current?.querySelectorAll('button[role="tab"]'),a=Array.from(v||[]).some(l=>l.offsetWidth<l.scrollWidth);a!==i&&O(a)};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[i,t]);const f=E(({value:e})=>{e!==void 0&&(r?r(e):c({activeExampleName:n.oneOf?.[e]?.title,activeOneOf:{[n.pointer]:e},requestValues:{body:null}}))},[r,n.oneOf,n.pointer,c]);return x(o)?null:t.length>b||i?m(y,{options:t,value:o,onChange:f}):m(w,{ref:s,value:o,onChange:f,options:t,size:"small","data-testid":"segmented-schema"})}const D=z;export{D as SchemaSelection};
+import{jsx as m}from"react/jsx-runtime";import{useCallback as h,useEffect as v,useRef as A,useState as T}from"react";import{useAtom as g}from"jotai";import{Segmented as w}from"@redocly/theme/components/Segmented/Segmented";import{isUndefined as I}from"@redocly/theme/core/openapi";import{Dropdown as x}from"../Dropdown/index.js";import{operationStore as y}from"../../../jotai/operation.js";const L=5,R=7;function _({options:t,onChange:r,pointer:u,schema:n,defaultOneOfIdx:d}){const[S,c]=g(y(u)),p=S.activeOneOf[n.pointer]??d,o=t[p]?.value,[i,E]=T(!1),s=A(null);v(()=>{if(!s.current)return;const e=()=>{const O=s.current?.querySelectorAll('button[role="tab"]'),a=Array.from(O||[]).some(l=>l.offsetWidth<l.scrollWidth);a!==i&&E(a)};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[i,t]);const f=h(({value:e})=>{e!==void 0&&(r?r(e):c({activeExampleName:n.oneOf?.[e]?.title,activeOneOf:{[n.pointer]:e},requestValues:{body:null}}))},[r,n.oneOf,n.pointer,c]);return I(o)?null:t.length>L||i?m(x,{options:t,value:o,withSearch:t.length>=R,onChange:f}):m(w,{ref:s,value:o,onChange:f,options:t,size:"small","data-testid":"segmented-schema"})}const k=_;export{k as SchemaSelection};

package/lib/models/operation.js

@@ -1 +1 @@
-import{REDOCLY_TEAMS_RBAC as y}from"@redocly/config";import{removeLeadingSlash as b}from"@redocly/theme/core/openapi";import{configure as v}from"@redocly/theme/ext/configure";import{extractExtensions as x,getOperationId as R,getOperationName as q,getStatusCodeType as P,getValueFromMdParsedExtension as B,isStatusCode as E,JsonPointer as C,mergeParams as k,normalizeServers as o,sortByDeprecated as V,sortByRequired as I,updateOperationWithRequestValues as O,updateParametersWithUserValues as N}from"../utils/index.js";import{getCallback as W}from"./callback.js";import{getField as w}from"./field.js";import{getRequestBody as A}from"./request.js";import{getSecurity as S}from"./security.js";import{getResponse as F}from"./response.js";import{getHref as M}from"../services/menu/operation.js";function Z(s){return s.lang==="Payload"&&"requestBodyContent"in s}function $(s,e,t,a,m,d,c){const h=e.isWebhook,r={operationDefinition:e,parent:t,pointer:e.pointer,description:B(e,"description"),externalDocs:e.externalDocs,deprecated:!!e.deprecated,httpVerb:e.httpVerb,operationId:e.operationId,path:e.pathName,isWebhook:h,isCallback:!!d?.isCallback,isEvent:d?.isCallback||h,name:q(e),defaultExampleName:e.defaultSampleName,[y]:e[y]||t?.[y],type:"operation",callbackId:d?.id,href:m,get callbacks(){return Object.keys(e.callbacks||[]).map(u=>W(s,u,e.callbacks?.[u],r.pointer,a,m,t,c))},get responses(){let u=!1;return Object.keys(e.responses||[]).filter(l=>l==="default"?!0:(P(l)==="success"&&(u=!0),E(l))).map(l=>F({parser:s,code:l,defaultAsError:u,infoOrRef:e.responses[l],options:a,isEvent:r.isEvent,operation:r}))},get parameters(){return j(s,e,r,a,g)}};if(d?.isCallback)r.security=S(e.security,s),r.servers=o("",e.servers||e.pathServers||[]),r.id=b(m);else{r.id=R(e,t),r.href=r.href||M(r),r.security=S(e.security||s.definition.security,s);const u=e.servers||(e.pathServers?.length?e.pathServers:null)||s.definition.servers||[];r.servers=o(s.definitionUrl,L(u,a.mockServer))}a.showExtensions&&(r.extensions=x(e,a.showExtensions)),r.requestBody=e.requestBody?A({parser:s,infoOrRef:e.requestBody,options:a,operation:r,isEvent:r.isEvent}):void 0;const p=r.requestBody?.content;r.payload={lang:"Payload",source:"",requestBodyContent:p?.hasSample?p:void 0},r.definitionSamples=e["x-codeSamples"]||[],r.badges=e["x-badges"]?.map(({name:u,color:l,position:n})=>({name:u,color:l||"var(--color-info-base)",position:n||"after"}))||[],r.hasSamples=p?.hasSample||r.definitionSamples.length>0,r.hideReplay=e["x-hideReplay"]===!0;const f={userClaims:c,operation:{operationId:r.operationId,name:r.name,path:r.path,href:r.href,method:r.httpVerb},servers:r.servers},g=(v(f)||{}).requestValues||{};return O(r,g),r}function j(s,e,t,a,m){let d=k(s,e.pathParameters,e.parameters,{pathPointer:C.dirName(t.pointer),operationPointer:t.pointer}).map(({paramOrRef:c,pointer:h})=>{const r=w(s,c,h,a,{operation:t,type:"request"});return N(r,m),r});return a.sortRequiredPropsFirst&&(d=I(d)),V(d)}function L(s,e){if(!e)return s;const t={url:e.url,description:e.description};switch(e.position){case"first":return[t,...s];case"last":return[...s,t];case"replace":return[t];default:return s}}export{$ as getOperation,Z as isPayloadSample,L as mergeInMockServer};
+import{REDOCLY_TEAMS_RBAC as y}from"@redocly/config";import{removeLeadingSlash as b}from"@redocly/theme/core/openapi";import{configure as v}from"@redocly/theme/ext/configure";import{extractExtensions as x,getOperationId as R,getOperationName as q,getStatusCodeType as P,getValueFromMdParsedExtension as B,isStatusCode as E,JsonPointer as C,mergeParams as k,normalizeServers as o,sortByDeprecated as V,sortByRequired as I,updateOperationWithRequestValues as O,updateParametersWithUserValues as N}from"../utils/index.js";import{getCallback as W}from"./callback.js";import{getField as w}from"./field.js";import{getRequestBody as A}from"./request.js";import{getSecurity as f}from"./security.js";import{getResponse as F}from"./response.js";import{getHref as M}from"../services/menu/operation.js";function Z(s){return s.lang==="Payload"&&"requestBodyContent"in s}function $(s,e,t,a,m,d,c){const h=e.isWebhook,r={operationDefinition:e,parent:t,pointer:e.pointer,description:B(e,"description"),externalDocs:e.externalDocs,deprecated:!!e.deprecated,httpVerb:e.httpVerb,operationId:e.operationId,path:e.pathName,isWebhook:h,isCallback:!!d?.isCallback,isEvent:d?.isCallback||h,name:q(e),defaultExampleName:e.defaultSampleName,[y]:e[y]||t?.[y],type:"operation",callbackId:d?.id,href:m,get callbacks(){return Object.keys(e.callbacks||[]).map(u=>W(s,u,e.callbacks?.[u],r.pointer,a,m,t,c))},get responses(){let u=!1;return Object.keys(e.responses||[]).filter(l=>l==="default"?!0:(P(l)==="success"&&(u=!0),E(l))).map(l=>F({parser:s,code:l,defaultAsError:u,infoOrRef:e.responses[l],options:a,isEvent:r.isEvent,operation:r}))},get parameters(){return j(s,e,r,a,g)}};if(d?.isCallback)r.security=f(e.security,s),r.servers=o("",e.servers||e.pathServers||[]),r.id=b(m);else{r.id=R(e,t),r.href=r.href||M(r),r.security=f(e.security||s.definition.security,s);const u=e.servers||(e.pathServers?.length?e.pathServers:null)||s.definition.servers||[];r.servers=o(s.definitionUrl,L(u,a.mockServer))}a.showExtensions&&(r.extensions=x(e,a.showExtensions)),r.requestBody=e.requestBody?A({parser:s,infoOrRef:e.requestBody,options:a,operation:r,isEvent:r.isEvent}):void 0;const p=r.requestBody?.content;r.payload={lang:"Payload",source:"",requestBodyContent:p?.hasSample?p:void 0},r.definitionSamples=e["x-codeSamples"]||[],r.badges=e["x-badges"]?.map(({name:u,color:l,position:S})=>({name:u,color:l||"var(--color-info-base)",position:S||"after"}))||[],r.hasSamples=p?.hasSample||r.definitionSamples.length>0,r.hideReplay=e["x-hideReplay"]===!0;const n={userClaims:c,info:s.definition.info||{},operation:{operationId:r.operationId,name:r.name,path:r.path,href:r.href,method:r.httpVerb},servers:r.servers},g=(v(n)||{}).requestValues||{};return O(r,g),r}function j(s,e,t,a,m){let d=k(s,e.pathParameters,e.parameters,{pathPointer:C.dirName(t.pointer),operationPointer:t.pointer}).map(({paramOrRef:c,pointer:h})=>{const r=w(s,c,h,a,{operation:t,type:"request"});return N(r,m),r});return a.sortRequiredPropsFirst&&(d=I(d)),V(d)}function L(s,e){if(!e)return s;const t={url:e.url,description:e.description};switch(e.position){case"first":return[t,...s];case"last":return[...s,t];case"replace":return[t];default:return s}}export{$ as getOperation,Z as isPayloadSample,L as mergeInMockServer};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@redocly/openapi-docs",
-  "version": "3.12.0",
+  "version": "3.13.0-next.0",
   "description": "Redocly OpenAPI Docs",
   "type": "module",
   "main": "lib/index.js",
@@ -14,7 +14,7 @@
     "npm": ">=10.0.0"
   },
   "peerDependencies": {
-    "@redocly/theme": ">=0.56.0-next.0",
+    "@redocly/theme": ">=0.57.0-next.0",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "styled-components": "^4.1.1 || ^5.3.11 || ^6.0.0"
@@ -36,8 +36,8 @@
     "url-template": "^2.0.8",
     "util": "~0.12.5",
     "web-vitals": "3.3.1",
-    "@redocly/replay": "0.15.0",
-    "@redocly/config": "0.28.0"
+    "@redocly/config": "0.28.0",
+    "@redocly/replay": "0.16.0-next.0"
   },
   "devDependencies": {
     "@jest/globals": "29.5.0",
@@ -74,7 +74,7 @@
     "typescript": "5.6.2",
     "url": "~0.11.0",
     "vite": "^6.3.5",
-    "@redocly/theme": "0.56.0"
+    "@redocly/theme": "0.57.0-next.0"
   },
   "scripts": {
     "start": "npm run copy-highlight-hook && vite",