@redocly/openapi-docs 0.0.0-react18-20231120182601

package/lib/components/common/LinearProgress.js

@@ -0,0 +1,104 @@
+"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.LinearProgress=void 0;const react_1=__importDefault(require("react")),styled_components_1=__importDefault(require("styled-components")),LoadingLine=styled_components_1.default.div`
+  position: relative;
+  height: 4px;
+  display: block;
+  width: 100%;
+  background-color: var(--linear-progress-background-color);
+  border-radius: var(--border-radius);
+  background-clip: padding-box;
+  margin: 0.5rem 0 1rem 0;
+  overflow: hidden;
+
+  .determinate {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    background-color: var(--linear-progress-color);
+    transition: width 0.3s linear;
+  }
+  .indeterminate {
+    background-color: var(--linear-progress-color);
+  }
+  .indeterminate:before {
+    content: '';
+    position: absolute;
+    background-color: inherit;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    will-change: left, right;
+    -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
+    animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
+  }
+  .indeterminate:after {
+    content: '';
+    position: absolute;
+    background-color: inherit;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    will-change: left, right;
+    -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
+    animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
+    -webkit-animation-delay: 1.15s;
+    animation-delay: 1.15s;
+  }
+
+  @-webkit-keyframes indeterminate {
+    0% {
+      left: -35%;
+      right: 100%;
+    }
+    60% {
+      left: 100%;
+      right: -90%;
+    }
+    100% {
+      left: 100%;
+      right: -90%;
+    }
+  }
+  @keyframes indeterminate {
+    0% {
+      left: -35%;
+      right: 100%;
+    }
+    60% {
+      left: 100%;
+      right: -90%;
+    }
+    100% {
+      left: 100%;
+      right: -90%;
+    }
+  }
+  @-webkit-keyframes indeterminate-short {
+    0% {
+      left: -200%;
+      right: 100%;
+    }
+    60% {
+      left: 107%;
+      right: -8%;
+    }
+    100% {
+      left: 107%;
+      right: -8%;
+    }
+  }
+  @keyframes indeterminate-short {
+    0% {
+      left: -200%;
+      right: 100%;
+    }
+    60% {
+      left: 107%;
+      right: -8%;
+    }
+    100% {
+      left: 107%;
+      right: -8%;
+    }
+  }
+`,LinearProgress=()=>react_1.default.createElement(LoadingLine,null,react_1.default.createElement("div",{className:"indeterminate"}));exports.LinearProgress=LinearProgress;
+//# sourceMappingURL=LinearProgress.js.map

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

@@ -0,0 +1,19 @@
+import type { Location } from 'react-router-dom';
+import type { PropsWithChildren } from 'react';
+import type { FieldModel } from '../../models';
+import { Pagination } from '../../services';
+import { ShareLink } from './linkify';
+interface LinkToFieldProps {
+    className?: string;
+    to?: string;
+    location: Location;
+}
+export declare function generateDeepLink(field: FieldModel, options: {
+    pagination: Pagination;
+    deepLinkPrefix: string;
+}): string;
+export declare const LinkToField: (props: PropsWithChildren<LinkToFieldProps>) => JSX.Element;
+export declare const ShareLinkToField: import("styled-components").StyledComponent<typeof ShareLink, any, {
+    isActive: boolean;
+}, never>;
+export {};

package/lib/components/common/LinkToField.js

@@ -0,0 +1,14 @@
+"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.ShareLinkToField=exports.LinkToField=exports.generateDeepLink=void 0;const styled_components_1=__importDefault(require("styled-components")),react_1=__importDefault(require("react")),theme_1=require("@redocly/theme"),services_1=require("../../services"),helpers_1=require("../../services/history/helpers"),utils_1=require("../../utils"),linkify_1=require("./linkify");function generateDeepLink(e,i){const t=e.deps.operation,r=(0,helpers_1.constructFieldDeepFragment)(e);if(!(null==t?void 0:t.id)&&!t.isCallback)return"#"+r;let n=i.pagination===services_1.Pagination.Item?"#":t.href;return(0,services_1.joinWithSeparator)(n,r,i.deepLinkPrefix)}exports.generateDeepLink=generateDeepLink;const LinkToField=e=>{const i=e.to;return react_1.default.createElement(exports.ShareLinkToField,{className:e.className,isActive:!(!(null==e?void 0:e.location)||!(0,utils_1.pathMatchedLink)(e.location,i)),to:i,id:null==i?void 0:i.split("#")[1]})};exports.LinkToField=LinkToField,exports.ShareLinkToField=(0,styled_components_1.default)(linkify_1.ShareLink)`
+  left: 10px;
+  display: flex;
+  ${({isActive:e})=>e&&`\n    ${theme_1.AnchorIcon} {\n      visibility: visible;\n    }\n  `}
+  :hover ${theme_1.AnchorIcon}, :focus ${theme_1.AnchorIcon} {
+    visibility: visible;
+  }
+
+  ${theme_1.AnchorIcon} {
+    width: 13px;
+    height: 13px;
+  }
+`;
+//# sourceMappingURL=LinkToField.js.map

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { PropsWithChildren } from 'react';
+interface PortalProps {
+    mountId?: string;
+}
+export declare const Portal: ({ children, mountId }: PropsWithChildren<PortalProps>) => React.JSX.Element;
+export {};

package/lib/components/common/Portal/Portal.js

@@ -0,0 +1,2 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var i=Object.getOwnPropertyDescriptor(t,r);i&&!("get"in i?!t.__esModule:i.writable||i.configurable)||(i={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,i)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&__createBinding(t,e,r);return __setModuleDefault(t,e),t};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Portal=void 0;const react_1=__importStar(require("react")),react_dom_1=require("react-dom"),utils_1=require("../../../utils"),container=utils_1.IS_BROWSER?document.createElement("div"):null,Portal=({children:e,mountId:t="api-content"})=>{const r=utils_1.IS_BROWSER?document.getElementById(t):null;return(0,react_1.useEffect)((()=>{if(r&&container)return r.appendChild(container),()=>{r.removeChild(container)}}),[r]),r&&container?(0,react_dom_1.createPortal)(e,container):react_1.default.createElement(react_1.default.Fragment,null,e)};exports.Portal=Portal;
+//# sourceMappingURL=Portal.js.map

package/lib/components/common/Portal/index.d.ts

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

package/lib/components/common/Portal/index.js

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

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function Skeleton(): JSX.Element;

package/lib/components/common/Skeleton/Skeleton.js

@@ -0,0 +1,31 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var l=Object.getOwnPropertyDescriptor(t,r);l&&!("get"in l?!t.__esModule:l.writable||l.configurable)||(l={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,l)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&__createBinding(t,e,r);return __setModuleDefault(t,e),t},__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Skeleton=void 0;const react_1=__importDefault(require("react")),styled_components_1=__importStar(require("styled-components")),theme_1=require("@redocly/theme"),panels_1=require("../panels"),shimmer=styled_components_1.keyframes`
+  100% {
+      transform: translateX(100%);
+  }
+`,SkeletonBox=styled_components_1.default.div`
+  display: inline-block;
+  height: 1em;
+  position: relative;
+  overflow: hidden;
+  background-color: #eeeeee;
+  border-radius: var(--global-border-radius);
+
+  &::after {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    transform: translateX(-100%);
+    background-image: linear-gradient(
+      90deg,
+      rgba(255, 255, 255, 0) 0,
+      rgba(255, 255, 255, 0.2) 20%,
+      rgba(255, 255, 255, 0.5) 60%,
+      rgba(255, 255, 255, 0)
+    );
+    animation: ${shimmer} 2s infinite;
+    content: '';
+  }
+`;function Skeleton(){return react_1.default.createElement(panels_1.Section,null,react_1.default.createElement(panels_1.SamplesMiddlePanel,null,react_1.default.createElement(theme_1.H2,null,react_1.default.createElement(SkeletonBox,{style:{width:"40%"}})),react_1.default.createElement(SkeletonBox,{style:{width:"80%"}}),react_1.default.createElement(SkeletonBox,{style:{width:"90%"}}),react_1.default.createElement(SkeletonBox,{style:{width:"83%"}}),react_1.default.createElement(SkeletonBox,{style:{width:"80%"}})))}exports.Skeleton=Skeleton;
+//# sourceMappingURL=Skeleton.js.map

package/lib/components/common/Skeleton/index.d.ts

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

package/lib/components/common/Skeleton/index.js

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

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

@@ -0,0 +1,35 @@
+import React from 'react';
+import type { UseControllerProps } from 'react-hook-form/dist/types/controller';
+import type { FlattenInterpolation, ThemeProps } from 'styled-components';
+import type { DropdownOption, DropdownProps } from './Dropdown';
+export declare const getInvertedInputStyles: (panelType: 'samples' | 'try-it') => FlattenInterpolation<ThemeProps<unknown>>;
+export declare const StyledInput: import("styled-components").StyledComponent<"input", any, {
+    fullWidth?: boolean | undefined;
+    inputType?: string | undefined;
+    inputActionButton?: InputActionButtonProps | undefined;
+    panel: 'samples' | 'try-it';
+}, never>;
+export interface InputActionButtonProps {
+    label: string;
+    onClick: React.EventHandler<React.SyntheticEvent>;
+}
+export interface TextFieldExtraProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    fullWidth?: boolean;
+    errorMessage?: string;
+    inputActionButton?: InputActionButtonProps;
+    panel?: 'samples' | 'try-it';
+}
+export declare const TextField: React.ForwardRefExoticComponent<TextFieldExtraProps & React.RefAttributes<HTMLInputElement>>;
+type FormFieldProps = {
+    fieldName: string;
+    defaultValue?: string;
+    rules?: UseControllerProps['rules'];
+    validateOnBlur?: boolean;
+    validateOnChange?: boolean;
+};
+export declare function FormTextField({ id, fieldName, defaultValue, rules, validateOnBlur, validateOnChange, ...rest }: TextFieldExtraProps & FormFieldProps): JSX.Element;
+export interface FormDropdownProps extends Partial<DropdownProps>, FormFieldProps {
+    options: DropdownOption[];
+}
+export declare const FormDropdown: React.NamedExoticComponent<FormDropdownProps>;
+export {};

package/lib/components/common/TextField.js

@@ -0,0 +1,50 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,r,o){void 0===o&&(o=r);var n=Object.getOwnPropertyDescriptor(t,r);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,o,n)}:function(e,t,r,o){void 0===o&&(o=r),e[o]=t[r]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&__createBinding(t,e,r);return __setModuleDefault(t,e),t},__rest=this&&this.__rest||function(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++)t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(r[o[n]]=e[o[n]])}return r};Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormDropdown=exports.FormTextField=exports.TextField=exports.StyledInput=exports.getInvertedInputStyles=void 0;const styled_components_1=__importStar(require("styled-components")),react_1=__importStar(require("react")),react_hook_form_1=require("react-hook-form"),form_1=require("./form"),Dropdown_1=require("./Dropdown"),utils_1=require("../../utils"),getInvertedInputStyles=e=>styled_components_1.css`
+  border: var(--input-border);
+  outline: none;
+  padding: var(--input-padding);
+  border-radius: var(--input-border-radius);
+  background-color: var(--panel-${e}-input-background-color);
+  color: var(--input-text-color);
+  font-family: var(--input-font-family);
+  font-size: var(--input-font-size);
+  line-height: var(--input-line-height);
+
+  &::placeholder {
+    opacity: 0.6;
+    color: var(--input-placeholder-text-color);
+  }
+
+  &:hover {
+    color: var(--input-hover-text-color);
+    border: var(--input-hover-border);
+  }
+
+  &:focus {
+    color: var(--input-focus-text-color);
+    border: var(--input-focus-border);
+  }
+
+  &:-webkit-autofill {
+    background-color: var(--panel-${e}-input-background-color);
+  }
+`;exports.getInvertedInputStyles=getInvertedInputStyles;const TextFieldWrapper=styled_components_1.default.div`
+  display: ${({type:e})=>"hidden"===e?"none":"inline-block"};
+  ${({fullWidth:e})=>e?"width: 100%;":""}
+`,InputWrap=styled_components_1.default.div`
+  position: relative;
+`;exports.StyledInput=styled_components_1.default.input`
+  ${({panel:e})=>(0,exports.getInvertedInputStyles)(e)}
+  ${({inputType:e,inputActionButton:t})=>"password"===e||t?"padding-right: 40px;":""};
+  ${({fullWidth:e})=>e?"width: 100%;":""}
+`;const InputActionButton=styled_components_1.default.span`
+  position: absolute;
+  right: 0;
+  line-height: normal;
+
+  font-size: 0.8em;
+  padding: calc(8px / 0.8);
+  cursor: pointer;
+  text-align: center;
+  color: var(--panel-samples-text-color);
+`;function TextFieldComponent(e,t){var{fullWidth:r,errorMessage:o,type:n,inputActionButton:l,panel:a="samples"}=e,i=__rest(e,["fullWidth","errorMessage","type","inputActionButton","panel"]);const[u,d]=(0,react_1.useState)("password"===n);return react_1.default.createElement(TextFieldWrapper,{fullWidth:r,type:n},react_1.default.createElement(InputWrap,null,react_1.default.createElement(exports.StyledInput,Object.assign({fullWidth:r,inputActionButton:l,type:u?"password":"text",inputType:n,ref:t,panel:a},i)),l?react_1.default.createElement(InputActionButton,{onClick:l.onClick},l.label):"password"===n?react_1.default.createElement(InputActionButton,{onClick:()=>{d(!u)}},u?"show":"hide"):null),o?react_1.default.createElement(form_1.FormError,null,o):null)}function FormTextField(e){var{id:t,fieldName:r,defaultValue:o="",rules:n,validateOnBlur:l,validateOnChange:a}=e,i=__rest(e,["id","fieldName","defaultValue","rules","validateOnBlur","validateOnChange"]);const{setValue:u,getFieldState:d,control:p,trigger:c}=(0,react_hook_form_1.useFormContext)(),s=e=>{u(r,e.target.value),a&&c(r)},f=()=>{l&&c(r)},{error:_}=d(r);return react_1.default.createElement(react_hook_form_1.Controller,{control:p,name:r,defaultValue:o,rules:n,render:({field:{value:e=""}})=>react_1.default.createElement(exports.TextField,Object.assign({},i,{id:t||r,name:r,value:(0,utils_1.isNull)(e)?"":e,onChange:s,onBlur:f,errorMessage:null==_?void 0:_.message}))})}exports.TextField=(0,react_1.forwardRef)(TextFieldComponent),exports.FormTextField=FormTextField;const FormDropdownComponent=({fieldName:e,options:t,defaultValue:r,rules:o,validateOnChange:n})=>{const{setValue:l,getFieldState:a,control:i,trigger:u}=(0,react_hook_form_1.useFormContext)(),d=t.map(((e,t)=>({value:e.title||e.value,idx:t,origValue:e.value}))),p=(0,react_1.useCallback)((t=>{l(e,d[t.idx].origValue),n&&u(e)}),[e,d,l,u,n]),{error:c}=a(e);return react_1.default.createElement(TextFieldWrapper,{fullWidth:!0},react_1.default.createElement(react_hook_form_1.Controller,{control:i,name:e,defaultValue:r,rules:o,render:({field:{value:e}})=>{var t;const r=null===(t=d.find((t=>t.origValue===e)))||void 0===t?void 0:t.value;return react_1.default.createElement(Dropdown_1.Dropdown,{fullWidth:!0,variant:"dark",value:r,options:d,onChange:p})}}),c?react_1.default.createElement(form_1.FormError,null,c.message):null)};exports.FormDropdown=(0,react_1.memo)(FormDropdownComponent);
+//# sourceMappingURL=TextField.js.map

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

@@ -0,0 +1,17 @@
+export declare const Table: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const GroupLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const FormControl: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const FormWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const FormLabel: import("styled-components").StyledComponent<"label", any, {
+    required?: boolean | undefined;
+}, never>;
+export declare const FormError: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const FormWarning: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TokenField: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TokenValue: import("styled-components").StyledComponent<"code", any, {
+    masked?: boolean | undefined;
+    length: number;
+}, never>;
+export declare const TokenShowHide: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const TokenClear: import("styled-components").StyledComponent<"span", any, {}, never>;
+export declare const FormHeader: import("styled-components").StyledComponent<"div", any, {}, never>;

package/lib/components/common/form.js

@@ -0,0 +1,64 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,o,t,r){void 0===r&&(r=t);var n=Object.getOwnPropertyDescriptor(o,t);n&&!("get"in n?!o.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return o[t]}}),Object.defineProperty(e,r,n)}:function(e,o,t,r){void 0===r&&(r=t),e[r]=o[t]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,o){Object.defineProperty(e,"default",{enumerable:!0,value:o})}:function(e,o){e.default=o}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var o={};if(null!=e)for(var t in e)"default"!==t&&Object.prototype.hasOwnProperty.call(e,t)&&__createBinding(o,e,t);return __setModuleDefault(o,e),o};Object.defineProperty(exports,"__esModule",{value:!0}),exports.FormHeader=exports.TokenClear=exports.TokenShowHide=exports.TokenValue=exports.TokenField=exports.FormWarning=exports.FormError=exports.FormLabel=exports.FormWrapper=exports.FormControl=exports.GroupLabel=exports.Table=void 0;const styled_components_1=__importStar(require("styled-components"));function placeholder(e,o){let t="";for(let r=0;r<e;r++)t+=o;return'"'+t+'"'}exports.Table=styled_components_1.default.div`
+  display: table;
+  width: 100%;
+`,exports.GroupLabel=styled_components_1.default.div`
+  color: #969a9a;
+  font-size: 1em;
+  font-weight: normal;
+  text-align: left;
+  position: absolute;
+`,exports.FormControl=styled_components_1.default.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 10px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+`,exports.FormWrapper=styled_components_1.default.div`
+  width: 100%;
+  margin-bottom: 20px;
+`,exports.FormLabel=styled_components_1.default.label`
+  padding-bottom: 6px;
+  display: block;
+  white-space: nowrap;
+  line-height: 1em;
+
+  ${({required:e})=>e&&styled_components_1.css`
+      &:after {
+        display: inline-block;
+        content: '*';
+        margin-left: 4px;
+        color: var(--color-error);
+      }
+    `}
+`,exports.FormError=styled_components_1.default.div`
+  color: var(--color-error);
+  font-size: 0.9em;
+  & pre {
+    word-break: break-word;
+    white-space: pre-wrap;
+  }
+`,exports.FormWarning=styled_components_1.default.div`
+  color: var(--color-warning);
+  font-size: 0.9em;
+`,exports.TokenField=styled_components_1.default.div`
+  position: relative;
+  margin-bottom: 1em;
+  display: flex;
+`,exports.TokenValue=styled_components_1.default.code`
+  flex: 1;
+  overflow-wrap: anywhere;
+  ${({masked:e,length:o})=>e&&`\n  color: transparent;\n\n  &:before {\n    content: ${placeholder(o,"*")};\n    color: white;\n    position: absolute;\n    right: 100px;\n  }\n  `||""}
+`,exports.TokenShowHide=styled_components_1.default.span`
+  padding: 0 5px;
+  cursor: pointer;
+`,exports.TokenClear=(0,styled_components_1.default)(exports.TokenShowHide)`
+  color: var(--color-error);
+`,exports.FormHeader=styled_components_1.default.div`
+  font-weight: bold;
+  font-size: 1.2em;
+  margin: 1em 0;
+`;
+//# sourceMappingURL=form.js.map

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

