@redocly/openapi-docs 0.0.0-react18-20231120182601

package/lib-esm/components/StickySidebar/StickyResponsiveSidebar.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { Options } from '../../services';
+interface StickySidebarProps {
+    className?: string;
+    scrollYOffset: Options['scrollYOffset'];
+    hideFab: Options['hideFab'];
+    collapsedSidebar: boolean;
+}
+export declare const StickyResponsiveSidebar: React.NamedExoticComponent<React.PropsWithChildren<StickySidebarProps>>;
+export {};

package/lib-esm/components/StickySidebar/StickyResponsiveSidebar.js

@@ -0,0 +1,39 @@
+import React,{memo,useEffect,useRef,useState}from"react";import styled,{css}from"styled-components";import{MobileSidebarButton,MobileSidebarIcon,useMount,useUnmount}from"@redocly/theme";import{useAtom}from"jotai";import{useLocation}from"react-router-dom";import{IS_BROWSER}from"../../utils";import{isSidebarOpenedAtom}from"../../jotai/app";import{Actions}from"../SideMenu/Actions";let Stickyfill;IS_BROWSER&&(Stickyfill=require("stickyfill"));const stickyfill=Stickyfill&&Stickyfill(),StyledStickySidebar=styled.div`
+  overflow: hidden;
+  flex-direction: column;
+  backface-visibility: hidden;
+  height: ${({offsetTop:e})=>`calc(100vh - ${e})`};
+  top: 0;
+  flex: 0 0 auto;
+  position: fixed;
+  display: ${({open:e})=>e?"flex":"none"};
+  z-index: 2;
+  width: 100%;
+  background: var(--sidebar-background-color);
+  border-right: ${({collapsedSidebar:e})=>e?"1px solid var(--sidebar-border-color)":"auto"};
+
+  ${({theme:e,collapsedSidebar:t})=>css`
+    ${e.mediaQueries[e.showAtBreakpoint.sidebar]} {
+      position: sticky;
+      z-index: auto;
+      width: ${t?"var(--sidebar-width)":"auto"};
+      display: flex;
+    }
+    ${e.mediaQueries.print} {
+      display: none;
+    }
+  `}
+`,FloatingButton=styled(MobileSidebarButton)`
+  --fab-background-color: var(--bg-overlay);
+  --fab-active-background: var(--bg-raised);
+
+  ${({theme:e})=>css`
+    ${e.mediaQueries[e.showAtBreakpoint.sidebar]} {
+      display: none;
+    }
+    ${e.mediaQueries.print} {
+      display: none;
+    }
+  `}
+`;function StickyResponsiveSidebarComponent({scrollYOffset:e,hideFab:t,className:i,children:o,collapsedSidebar:a}){const[r,s]=useState("0px"),l=useRef(null),n=useLocation(),[c,d]=useAtom(isSidebarOpenedAtom);useEffect((()=>{n.hash&&d(!1)}),[n.pathname,n.hash,d]),useMount((()=>{stickyfill&&stickyfill.add(l.current);const t=e();s(`${t}px`)})),useUnmount((()=>{stickyfill&&stickyfill.remove(l.current)}));return React.createElement(React.Fragment,null,React.createElement(StyledStickySidebar,{open:c,className:i,offsetTop:r,style:{top:r},ref:l,collapsedSidebar:a},a||c?o:null,React.createElement(Actions,null)),!t&&React.createElement(FloatingButton,{opened:c,onClick:()=>{d(!c)}},React.createElement(MobileSidebarIcon,null)))}export const StickyResponsiveSidebar=memo(StickyResponsiveSidebarComponent);
+//# sourceMappingURL=StickyResponsiveSidebar.js.map

package/lib-esm/components/StickySidebar/index.d.ts

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

package/lib-esm/components/StickySidebar/index.js

@@ -0,0 +1,2 @@
+export{StickyResponsiveSidebar}from"./StickyResponsiveSidebar";
+//# sourceMappingURL=index.js.map

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTab.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const CollapsingTab: import("styled-components").StyledComponent<import("react").FunctionComponent<import("react-tabs").TabProps>, any, {}, never>;

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTab.js

@@ -0,0 +1,11 @@
+import styled from"styled-components";import{Tab}from"../Tab";export const CollapsingTab=styled(Tab)`
+  max-width: 200px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+
+  &.react-tabs__tab--disabled {
+    display: none;
+  }
+`;
+//# sourceMappingURL=CollapsingTab.js.map

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTabList.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const CollapsingTabList: import("styled-components").StyledComponent<import("react").FunctionComponent<import("react-tabs").TabListProps>, any, {}, never>;

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTabList.js

@@ -0,0 +1,12 @@
+import styled from"styled-components";import{TabList}from"../TabList";export const CollapsingTabList=styled(TabList)`
+  background-color: var(--bg-overlay);
+  border-radius: var(--border-radius-lg);
+  padding: 2px;
+  margin: 0 0 15px;
+
+  li[class^='Tab'] {
+    margin: 0;
+    list-style: none;
+  }
+`;
+//# sourceMappingURL=CollapsingTabList.js.map

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTabs.d.ts

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

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTabs.js

@@ -0,0 +1,2 @@
+var __rest=this&&this.__rest||function(e,t){var n={};for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(n[o]=e[o]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(o=Object.getOwnPropertySymbols(e);a<o.length;a++)t.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(e,o[a])&&(n[o[a]]=e[o[a]])}return n};import React,{memo,useCallback,useEffect,useState}from"react";import{useAtom}from"jotai";import{CollapsingTabsBase}from"./CollapsingTabsBase";import{operationStore}from"../../../jotai/operation";function getActiveIndexFromOperation(e,t,n){var o;if(!t)return-1;if("number"==typeof n&&n>0){return hasActiveExampleName(null===(o=e[n])||void 0===o?void 0:o.content,t)?n:getActiveIndexFromOperation(e,t)}return e.findIndex((({content:e})=>hasActiveExampleName(e,t)))}function hasActiveExampleName(e,t){return!!(null==e?void 0:e.mediaTypes.find((e=>Object.keys(e.examples||[]).includes(t||""))))}function CollapsingTabsComponent(e){var{children:t}=e,n=__rest(e,["children"]);const{operation:{pointer:o,responses:a},tabs:i}=n,[r,s]=useAtom(operationStore(o)),[l,c]=useState(0);function p(e){s((t=>Object.assign(Object.assign({},t),{activeResponseTab:e})))}useEffect((()=>{const e=i.findIndex((e=>e.title===(null==r?void 0:r.activeResponseTab)));c(e)}),[i,null==r?void 0:r.activeResponseTab,c]);const m=null==r?void 0:r.activeExampleName;useEffect((()=>{const e=getActiveIndexFromOperation(a,m,l);e>-1&&i[e]&&(c(e),p(i[e].title))}),[m]);const u=useCallback((e=>{l!==e&&(c(e),p(i[e].title))}),[l]);return React.createElement(CollapsingTabsBase,Object.assign({},n,{activeIndex:l,onChange:u}),t)}export const CollapsingTabs=memo(CollapsingTabsComponent);
+//# sourceMappingURL=CollapsingTabs.js.map

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTabsBase.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import type { ReactNode } from 'react';
+import type { TabProps as ReactTabProps } from 'react-tabs';
+import type { OperationModel } from '../../../models';
+export interface TabProps extends ReactTabProps {
+    title: string;
+}
+export interface TabsProps {
+    tabs: TabProps[];
+    hidden?: boolean;
+    children: ReactNode;
+    operation: OperationModel;
+}
+interface CollapsingTabsComponentProps extends Omit<TabsProps, 'operation'> {
+    activeIndex: number;
+    onChange: (idx: number) => void;
+}
+export declare const CollapsingTabsBase: React.NamedExoticComponent<CollapsingTabsComponentProps>;
+export {};

package/lib-esm/components/Tabs/CollapsingTabs/CollapsingTabsBase.js