@@ -0,0 +1,2 @@
+export declare const SamplesPanelHeader: import("styled-components").StyledComponent<"h3", any, {}, never>;
+export declare const FieldsGroupHeader: import("styled-components").StyledComponent<"h5", any, {}, never>;

package/lib/components/common/headers.js

@@ -0,0 +1,12 @@
+"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.FieldsGroupHeader=exports.SamplesPanelHeader=void 0;const styled_components_1=__importDefault(require("styled-components")),utils_1=require("../../utils");exports.SamplesPanelHeader=styled_components_1.default.h3`
+  color: var(--panel-samples-text-color);
+
+  ${(0,utils_1.typography)("right-panel-header")};
+`,exports.FieldsGroupHeader=styled_components_1.default.h5`
+  color: var(--text-secondary);
+  font-weight: bold;
+  text-transform: uppercase;
+  font-size: 14px;
+  line-height: 20px;
+`;
+//# sourceMappingURL=headers.js.map

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

@@ -0,0 +1,14 @@
+export { Dropdown, SchemaDiscriminatorDropdown } from './Dropdown';
+export type { DropdownProps, DropdownOption } from './Dropdown';
+export { ShareLinkToField } from './LinkToField';
+export { deprecatedCss } from './mixins';
+export { FormControl } from './form';
+export * from './Fields';
+export * from './panels';
+export { FieldsGroupHeader, SamplesPanelHeader } from './headers';
+export { ShareLink, Link } from './linkify';
+export * from './shelfs';
+export * from './schema';
+export * from './perfect-scrollbar';
+export { Portal } from './Portal';
+export { Skeleton } from './Skeleton';

package/lib/components/common/index.js

@@ -0,0 +1,2 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,r,t,o){void 0===o&&(o=t);var n=Object.getOwnPropertyDescriptor(r,t);n&&!("get"in n?!r.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return r[t]}}),Object.defineProperty(e,o,n)}:function(e,r,t,o){void 0===o&&(o=t),e[o]=r[t]}),__exportStar=this&&this.__exportStar||function(e,r){for(var t in e)"default"===t||Object.prototype.hasOwnProperty.call(r,t)||__createBinding(r,e,t)};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Skeleton=exports.Portal=exports.Link=exports.ShareLink=exports.SamplesPanelHeader=exports.FieldsGroupHeader=exports.FormControl=exports.deprecatedCss=exports.ShareLinkToField=exports.SchemaDiscriminatorDropdown=exports.Dropdown=void 0;var Dropdown_1=require("./Dropdown");Object.defineProperty(exports,"Dropdown",{enumerable:!0,get:function(){return Dropdown_1.Dropdown}}),Object.defineProperty(exports,"SchemaDiscriminatorDropdown",{enumerable:!0,get:function(){return Dropdown_1.SchemaDiscriminatorDropdown}});var LinkToField_1=require("./LinkToField");Object.defineProperty(exports,"ShareLinkToField",{enumerable:!0,get:function(){return LinkToField_1.ShareLinkToField}});var mixins_1=require("./mixins");Object.defineProperty(exports,"deprecatedCss",{enumerable:!0,get:function(){return mixins_1.deprecatedCss}});var form_1=require("./form");Object.defineProperty(exports,"FormControl",{enumerable:!0,get:function(){return form_1.FormControl}}),__exportStar(require("./Fields"),exports),__exportStar(require("./panels"),exports);var headers_1=require("./headers");Object.defineProperty(exports,"FieldsGroupHeader",{enumerable:!0,get:function(){return headers_1.FieldsGroupHeader}}),Object.defineProperty(exports,"SamplesPanelHeader",{enumerable:!0,get:function(){return headers_1.SamplesPanelHeader}});var linkify_1=require("./linkify");Object.defineProperty(exports,"ShareLink",{enumerable:!0,get:function(){return linkify_1.ShareLink}}),Object.defineProperty(exports,"Link",{enumerable:!0,get:function(){return linkify_1.Link}}),__exportStar(require("./shelfs"),exports),__exportStar(require("./schema"),exports),__exportStar(require("./perfect-scrollbar"),exports);var Portal_1=require("./Portal");Object.defineProperty(exports,"Portal",{enumerable:!0,get:function(){return Portal_1.Portal}});var Skeleton_1=require("./Skeleton");Object.defineProperty(exports,"Skeleton",{enumerable:!0,get:function(){return Skeleton_1.Skeleton}});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,9 @@
+import type { PropsWithChildren } from 'react';
+export declare function Link(props: PropsWithChildren<{
+    to: string;
+    className?: string;
+    security?: boolean;
+    id?: string;
+}>): JSX.Element | null;
+export declare const StyledShareLink: import("styled-components").StyledComponent<typeof Link, any, {}, never>;
+export declare function ShareLink(props: any): JSX.Element;

package/lib/components/common/linkify.js

@@ -0,0 +1,10 @@
+"use strict";var __importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.ShareLink=exports.StyledShareLink=exports.Link=void 0;const react_1=__importDefault(require("react")),styled_components_1=__importDefault(require("styled-components")),jotai_1=require("jotai"),theme_1=require("@redocly/theme"),react_router_dom_1=require("react-router-dom"),store_1=require("../../jotai/store");function Link(e){var t;const{routingBasePath:r,hooks:i,onDeepLinkClick:o}=(0,jotai_1.useAtomValue)(store_1.globalOptionsAtom),a=e.security?null===(t=null==i?void 0:i.replaceSecurityLink)||void 0===t?void 0:t.call(i,{securityRequirementId:e.to}):e.to,n=o&&{onClick:e=>{e.preventDefault(),o(r+a)}};return a?react_1.default.createElement(react_router_dom_1.Link,Object.assign({id:e.id,className:e.className||"",to:(null==a?void 0:a.startsWith("#"))?a:r+a},n),e.children):e.children?react_1.default.createElement("span",{className:e.className}," ",e.children," "):null}function ShareLink(e){return react_1.default.createElement(exports.StyledShareLink,Object.assign({},e),react_1.default.createElement(theme_1.AnchorIcon,null))}exports.Link=Link,exports.StyledShareLink=(0,styled_components_1.default)(Link)`
+  position: absolute;
+  transform: translateX(-100%);
+  padding-right: var(--heading-anchor-offset-right);
+
+  :hover ${theme_1.AnchorIcon} {
+    visibility: visible;
+  }
+`,exports.ShareLink=ShareLink;
+//# sourceMappingURL=linkify.js.map

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

@@ -0,0 +1 @@
+export declare const deprecatedCss: import("styled-components").FlattenSimpleInterpolation;

package/lib/components/common/mixins.js

@@ -0,0 +1,5 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.deprecatedCss=void 0;const styled_components_1=require("styled-components");exports.deprecatedCss=styled_components_1.css`
+  text-decoration: line-through;
+  color: var(--schemas-property-deprecated-text-color);
+`;
+//# sourceMappingURL=mixins.js.map

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

@@ -0,0 +1,13 @@
+import { LayoutVariant } from '@redocly/theme';
+export declare const SamplesMiddlePanel: import("styled-components").StyledComponent<"div", any, {
+    compact?: boolean | undefined;
+    isStacked?: boolean | undefined;
+}, never>;
+export declare const Section: import("styled-components").StyledComponent<"div", any, {
+    underlined?: boolean | undefined;
+    sectionId?: string | undefined;
+}, never>;
+export declare const SamplesPanel: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Row: import("styled-components").StyledComponent<"div", any, {
+    layout?: LayoutVariant | undefined;
+}, never>;

package/lib/components/common/panels.js

@@ -0,0 +1,102 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,a,i){void 0===i&&(i=a);var n=Object.getOwnPropertyDescriptor(t,a);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(e,i,n)}:function(e,t,a,i){void 0===i&&(i=a),e[i]=t[a]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var a in e)"default"!==a&&Object.prototype.hasOwnProperty.call(e,a)&&__createBinding(t,e,a);return __setModuleDefault(t,e),t};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Row=exports.SamplesPanel=exports.Section=exports.SamplesMiddlePanel=void 0;const theme_1=require("@redocly/theme"),styled_components_1=__importStar(require("styled-components")),constants_1=require("../../constants");exports.SamplesMiddlePanel=styled_components_1.default.div`
+  ${({compact:e,isStacked:t,theme:a})=>{const i=e?0:"var(--spacing-vertical)";return styled_components_1.css`
+      &:empty {
+        display: none;
+      }
+      width: 100%;
+      padding: ${i} var(--panel-gap-horizontal);
+
+      ${a.mediaQueries[a.showAtBreakpoint.samplesPanel]} {
+        width: calc(100% - var(--panel-samples-width));
+        padding-right: var(--panel-gap-vertical, var(--panel-gap-horizontal));
+        padding-top: 0;
+        padding-bottom: ${t?"var(--spacing-vertical)":0};
+      }
+
+      ${a.mediaQueries.print} {
+        width: 100%;
+        padding-top: ${i};
+        padding-bottom: ${i};
+      }
+    `}}
+`,exports.Section=styled_components_1.default.div.attrs((e=>({[constants_1.SECTION_ATTR]:e.sectionId,id:e.id})))`
+  z-index: 0;
+  padding: 0;
+  width: 100%;
+
+  & > &:last-child {
+    min-height: initial;
+  }
+  ${({theme:e})=>styled_components_1.css`
+    ${e.mediaQueries[e.showAtBreakpoint.samplesPanel]} {
+      padding-top: var(--spacing-vertical);
+      padding-bottom: var(--spacing-vertical);
+    }
+
+    ${e.mediaQueries.print} {
+      padding: 0;
+    }
+  `}
+  ${({underlined:e})=>e&&styled_components_1.css`
+      position: relative;
+
+      &:not(:last-of-type):after {
+        position: absolute;
+        bottom: 0;
+        width: 100%;
+        display: block;
+        content: '';
+        border-bottom: 1px solid var(--border-primary);
+      }
+    `}
+  ${theme_1.H2} {
+    position: relative;
+  }
+`,exports.SamplesPanel=styled_components_1.default.div`
+  color: var(--panel-samples-text-color);
+  width: 100%;
+  height: fit-content;
+  padding-top: var(--panel-gap-vertical);
+  padding-bottom: var(--panel-gap-vertical);
+  padding-left: var(--panel-gap-horizontal);
+  padding-right: var(--panel-gap-horizontal);
+
+  position: sticky;
+  top: calc(var(--navbar-height) + var(--panel-gap-vertical));
+
+  &:empty {
+    display: none;
+  }
+
+  ${({theme:e})=>styled_components_1.css`
+    ${e.mediaQueries[e.showAtBreakpoint.samplesPanel]} {
+      width: var(--panel-samples-width);
+      padding-top: 0;
+      padding-bottom: 0;
+      padding-left: var(--panel-gap-vertical, var(--panel-gap-horizontal));
+    }
+
+    ${e.mediaQueries.print} {
+      width: 100%;
+      padding-top: var(--spacing-vertical);
+      padding-bottom: var(--spacing-vertical);
+    }
+  `}
+`,exports.Row=styled_components_1.default.div`
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  width: 100%;
+  padding: 0;
+
+  ${({theme:e,layout:t})=>styled_components_1.css`
+    ${e.mediaQueries[e.showAtBreakpoint.samplesPanel]} {
+      flex-direction: ${t!==theme_1.LayoutVariant.STACKED?"row":"column"};
+    }
+
+    ${e.mediaQueries.print} {
+      flex-direction: column;
+    }
+  `}
+`;
+//# sourceMappingURL=panels.js.map

package/lib/components/common/perfect-scrollbar.d.ts

@@ -0,0 +1,18 @@
+import { Component } from 'react';
+import type PerfectScrollbarType from 'perfect-scrollbar';
+import type { PropsWithChildren } from 'react';
+export interface PerfectScrollbarProps {
+    options?: PerfectScrollbarType.Options;
+    className?: string;
+    updateFn?: (fn: any) => void;
+}
+export declare class PerfectScrollbar extends Component<PropsWithChildren<PerfectScrollbarProps>> {
+    private _container;
+    private inst;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    handleRef: (ref: HTMLDivElement) => void;
+    render(): JSX.Element;
+}
+export declare function PerfectScrollbarWrap({ children, ...rest }: PropsWithChildren<PerfectScrollbarProps>): JSX.Element;

package/lib/components/common/perfect-scrollbar.js

@@ -0,0 +1,4 @@
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?function(e,t,r,o){void 0===o&&(o=r);var l=Object.getOwnPropertyDescriptor(t,r);l&&!("get"in l?!t.__esModule:l.writable||l.configurable)||(l={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,o,l)}:function(e,t,r,o){void 0===o&&(o=r),e[o]=t[r]}),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),__importStar=this&&this.__importStar||function(e){if(e&&e.__esModule)return e;var t={};if(null!=e)for(var r in e)"default"!==r&&Object.prototype.hasOwnProperty.call(e,r)&&__createBinding(t,e,r);return __setModuleDefault(t,e),t},__rest=this&&this.__rest||function(e,t){var r={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(r[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var l=0;for(o=Object.getOwnPropertySymbols(e);l<o.length;l++)t.indexOf(o[l])<0&&Object.prototype.propertyIsEnumerable.call(e,o[l])&&(r[o[l]]=e[o[l]])}return r};Object.defineProperty(exports,"__esModule",{value:!0}),exports.PerfectScrollbarWrap=exports.PerfectScrollbar=void 0;const styled_components_1=__importStar(require("styled-components")),PerfectScrollbarNamespace=__importStar(require("perfect-scrollbar")),react_1=__importStar(require("react")),jotai_1=require("jotai"),utils_1=require("../../utils"),store_1=require("../../jotai/store");let psStyles="";utils_1.IS_BROWSER&&(psStyles=require("perfect-scrollbar/css/perfect-scrollbar.css"),psStyles="function"==typeof psStyles.toString&&psStyles.toString()||"",psStyles="[object Object]"===psStyles?"":psStyles);const PerfectScrollbarConstructor=PerfectScrollbarNamespace.default||PerfectScrollbarNamespace,PSStyling=styled_components_1.createGlobalStyle`${psStyles}`,StyledScrollWrapper=styled_components_1.default.div`
+  position: relative;
+`;class PerfectScrollbar extends react_1.Component{constructor(){super(...arguments),Object.defineProperty(this,"_container",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"inst",{enumerable:!0,configurable:!0,writable:!0,value:void 0}),Object.defineProperty(this,"handleRef",{enumerable:!0,configurable:!0,writable:!0,value:e=>{this._container=e}})}componentDidMount(){const e=this._container.parentElement&&this._container.parentElement.scrollTop||0;this.inst=new PerfectScrollbarConstructor(this._container,this.props.options||{}),this._container.scrollTo&&this._container.scrollTo(0,e)}componentDidUpdate(){this.inst.update()}componentWillUnmount(){this.inst.destroy()}render(){const{children:e,updateFn:t,className:r=""}=this.props;return t&&t(this.componentDidUpdate.bind(this)),react_1.default.createElement(react_1.default.Fragment,null,psStyles&&react_1.default.createElement(PSStyling,null),react_1.default.createElement(StyledScrollWrapper,{className:`scrollbar-container ${r}`,ref:this.handleRef},e))}}function PerfectScrollbarWrap(e){var{children:t}=e,r=__rest(e,["children"]);const{nativeScrollbars:o}=(0,jotai_1.useAtomValue)(store_1.globalOptionsAtom);return o?react_1.default.createElement("div",{style:{overflow:"auto",overscrollBehavior:"contain",msOverflowStyle:"-ms-autohiding-scrollbar"}},t):react_1.default.createElement(PerfectScrollbar,Object.assign({},r),t)}exports.PerfectScrollbar=PerfectScrollbar,exports.PerfectScrollbarWrap=PerfectScrollbarWrap;
+//# sourceMappingURL=perfect-scrollbar.js.map

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

@@ -0,0 +1,11 @@
+export declare const OneOfButton: import("styled-components").StyledComponent<"button", any, {
+    selected: boolean;
+    deprecated: boolean;
+}, never>;
+export declare const OneOfList: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const BadgeStyle: import("styled-components").StyledComponent<"span", any, {
+    deprecated?: boolean | undefined;
+}, never>;
+export declare const ArrayOpeningLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ArrayClosingLabel: import("styled-components").StyledComponent<"div", any, {}, never>;