@@ -0,0 +1,2 @@
+import React,{memo,useCallback,useEffect,useMemo,useState}from"react";import{Tabs}from"react-tabs";import{useAtomValue}from"jotai";import{CollapsingDropdown}from"../../common/Dropdown";import{CollapsingTabList}from"./CollapsingTabList";import{CollapsingTab}from"./CollapsingTab";import{globalOptionsAtom}from"../../../jotai/store";function CollapsingTabsBaseComponent({tabs:e,children:o,hidden:t,activeIndex:a,onChange:l}){const{samplesTabsMaxCount:n}=useAtomValue(globalOptionsAtom),s=useMemo((()=>e.slice(n).map((({title:e},o)=>({idx:o,value:e})))),[e,n]),i=`${s.length} more`,[m,p]=useState(i),r=useCallback((()=>{var o;const t=a>=n;m!==i&&m===e[a].title||!t?m===i||t||p(i):p(null===(o=e[a])||void 0===o?void 0:o.title)}),[a,n,m,i,e]);useEffect((()=>{setTimeout(r,0)}),[a,n,r]);return React.createElement(Tabs,{selectedIndex:a,onSelect:l},React.createElement(CollapsingTabList,{hidden:t},e.map(((e,o)=>React.createElement(CollapsingTab,{key:null==e?void 0:e.key,disabled:o>=n},null==e?void 0:e.title))),s.length?React.createElement(CollapsingDropdown,{options:s,onChange:e=>{l(n+e.idx)},placeholder:i,value:m,active:a>=n}):null),o)}export const CollapsingTabsBase=memo(CollapsingTabsBaseComponent);
+//# sourceMappingURL=CollapsingTabsBase.js.map

package/lib-esm/components/Tabs/CollapsingTabs/index.d.ts

@@ -0,0 +1,4 @@
+export * from './CollapsingTabsBase';
+export * from './CollapsingTabs';
+export * from './CollapsingTabList';
+export * from './CollapsingTab';

package/lib-esm/components/Tabs/CollapsingTabs/index.js

@@ -0,0 +1,2 @@
+export*from"./CollapsingTabsBase";export*from"./CollapsingTabs";export*from"./CollapsingTabList";export*from"./CollapsingTab";
+//# sourceMappingURL=index.js.map

package/lib-esm/components/Tabs/Tab.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Tab: import("styled-components").StyledComponent<import("react").FunctionComponent<import("react-tabs").TabProps>, any, {}, never>;

package/lib-esm/components/Tabs/Tab.js

@@ -0,0 +1,28 @@
+import{Tab as ReactTab}from"react-tabs";import styled from"styled-components";export const Tab=styled(ReactTab)`
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  padding: 0px 8px;
+  font-size: var(--panel-samples-tabs-font-size);
+  line-height: 26px;
+  font-weight: var(--panel-samples-tabs-font-weight);
+  text-align: center;
+  color: var(--panel-samples-tabs-text-color);
+  background-color: var(--panel-samples-tabs-background-color);
+  border-radius: var(--border-radius-lg);
+
+  &:hover {
+    border-color: var(--panel-samples-tabs-hover-border-color);
+    background-color: var(--panel-samples-tabs-hover-background-color);
+    color: var(--panel-samples-tabs-hover-text-color);
+  }
+
+  &.react-tabs__tab--selected {
+    background-color: var(--panel-samples-tabs-active-background-color);
+    border-color: var(--panel-samples-tabs-active-border-color);
+    color: var(--panel-samples-tabs-active-text-color);
+  }
+`;
+//# sourceMappingURL=Tab.js.map

package/lib-esm/components/Tabs/TabList.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const TabList: import("styled-components").StyledComponent<import("react").FunctionComponent<import("react-tabs").TabListProps>, any, {}, never>;

package/lib-esm/components/Tabs/TabList.js

@@ -0,0 +1,7 @@
+import{TabList as ReactTabList}from"react-tabs";import styled from"styled-components";export const TabList=styled(ReactTabList)`
+  display: flex;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+`;
+//# sourceMappingURL=TabList.js.map

package/lib-esm/components/Tabs/TabPanel.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const TabPanel: import("styled-components").StyledComponent<import("react").FunctionComponent<import("react-tabs").TabPanelProps>, any, {}, never>;

package/lib-esm/components/Tabs/TabPanel.js

@@ -0,0 +1,11 @@
+import{TabPanel as ReactTabPanel}from"react-tabs";import styled from"styled-components";export const TabPanel=styled(ReactTabPanel)`
+  display: none;
+
+  &.react-tabs__tab-panel--selected {
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+  }
+`;
+//# sourceMappingURL=TabPanel.js.map

package/lib-esm/components/Tabs/index.d.ts

@@ -0,0 +1,5 @@
+export * from './TabList';
+export * from './Tab';
+export * from './TabPanel';
+export * from './CollapsingTabs';
+export { Tabs } from 'react-tabs';

package/lib-esm/components/Tabs/index.js

@@ -0,0 +1,2 @@
+export*from"./TabList";export*from"./Tab";export*from"./TabPanel";export*from"./CollapsingTabs";export{Tabs}from"react-tabs";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { SectionItemProps } from '../SectionItem/SectionItem';
+export declare function TagItem({ item }: SectionItemProps): JSX.Element;

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

@@ -0,0 +1,2 @@
+import React from"react";import{H2}from"@redocly/theme";import{SamplesMiddlePanel,ShareLink}from"../common";import{Markdown}from"../Markdown";export function TagItem({item:e}){const{description:t,name:a,href:r}=e;return React.createElement(React.Fragment,null,React.createElement(SamplesMiddlePanel,null,React.createElement(H2,null,React.createElement(ShareLink,{to:r}),a)),React.createElement(Markdown,{source:t,htmlWrap:e=>React.createElement(SamplesMiddlePanel,null,e)}))}
+//# sourceMappingURL=TagItem.js.map

package/lib-esm/components/TagItem/index.d.ts

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

package/lib-esm/components/TagItem/index.js

@@ -0,0 +1,2 @@
+export{TagItem}from"./TagItem";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import type { ContentItemModel } from '../../models';
+import type { Options } from '../../services';
+interface TagItemsProps {
+    tag: ContentItemModel;
+    nextSectionLink?: {
+        name: string;
+        href?: string;
+    };
+    pagination: Options['pagination'];
+    showNextButton?: boolean;
+}
+export declare function TagItems({ tag, nextSectionLink, pagination, showNextButton, }: TagItemsProps): JSX.Element;
+export {};

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

@@ -0,0 +1,2 @@
+import React,{useMemo}from"react";import{OpenApiHeader}from"@redocly/theme";import{useAtomValue}from"jotai";import{Pagination}from"../../services";import{ContentItem}from"../ContentItem";import{MiddlePanelWrapper}from"../Panel";import{PageFooter}from"../PageFooter";import{SectionContent}from"../SectionContent";import{globalOptionsAtom}from"../../jotai/store";import{RenderHook}from"../RenderHook";export function TagItems({tag:e,nextSectionLink:t,pagination:o,showNextButton:n}){const{hooks:{MiddlePanelHeader:r}}=useAtomValue(globalOptionsAtom),a=useMemo((()=>{const e=React.createElement(PageFooter,{showNextButton:n,pagination:o,nextSectionLink:t});return e?React.createElement(MiddlePanelWrapper,null,e):null}),[t,o,n]),i=useMemo((()=>OpenApiHeader||r?React.createElement(MiddlePanelWrapper,null,r?React.createElement(RenderHook,{Hook:r,props:void 0}):React.createElement(OpenApiHeader,null)):null),[r]);return React.createElement(React.Fragment,null,i,React.createElement(ContentItem,{key:e.id,item:e,withChildren:o!==Pagination.Item}),o===Pagination.Item&&React.createElement(SectionContent,{hideFooterAndHeader:!0,items:e.items||[],pagination:o,showNextButton:!1}),a)}
+//# sourceMappingURL=TagItems.js.map

package/lib-esm/components/TagItems/index.d.ts

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

package/lib-esm/components/TagItems/index.js

@@ -0,0 +1,2 @@
+export{TagItems}from"./TagItems";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { DropdownOption } from './common/Dropdown';
+import type { OpenAPIDefinitionVersion } from '../jotai/store';
+export interface VersionSwitcherProps {
+    onChange: (o: DropdownOption) => void;
+    versions: OpenAPIDefinitionVersion[];
+    activeVersionIdx: number;
+}
+export declare const VersionSwitcher: ({ versions, onChange, activeVersionIdx, }: VersionSwitcherProps) => JSX.Element | null;

package/lib-esm/components/VersionSwitcher.js

@@ -0,0 +1,7 @@
+import React from"react";import styled from"styled-components";import{VersionDropdown}from"./common/Dropdown";export const VersionSwitcher=({versions:e,onChange:n,activeVersionIdx:o})=>{const r=e.map(((e,n)=>({idx:n,value:e.title||e.id})));return React.createElement(VersionWrapper,null,React.createElement(VersionDropdown,{options:r,value:r[o].value,onChange:n,ariaLabel:"Version"}))};const VersionWrapper=styled.div`
+  padding: calc(var(--spacing-unit) * 2) calc(var(--spacing-unit) * 4);
+  width: 100%;
+  display: inline-block;
+  font-size: 12px;
+`;
+//# sourceMappingURL=VersionSwitcher.js.map

package/lib-esm/components/common/Checkbox.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export declare const StyledInput: import("styled-components").StyledComponent<"input", any, {
+    fullWidth?: boolean | undefined;
+}, never>;
+export interface CheckboxExtraProps {
+    fullWidth?: boolean;
+    label?: string;
+    nowrap?: boolean;
+}
+export declare const Checkbox: React.ForwardRefExoticComponent<React.InputHTMLAttributes<Omit<HTMLInputElement, "type">> & CheckboxExtraProps & React.RefAttributes<HTMLInputElement>>;

package/lib-esm/components/common/Checkbox.js

@@ -0,0 +1,31 @@
+import React,{forwardRef}from"react";import styled from"styled-components";export const StyledInput=styled.input`
+  cursor: pointer;
+  margin-left: 0;
+  margin-right: 5px;
+  height: 20px;
+
+  align-self: baseline;
+  margin-top: 0;
+  margin-bottom: 0;
+`;const CheckboxLabel=styled.label`
+  display: inline-block;
+  cursor: pointer;
+  vertical-align: middle;
+  position: relative;
+  text-overflow: ellipsis;
+  overflow: hidden;
+
+  overflow-wrap: break-word;
+  line-height: 20px;
+`,CheckBoxWrap=styled.div`
+  width: ${({fullWidth:e})=>e?"100%":"50%"};
+  display: inline-flex;
+  align-items: center;
+
+  & > label {
+    white-space: ${({nowrap:e})=>e?"nowrap":"normal"};
+  }
+
+  ${({nowrap:e})=>e?"":"\n    :not(:first-child) {\n      margin-top: 5px;\n    }\n  "}
+`;function CheckboxComponent(e,t){const{fullWidth:o,id:n,label:l,nowrap:r}=e;return React.createElement(CheckBoxWrap,{fullWidth:o,nowrap:r},React.createElement(StyledInput,Object.assign({},e,{type:"checkbox",ref:t})),React.createElement(CheckboxLabel,{htmlFor:n},l))}export const Checkbox=forwardRef(CheckboxComponent);
+//# sourceMappingURL=Checkbox.js.map

package/lib-esm/components/common/CheckboxList.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+type FieldValue = string[];
+export interface CheckboxListComponentProps {
+    items: string[];
+    maxDisplayedItems?: number;
+    validateOnChange?: boolean;
+    showControls?: boolean;
+    trimItemsLength?: boolean;
+    defaultValue: FieldValue;
+    fieldName: string;
+}
+export declare const CheckboxListComponent: ({ fieldName, defaultValue, items, validateOnChange, maxDisplayedItems, showControls, trimItemsLength, }: CheckboxListComponentProps) => JSX.Element;
+export declare const CheckboxList: React.NamedExoticComponent<CheckboxListComponentProps>;
+export {};

package/lib-esm/components/common/CheckboxList.js

@@ -0,0 +1,8 @@
+import{CodeBlockControls,CodeBlockControlButton}from"@redocly/theme";import React,{useState,memo}from"react";import styled from"styled-components";import{Controller,useFormContext}from"react-hook-form";import{FormError}from"./form";import{Checkbox}from"./Checkbox";const DEFAULT_MAX_ITEMS=11;export const CheckboxListComponent=({fieldName:e,defaultValue:t,items:o,validateOnChange:l,maxDisplayedItems:r,showControls:a,trimItemsLength:c})=>{var n,s;const{control:m,setValue:i,getValues:d,formState:u,trigger:C}=useFormContext(),[p,g]=useState(!0),h=t=>d(e).includes(t),k=null===(s=null===(n=u.errors[e])||void 0===n?void 0:n.message)||void 0===s?void 0:s.toString(),x=r||11,b=c&&p?o.slice(0,x):o;return React.createElement("div",null,a?React.createElement(CodeBlockControls,{controls:{select:{onClick:()=>{i(e,o)},label:"Select all",tooltipText:"Select all checkboxes"},deselect:{onClick:()=>{i(e,[])},label:"Deselect all",tooltipText:"Deselect all checkboxes"}}}):null,React.createElement(ListWrapper,null,React.createElement(Controller,{control:m,name:e,defaultValue:t,render:()=>React.createElement(React.Fragment,null,b.map((t=>React.createElement(Checkbox,{fullWidth:!0,id:t,value:t,checked:h(t),label:t,key:t,onChange:t=>{(t=>{const o=t.target.value,l=t.target.checked,r=d(e)||[];let a;if(l)a=[...r,o];else{const e=r.indexOf(o);a=[...r.slice(0,e),...r.slice(e+1)]}i(e,a)})(t),l&&C(e)}}))))}),o.length>x&&c?React.createElement(ToggleButton,{onClick:()=>{g((e=>!e))}},p?"Show all":"Collapse"):null),k?React.createElement(FormError,null,k):"")};export const CheckboxList=memo(CheckboxListComponent);const ListWrapper=styled.div`
+  padding: 10px;
+  border: 1px solid var(--border-primary);
+  border-radius: 0 0 var(--border-radius-lg) var(--border-radius-lg);
+`,ToggleButton=styled(CodeBlockControlButton)`
+  float: right;
+`;
+//# sourceMappingURL=CheckboxList.js.map

package/lib-esm/components/common/ClearButton/ClearButton.d.ts

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

package/lib-esm/components/common/ClearButton/ClearButton.js

@@ -0,0 +1,2 @@
+import React,{memo}from"react";const ClearButtonComponent=({className:e,style:t,handleClear:o})=>React.createElement("button",{className:e,style:t,onClick:o},"✕");export const ClearButton=memo(ClearButtonComponent);
+//# sourceMappingURL=ClearButton.js.map

package/lib-esm/components/common/ClearButton/index.d.ts

@@ -0,0 +1,2 @@
+export * from './styled';
+export * from './types';

package/lib-esm/components/common/ClearButton/index.js

@@ -0,0 +1,2 @@
+export*from"./styled";export*from"./types";
+//# sourceMappingURL=index.js.map

package/lib-esm/components/common/ClearButton/styled.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const ClearButton: import("styled-components").StyledComponent<import("react").NamedExoticComponent<import("./types").ClearButtonProps>, any, {}, never>;

package/lib-esm/components/common/ClearButton/styled.js

@@ -0,0 +1,16 @@
+import styled from"styled-components";import{ClearButton as ClearButtonComponent}from"./ClearButton";export const ClearButton=styled(ClearButtonComponent)`
+  z-index: 1;
+  position: absolute;
+  right: 24px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: #89949f;
+  background: none;
+  border: none;
+  cursor: pointer;
+
+  &:hover {
+    color: #fff;
+  }
+`;
+//# sourceMappingURL=styled.js.map

package/lib-esm/components/common/ClearButton/types.d.ts

@@ -0,0 +1,6 @@
+import type React from 'react';
+export interface ClearButtonProps {
+    className?: string;
+    style?: React.CSSProperties;
+    handleClear?: () => void;
+}

package/lib-esm/components/common/ClearButton/types.js

@@ -0,0 +1,2 @@
+export{};
+//# sourceMappingURL=types.js.map

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

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

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

@@ -0,0 +1,16 @@
+import React,{memo,useMemo}from"react";import styled from"styled-components";import{ClearButton}from"../ClearButton";import{normalizeText}from"../../../utils";const ArrowSvg=({className:e,style:t})=>React.createElement("svg",{className:e,style:t,xmlns:"http://www.w3.org/2000/svg",width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"},React.createElement("polyline",{points:"6 9 12 15 18 9"})),ArrowIcon=styled(ArrowSvg)`
+  position: absolute;
+  pointer-events: none;
+  z-index: 1;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+  -ms-transform: translateY(-50%);
+  transform: translateY(-50%);
+  right: 8px;
+  margin: auto;
+  text-align: center;
+  polyline {
+    color: inherit;
+  }
+`,DropdownComponent=({options:e,onChange:t,handleClear:o,clearable:n,placeholder:r,value:a="",className:l})=>{var s;const c=useMemo((()=>e.map((({idx:e,value:t,title:o},n)=>{const r=normalizeText(t);return React.createElement("option",{key:e||r+n,value:r,className:"dropdown-option"},o||r)}))),[e]),i=normalizeText(a),m=(null===(s=e.find((e=>e.value===a)))||void 0===s?void 0:s.title)||i;return React.createElement("div",{className:l+" dropdown-wrapper"},React.createElement(ArrowIcon,null),n&&(null==i?void 0:i.length)>0&&React.createElement(ClearButton,{handleClear:o}),React.createElement("select",{onChange:o=>{const{selectedIndex:n}=o.target;t(e[r||!a?n-1:n])},value:i,className:"dropdown-select"},r&&React.createElement("option",{disabled:!0,hidden:!0,value:r},r),!i&&!r&&React.createElement("option",{disabled:!0}),c),React.createElement("label",null,m))};export const Dropdown=memo(DropdownComponent);
+//# sourceMappingURL=Dropdown.js.map

package/lib-esm/components/common/Dropdown/index.d.ts

@@ -0,0 +1,2 @@
+export * from './styled';
+export * from './types';

package/lib-esm/components/common/Dropdown/index.js

@@ -0,0 +1,2 @@
+export*from"./styled";export*from"./types";
+//# sourceMappingURL=index.js.map

package/lib-esm/components/common/Dropdown/styled.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import type { DropdownProps } from './types';
+export declare const Dropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
+    fullWidth?: boolean | undefined;
+    variant?: "dark" | "light" | undefined;
+}, never>;
+export declare const SimpleDropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
+    fullWidth?: boolean | undefined;
+    variant?: "dark" | "light" | undefined;
+}, never>;
+export declare const CollapsingDropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
+    fullWidth?: boolean | undefined;
+    variant?: "dark" | "light" | undefined;
+} & {
+    active?: boolean | undefined;
+}, never>;
+export declare const VersionDropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
+    fullWidth?: boolean | undefined;
+    variant?: "dark" | "light" | undefined;
+}, never>;
+export declare const SchemaDiscriminatorDropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
+    fullWidth?: boolean | undefined;
+    variant?: "dark" | "light" | undefined;
+}, never>;
+export declare const SchemaMimeTypeDropdown: import("styled-components").StyledComponent<import("react").NamedExoticComponent<DropdownProps>, any, DropdownProps & {
+    fullWidth?: boolean | undefined;
+    variant?: "dark" | "light" | undefined;
+}, never>;

package/lib-esm/components/common/Dropdown/styled.js

@@ -0,0 +1,133 @@
+import styled,{css}from"styled-components";import{Dropdown as DropdownComponent}from"./Dropdown";const darkDropdownStyle=css`
+  background-color: var(--panel-samples-dropdown-background-color);
+  border: var(--panel-samples-dropdown-border);
+  color: var(--panel-samples-dropdown-color);
+
+  &,
+  &:hover,
+  &:focus-within {
+    box-shadow: none;
+  }
+`;export const Dropdown=styled(DropdownComponent)`
+  box-sizing: border-box;
+  outline: none;
+  display: inline-block;
+  vertical-align: bottom;
+  position: relative;
+  width: ${({fullWidth:o})=>o?"100%":"auto"};
+  cursor: pointer;
+  text-transform: none;
+
+  label {
+    box-sizing: border-box;
+    min-width: 90px;
+    height: 36px;
+    outline: none;
+    display: inline-block;
+    color: var(--docs-dropdown-text-color);
+    border-radius: var(--border-radius-md);
+    padding: var(--docs-dropdown-padding);
+    vertical-align: bottom;
+    width: ${({fullWidth:o})=>o?"100%":"auto"};
+    text-transform: none;
+    line-height: inherit;
+    font-size: var(--docs-dropdown-font-size);
+    font-family: inherit;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+
+    &,
+    &:hover,
+    &:focus-within {
+      box-shadow: none;
+    }
+
+    ${({variant:o})=>"dark"===o?darkDropdownStyle:""};
+  }
+
+  .dropdown-select {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    border: none;
+    appearance: none;
+    cursor: pointer;
+
+    color: var(--text-secondary);
+    line-height: inherit;
+    font-size: var(--font-size-base);
+    font-family: inherit;
+    padding: var(--docs-dropdown-padding);
+    ${({variant:o})=>"dark"===o?darkDropdownStyle:""};
+  }
+`;export const SimpleDropdown=styled(Dropdown)`
+  svg {
+    top: 60%;
+    transform: translateY(-60%);
+  }
+  label {
+    padding: 0 26px 0 4px;
+    background: transparent;
+    font-size: var(--font-size-base);
+    font-weight: var(--font-weight-regular);
+    appearance: none;
+    height: auto;
+
+    &:hover,
+    &:focus-within {
+      box-shadow: none;
+    }
+  }
+`;export const CollapsingDropdown=styled(Dropdown)`
+  svg {
+    top: 60%;
+    transform: translateY(-60%);
+  }
+  label {
+    ${darkDropdownStyle};
+
+    border-radius: var(--border-radius-lg);
+    margin-left: 5px;
+    transition: none;
+    min-width: auto;
+    background-color: ${({active:o})=>o?"var(--panel-samples-tabs-active-background-color)":"var(--bg-base)"};
+    & {
+      &[open],
+      &:focus-within,
+      &:hover {
+        background-color: var(--bg-raised);
+      }
+    }
+  }
+`;export const VersionDropdown=styled(Dropdown)`
+  width: 90%;
+  label {
+    width: 100%;
+    font-weight: 600;
+    color: var(--text-secondary);
+  }
+`;export const SchemaDiscriminatorDropdown=styled(Dropdown)`
+  .dropdown-select {
+    padding: var(--schemas-discriminator-dropdown-padding);
+  }
+
+  label {
+    height: 26px;
+    padding: var(--schemas-discriminator-dropdown-padding);
+    border: var(--schemas-discriminator-dropdown-border);
+    font-size: var(--schemas-discriminator-font-size);
+    color: var(--schemas-discriminator-dropdown-text-color);
+  }
+`;export const SchemaMimeTypeDropdown=styled(SimpleDropdown)`
+  label {
+    padding: var(--schemas-mime-type-dropdown-padding);
+    border: var(--schemas-mime-type-dropdown-border);
+    font-size: var(--schemas-mime-type-dropdown-font-size);
+    color: var(--schemas-mime-type-dropdown-text-color);
+  }
+`;
+//# sourceMappingURL=styled.js.map

package/lib-esm/components/common/Dropdown/types.d.ts

@@ -0,0 +1,25 @@
+import type React from 'react';
+export interface DropdownOption {
+    idx?: number;
+    value: string;
+    title?: string;
+    serverUrl?: string;
+    label?: string;
+}
+export interface DropdownProps {
+    options: DropdownOption[];
+    onChange: (option: DropdownOption) => void;
+    handleClear?: () => void;
+    clearable?: boolean;
+    ariaLabel?: string;
+    className?: string;
+    placeholder?: string;
+    value?: string;
+    dense?: boolean;
+    fullWidth?: boolean;
+    variant?: 'dark' | 'light';
+}
+export interface ArrowIconProps {
+    className?: string;
+    style?: React.CSSProperties;
+}