From ad926e2a846187cd0b2055efed157330943fd334 Mon Sep 17 00:00:00 2001 From: Oleksiy Kachynskyy Date: Thu, 8 Oct 2020 12:25:53 +0300 Subject: [PATCH] chore: run prettier for all files --- cli/index.ts | 18 +++---- src/common-elements/fields-layout.ts | 26 +++++----- src/common-elements/fields.ts | 14 +++--- src/common-elements/headers.ts | 2 +- src/common-elements/linkify.tsx | 6 +-- src/common-elements/panels.ts | 18 +++---- src/common-elements/perfect-scrollbar.tsx | 4 +- src/common-elements/samples.tsx | 4 +- src/common-elements/schema.ts | 14 +++--- src/common-elements/shelfs.tsx | 16 +++--- src/common-elements/tabs.ts | 14 +++--- src/components/ApiInfo/ApiInfo.tsx | 2 +- src/components/ApiInfo/styled.elements.ts | 4 +- src/components/ApiLogo/styled.elements.tsx | 8 +-- .../CallbackSamples/CallbackReqSamples.tsx | 2 +- .../CallbackSamples/CallbackSamples.tsx | 10 ++-- src/components/Callbacks/CallbacksList.tsx | 2 +- src/components/ContentItems/ContentItems.tsx | 4 +- src/components/Endpoint/Endpoint.tsx | 4 +- src/components/Endpoint/styled.elements.ts | 32 ++++++------ src/components/Fields/EnumValues.tsx | 2 +- src/components/Fields/Extensions.tsx | 4 +- src/components/Fields/Field.tsx | 2 +- src/components/Fields/FieldContstraints.tsx | 2 +- src/components/JsonViewer/JsonViewer.tsx | 4 +- src/components/JsonViewer/style.ts | 4 +- src/components/Loading/Loading.tsx | 2 +- src/components/Loading/Spinner.svg.tsx | 2 +- src/components/Markdown/AdvancedMarkdown.tsx | 6 +-- src/components/Markdown/SanitizedMdBlock.tsx | 2 +- src/components/Markdown/styled.elements.tsx | 24 ++++----- src/components/Parameters/Parameters.tsx | 9 ++-- .../PayloadSamples/PayloadSamples.tsx | 4 +- .../PayloadSamples/styled.elements.ts | 2 +- src/components/Redoc/styled.elements.tsx | 2 +- .../RequestSamples/RequestSamples.tsx | 4 +- .../ResponseSamples/ResponseSamples.tsx | 6 +-- src/components/Responses/Response.tsx | 2 +- src/components/Responses/ResponseDetails.tsx | 2 +- src/components/Responses/ResponsesList.tsx | 2 +- src/components/Schema/ArraySchema.tsx | 6 ++- src/components/Schema/ObjectSchema.tsx | 2 +- .../SchemaDefinition/SchemaDefinition.tsx | 4 +- src/components/SearchBox/SearchBox.tsx | 4 +- src/components/SearchBox/styled.elements.tsx | 22 ++++---- .../SecurityRequirement.tsx | 10 ++-- .../SecuritySchemes/SecuritySchemes.tsx | 6 +-- .../SelectOnClick/SelectOnClick.tsx | 2 +- src/components/SideMenu/SideMenu.tsx | 2 +- src/components/SideMenu/styled.elements.ts | 50 +++++++++---------- src/components/StickySidebar/ChevronSvg.tsx | 2 +- .../StickySidebar/StickyResponsiveSidebar.tsx | 10 ++-- src/services/AppStore.ts | 2 +- src/services/MarkdownRenderer.ts | 5 +- src/services/MarkerService.ts | 4 +- src/services/MenuBuilder.ts | 4 +- src/services/MenuStore.ts | 6 +-- src/services/OpenAPIParser.ts | 6 +-- src/services/RedocNormalizedOptions.ts | 4 +- src/services/SearchStore.ts | 6 +-- src/services/SearchWorker.worker.ts | 10 ++-- src/services/models/Example.ts | 4 +- src/services/models/MediaContent.ts | 4 +- src/services/models/MediaType.ts | 2 +- src/services/models/Response.ts | 2 +- src/services/models/SecurityRequirement.ts | 4 +- src/services/models/SecuritySchemes.ts | 2 +- src/styled-components.ts | 12 ++--- src/theme.ts | 16 +++--- src/utils/__tests__/openapi.test.ts | 10 ++-- src/utils/decorators.ts | 2 +- src/utils/dom.ts | 6 +-- src/utils/openapi.ts | 26 +++++----- src/utils/test-utils.ts | 2 +- 74 files changed, 277 insertions(+), 273 deletions(-) diff --git a/cli/index.ts b/cli/index.ts index 7c836f09..56902ad3 100644 --- a/cli/index.ts +++ b/cli/index.ts @@ -45,7 +45,7 @@ const BUNDLES_DIR = dirname(require.resolve('redoc')); YargsParser.command( 'serve ', 'start the server', - yargs => { + (yargs) => { yargs.positional('spec', { describe: 'path or URL to your spec', }); @@ -75,7 +75,7 @@ YargsParser.command( yargs.demandOption('spec'); return yargs; }, - async argv => { + async (argv) => { const config: Options = { ssr: argv.ssr as boolean, title: argv.title as string, @@ -97,7 +97,7 @@ YargsParser.command( .command( 'bundle ', 'bundle spec into zero-dependency HTML-file', - yargs => { + (yargs) => { yargs.positional('spec', { describe: 'path or URL to your spec', }); @@ -209,7 +209,7 @@ async function serve(port: number, pathToSpec: string, options: Options = {}) { const watcher = watch(pathToSpecDirectory, watchOptions); const log = console.log.bind(console); - const handlePath = async _path => { + const handlePath = async (_path) => { try { spec = await loadAndBundleSpec(pathToSpec); pageHTML = await getPageHTML(spec, pathToSpec, options); @@ -220,18 +220,18 @@ async function serve(port: number, pathToSpec: string, options: Options = {}) { }; watcher - .on('change', async path => { + .on('change', async (path) => { log(`${path} changed, updating docs`); handlePath(path); }) - .on('add', async path => { + .on('add', async (path) => { log(`File ${path} added, updating docs`); handlePath(path); }) - .on('addDir', path => { + .on('addDir', (path) => { log(`↗ Directory ${path} added. Files in here will trigger reload.`); }) - .on('error', error => console.error(`Watcher error: ${error}`)) + .on('error', (error) => console.error(`Watcher error: ${error}`)) .on('ready', () => log(`👀 Watching ${pathToSpecDirectory} for changes...`)); } } @@ -360,7 +360,7 @@ function escapeClosingScriptTag(str) { // see http://www.thespanner.co.uk/2011/07/25/the-json-specification-is-now-wrong/ function escapeUnicode(str) { - return str.replace(/\u2028|\u2029/g, m => '\\u202' + (m === '\u2028' ? '8' : '9')); + return str.replace(/\u2028|\u2029/g, (m) => '\\u202' + (m === '\u2028' ? '8' : '9')); } function handleError(error: Error) { diff --git a/src/common-elements/fields-layout.ts b/src/common-elements/fields-layout.ts index 533ccb01..34a45830 100644 --- a/src/common-elements/fields-layout.ts +++ b/src/common-elements/fields-layout.ts @@ -7,11 +7,11 @@ export const PropertiesTableCaption = styled.caption` text-align: right; font-size: 0.9em; font-weight: normal; - color: ${props => props.theme.colors.text.secondary}; + color: ${(props) => props.theme.colors.text.secondary}; `; export const PropertyCell = styled.td<{ kind?: string }>` - border-left: 1px solid ${props => props.theme.schema.linesColor}; + border-left: 1px solid ${(props) => props.theme.schema.linesColor}; box-sizing: border-box; position: relative; padding: 10px 10px 10px 0; @@ -29,16 +29,16 @@ export const PropertyCell = styled.td<{ kind?: string }>` to bottom, transparent 0%, transparent 22px, - ${props => props.theme.schema.linesColor} 22px, - ${props => props.theme.schema.linesColor} 100% + ${(props) => props.theme.schema.linesColor} 22px, + ${(props) => props.theme.schema.linesColor} 100% ); } tr.last > & { background-image: linear-gradient( to bottom, - ${props => props.theme.schema.linesColor} 0%, - ${props => props.theme.schema.linesColor} 22px, + ${(props) => props.theme.schema.linesColor} 0%, + ${(props) => props.theme.schema.linesColor} 22px, transparent 22px, transparent 100% ); @@ -63,7 +63,7 @@ export const PropertyNameCell = styled(PropertyCell)` line-height: 20px; white-space: nowrap; font-size: 13px; - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; &.deprecated { ${deprecatedCss}; @@ -77,7 +77,7 @@ export const PropertyNameCell = styled(PropertyCell)` export const PropertyDetailsCell = styled.td` border-bottom: 1px solid #9fb4be; padding: 10px 0; - width: ${props => props.theme.schema.defaultDetailsWidth}; + width: ${(props) => props.theme.schema.defaultDetailsWidth}; box-sizing: border-box; tr.expanded & { @@ -86,8 +86,8 @@ export const PropertyDetailsCell = styled.td` `; export const PropertyBullet = styled.span` - color: ${props => props.theme.schema.linesColor}; - font-family: ${props => props.theme.typography.code.fontFamily}; + color: ${(props) => props.theme.schema.linesColor}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; margin-right: 10px; &::before { @@ -96,7 +96,7 @@ export const PropertyBullet = styled.span` vertical-align: middle; width: 10px; height: 1px; - background: ${props => props.theme.schema.linesColor}; + background: ${(props) => props.theme.schema.linesColor}; } &::after { @@ -104,7 +104,7 @@ export const PropertyBullet = styled.span` display: inline-block; vertical-align: middle; width: 1px; - background: ${props => props.theme.schema.linesColor}; + background: ${(props) => props.theme.schema.linesColor}; height: 7px; } `; @@ -116,7 +116,7 @@ export const InnerPropertiesWrap = styled.div` export const PropertiesTable = styled.table` border-collapse: separate; border-radius: 3px; - font-size: ${props => props.theme.typography.fontSize}; + font-size: ${(props) => props.theme.typography.fontSize}; border-spacing: 0; width: 100%; diff --git a/src/common-elements/fields.ts b/src/common-elements/fields.ts index 177c3b70..29fd9a9f 100644 --- a/src/common-elements/fields.ts +++ b/src/common-elements/fields.ts @@ -10,10 +10,10 @@ export const ClickablePropertyNameCell = styled(PropertyNameCell)` border: 0; outline: 0; font-size: 13px; - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; cursor: pointer; padding: 0; - color: ${props => props.theme.colors.text.primary}; + color: ${(props) => props.theme.colors.text.primary}; &:focus { font-weight: ${({ theme }) => theme.typography.fontWeightBold}; } @@ -34,23 +34,23 @@ export const FieldLabel = styled.span` `; export const TypePrefix = styled(FieldLabel)` - color: ${props => transparentize(0.2, props.theme.schema.typeNameColor)}; + color: ${(props) => transparentize(0.2, props.theme.schema.typeNameColor)}; `; export const TypeName = styled(FieldLabel)` - color: ${props => props.theme.schema.typeNameColor}; + color: ${(props) => props.theme.schema.typeNameColor}; `; export const TypeTitle = styled(FieldLabel)` - color: ${props => props.theme.schema.typeTitleColor}; + color: ${(props) => props.theme.schema.typeTitleColor}; word-break: break-word; `; export const TypeFormat = TypeName; export const RequiredLabel = styled(FieldLabel.withComponent('div'))` - color: ${props => props.theme.schema.requireLabelColor}; - font-size: ${props => props.theme.schema.labelsTextSize}; + color: ${(props) => props.theme.schema.requireLabelColor}; + font-size: ${(props) => props.theme.schema.labelsTextSize}; font-weight: normal; margin-left: 20px; line-height: 1; diff --git a/src/common-elements/headers.ts b/src/common-elements/headers.ts index 88b1c377..ff6538e8 100644 --- a/src/common-elements/headers.ts +++ b/src/common-elements/headers.ts @@ -6,7 +6,7 @@ const headerFontSize = { 3: '1.27em', }; -export const headerCommonMixin = level => css` +export const headerCommonMixin = (level) => css` font-family: ${({ theme }) => theme.typography.headings.fontFamily}; font-weight: ${({ theme }) => theme.typography.headings.fontWeight}; font-size: ${headerFontSize[level]}; diff --git a/src/common-elements/linkify.tsx b/src/common-elements/linkify.tsx index e5d7bd62..f7f3c4bc 100644 --- a/src/common-elements/linkify.tsx +++ b/src/common-elements/linkify.tsx @@ -6,7 +6,7 @@ import styled, { css } from '../styled-components'; import { HistoryService } from '../services'; // tslint:disable-next-line -export const linkifyMixin = className => css` +export const linkifyMixin = (className) => css` ${className} { cursor: pointer; margin-left: -20px; @@ -33,7 +33,7 @@ export const linkifyMixin = className => css` } `; -const isModifiedEvent = event => +const isModifiedEvent = (event) => !!(event.metaKey || event.altKey || event.ctrlKey || event.shiftKey); export class Link extends React.Component<{ to: string; className?: string; children?: any }> { @@ -51,7 +51,7 @@ export class Link extends React.Component<{ to: string; className?: string; chil render() { return ( - {store => ( + {(store) => ( ` - width: calc(100% - ${props => props.theme.rightPanel.width}); - padding: 0 ${props => props.theme.spacing.sectionHorizontal}px; + width: calc(100% - ${(props) => props.theme.rightPanel.width}); + padding: 0 ${(props) => props.theme.spacing.sectionHorizontal}px; ${({ compact, theme }) => media.lessThan('medium', true)` @@ -14,10 +14,10 @@ export const MiddlePanel = styled.div<{ compact?: boolean }>` `}; `; -export const Section = styled.div.attrs(props => ({ +export const Section = styled.div.attrs((props) => ({ [SECTION_ATTR]: props.id, }))<{ underlined?: boolean }>` - padding: ${props => props.theme.spacing.sectionVertical}px 0; + padding: ${(props) => props.theme.spacing.sectionVertical}px 0; &:last-child { min-height: calc(100vh + 1px); @@ -48,20 +48,20 @@ export const Section = styled.div.attrs(props => ({ `; export const RightPanel = styled.div` - width: ${props => props.theme.rightPanel.width}; + width: ${(props) => props.theme.rightPanel.width}; color: ${({ theme }) => theme.rightPanel.textColor}; - background-color: ${props => props.theme.rightPanel.backgroundColor}; - padding: 0 ${props => props.theme.spacing.sectionHorizontal}px; + background-color: ${(props) => props.theme.rightPanel.backgroundColor}; + padding: 0 ${(props) => props.theme.spacing.sectionHorizontal}px; ${media.lessThan('medium', true)` width: 100%; - padding: ${props => + padding: ${(props) => `${props.theme.spacing.sectionVertical}px ${props.theme.spacing.sectionHorizontal}px`}; `}; `; export const DarkRightPanel = styled(RightPanel)` - background-color: ${props => props.theme.rightPanel.backgroundColor}; + background-color: ${(props) => props.theme.rightPanel.backgroundColor}; `; export const Row = styled.div` diff --git a/src/common-elements/perfect-scrollbar.tsx b/src/common-elements/perfect-scrollbar.tsx index 5d58b4de..0ecad2b1 100644 --- a/src/common-elements/perfect-scrollbar.tsx +++ b/src/common-elements/perfect-scrollbar.tsx @@ -46,7 +46,7 @@ export class PerfectScrollbar extends React.Component { this.inst.destroy(); } - handleRef = ref => { + handleRef = (ref) => { this._container = ref; }; @@ -73,7 +73,7 @@ export function PerfectScrollbarWrap( ) { return ( - {options => + {(options) => !options.nativeScrollbars ? ( {props.children} ) : ( diff --git a/src/common-elements/samples.tsx b/src/common-elements/samples.tsx index 329ec88f..291f8c7d 100644 --- a/src/common-elements/samples.tsx +++ b/src/common-elements/samples.tsx @@ -33,8 +33,8 @@ export const SampleControlsWrap = styled.div` `; export const StyledPre = styled(PrismDiv.withComponent('pre'))` - font-family: ${props => props.theme.typography.code.fontFamily}; - font-size: ${props => props.theme.typography.code.fontSize}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; + font-size: ${(props) => props.theme.typography.code.fontSize}; overflow-x: auto; margin: 0; diff --git a/src/common-elements/schema.ts b/src/common-elements/schema.ts index d422ba57..3a06830b 100644 --- a/src/common-elements/schema.ts +++ b/src/common-elements/schema.ts @@ -9,8 +9,8 @@ export const OneOfList = styled.div` export const OneOfLabel = styled.span` font-size: 0.9em; margin-right: 10px; - color: ${props => props.theme.colors.primary.main}; - font-family: ${props => props.theme.typography.headings.fontFamily}; + color: ${(props) => props.theme.colors.primary.main}; + font-family: ${(props) => props.theme.typography.headings.fontFamily}; } `; @@ -20,15 +20,15 @@ export const OneOfButton = styled.button<{ active: boolean }>` margin-bottom: 5px; font-size: 0.8em; cursor: pointer; - border: 1px solid ${props => props.theme.colors.primary.main}; + border: 1px solid ${(props) => props.theme.colors.primary.main}; padding: 2px 10px; line-height: 1.5em; outline: none; &:focus { - box-shadow: 0 0 0 1px ${props => props.theme.colors.primary.main}; + box-shadow: 0 0 0 1px ${(props) => props.theme.colors.primary.main}; } - ${props => { + ${(props) => { if (props.active) { return ` color: white; @@ -49,7 +49,7 @@ export const OneOfButton = styled.button<{ active: boolean }>` export const ArrayOpenningLabel = styled.div` font-size: 0.9em; - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; &::after { content: ' ['; } @@ -57,7 +57,7 @@ export const ArrayOpenningLabel = styled.div` export const ArrayClosingLabel = styled.div` font-size: 0.9em; - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; &::after { content: ']'; } diff --git a/src/common-elements/shelfs.tsx b/src/common-elements/shelfs.tsx index 0cc7e767..ded58278 100644 --- a/src/common-elements/shelfs.tsx +++ b/src/common-elements/shelfs.tsx @@ -35,15 +35,15 @@ class IntShelfIcon extends React.PureComponent<{ } export const ShelfIcon = styled(IntShelfIcon)` - height: ${props => props.size || '18px'}; - width: ${props => props.size || '18px'}; + height: ${(props) => props.size || '18px'}; + width: ${(props) => props.size || '18px'}; vertical-align: middle; - float: ${props => props.float || ''}; + float: ${(props) => props.float || ''}; transition: transform 0.2s ease-out; - transform: rotateZ(${props => directionMap[props.direction || 'down']}); + transform: rotateZ(${(props) => directionMap[props.direction || 'down']}); polygon { - fill: ${props => + fill: ${(props) => (props.color && props.theme.colors[props.color] && props.theme.colors[props.color].main) || props.color}; } @@ -53,9 +53,9 @@ export const Badge = styled.span<{ type: string }>` display: inline-block; padding: 2px 8px; margin: 0; - background-color: ${props => props.theme.colors[props.type].main}; - color: ${props => props.theme.colors[props.type].contrastText}; - font-size: ${props => props.theme.typography.code.fontSize}; + background-color: ${(props) => props.theme.colors[props.type].main}; + color: ${(props) => props.theme.colors[props.type].contrastText}; + font-size: ${(props) => props.theme.typography.code.fontSize}; vertical-align: middle; line-height: 1.6; border-radius: 4px; diff --git a/src/common-elements/tabs.ts b/src/common-elements/tabs.ts index 1c4ef1b9..2d006758 100644 --- a/src/common-elements/tabs.ts +++ b/src/common-elements/tabs.ts @@ -31,7 +31,7 @@ export const Tabs = styled(ReactTabs)` font-weight: bold; &.react-tabs__tab--selected { - color: ${props => props.theme.colors.text.primary}; + color: ${(props) => props.theme.colors.text.primary}; background: ${({ theme }) => theme.rightPanel.textColor}; &:focus { outline: auto; @@ -44,19 +44,19 @@ export const Tabs = styled(ReactTabs)` } &.tab-success { - color: ${props => props.theme.colors.responses.success.color}; + color: ${(props) => props.theme.colors.responses.success.color}; } &.tab-redirect { - color: ${props => props.theme.colors.responses.redirect.color}; + color: ${(props) => props.theme.colors.responses.redirect.color}; } &.tab-info { - color: ${props => props.theme.colors.responses.info.color}; + color: ${(props) => props.theme.colors.responses.info.color}; } &.tab-error { - color: ${props => props.theme.colors.responses.error.color}; + color: ${(props) => props.theme.colors.responses.error.color}; } } } @@ -64,7 +64,7 @@ export const Tabs = styled(ReactTabs)` background: ${({ theme }) => theme.codeBlock.backgroundColor}; & > div, & > pre { - padding: ${props => props.theme.spacing.unit * 4}px; + padding: ${(props) => props.theme.spacing.unit * 4}px; margin: 0; } @@ -101,7 +101,7 @@ export const SmallTabs = styled(Tabs)` > .react-tabs__tab-panel { & > div, & > pre { - padding: ${props => props.theme.spacing.unit * 2}px 0; + padding: ${(props) => props.theme.spacing.unit * 2}px 0; } } `; diff --git a/src/components/ApiInfo/ApiInfo.tsx b/src/components/ApiInfo/ApiInfo.tsx index 91a1de22..ff8a3e36 100644 --- a/src/components/ApiInfo/ApiInfo.tsx +++ b/src/components/ApiInfo/ApiInfo.tsx @@ -21,7 +21,7 @@ export interface ApiInfoProps { @observer export class ApiInfo extends React.Component { - handleDownloadClick = e => { + handleDownloadClick = (e) => { if (!e.target.href) { e.target.href = this.props.store.spec.info.downloadLink; } diff --git a/src/components/ApiInfo/styled.elements.ts b/src/components/ApiInfo/styled.elements.ts index 72bebcd4..7b4a9dcd 100644 --- a/src/components/ApiInfo/styled.elements.ts +++ b/src/components/ApiInfo/styled.elements.ts @@ -13,8 +13,8 @@ export const ApiHeader = styled(H1)` `; export const DownloadButton = styled.a` - border: 1px solid ${props => props.theme.colors.primary.main}; - color: ${props => props.theme.colors.primary.main}; + border: 1px solid ${(props) => props.theme.colors.primary.main}; + color: ${(props) => props.theme.colors.primary.main}; font-weight: normal; margin-left: 0.5em; padding: 4px 8px 4px; diff --git a/src/components/ApiLogo/styled.elements.tsx b/src/components/ApiLogo/styled.elements.tsx index cf12356a..8ba0b61d 100644 --- a/src/components/ApiLogo/styled.elements.tsx +++ b/src/components/ApiLogo/styled.elements.tsx @@ -2,9 +2,9 @@ import * as React from 'react'; import styled from '../../styled-components'; export const LogoImgEl = styled.img` - max-height: ${props => props.theme.logo.maxHeight}; - max-width: ${props => props.theme.logo.maxWidth}; - padding: ${props => props.theme.logo.gutter}; + max-height: ${(props) => props.theme.logo.maxHeight}; + max-width: ${(props) => props.theme.logo.maxWidth}; + padding: ${(props) => props.theme.logo.gutter}; width: 100%; display: block; `; @@ -17,4 +17,4 @@ const Link = styled.a` display: inline-block; `; -export const LinkWrap = url => Component => {Component}; +export const LinkWrap = (url) => (Component) => {Component}; diff --git a/src/components/CallbackSamples/CallbackReqSamples.tsx b/src/components/CallbackSamples/CallbackReqSamples.tsx index e7a51723..86732bae 100644 --- a/src/components/CallbackSamples/CallbackReqSamples.tsx +++ b/src/components/CallbackSamples/CallbackReqSamples.tsx @@ -14,7 +14,7 @@ export interface PayloadSampleProps { export class CallbackPayloadSample extends React.Component { render() { - const payloadSample = this.props.callback.codeSamples.find(sample => + const payloadSample = this.props.callback.codeSamples.find((sample) => isPayloadSample(sample), ) as XPayloadSample | undefined; diff --git a/src/components/CallbackSamples/CallbackSamples.tsx b/src/components/CallbackSamples/CallbackSamples.tsx index fe7cab33..0c28bba1 100644 --- a/src/components/CallbackSamples/CallbackSamples.tsx +++ b/src/components/CallbackSamples/CallbackSamples.tsx @@ -20,7 +20,7 @@ export class CallbackSamples extends React.Component { static contextType = OptionsContext; context: RedocNormalizedOptions; - private renderDropdown = props => { + private renderDropdown = (props) => { return ; }; @@ -32,10 +32,10 @@ export class CallbackSamples extends React.Component { } const operations = callbacks - .map(callback => callback.operations.map(operation => operation)) + .map((callback) => callback.operations.map((operation) => operation)) .reduce((a, b) => a.concat(b), []); - const hasSamples = operations.some(operation => operation.codeSamples.length > 0); + const hasSamples = operations.some((operation) => operation.codeSamples.length > 0); if (!hasSamples) { return null; @@ -59,7 +59,7 @@ export class CallbackSamples extends React.Component { label={'Callback'} options={dropdownOptions} > - {callback => ( + {(callback) => ( { export const SamplesWrapper = styled.div` background: ${({ theme }) => theme.codeBlock.backgroundColor}; - padding: ${props => props.theme.spacing.unit * 4}px; + padding: ${(props) => props.theme.spacing.unit * 4}px; `; diff --git a/src/components/Callbacks/CallbacksList.tsx b/src/components/Callbacks/CallbacksList.tsx index 8ef40654..6c15a668 100644 --- a/src/components/Callbacks/CallbacksList.tsx +++ b/src/components/Callbacks/CallbacksList.tsx @@ -19,7 +19,7 @@ export class CallbacksList extends React.PureComponent { return (
Callbacks - {callbacks.map(callback => { + {callbacks.map((callback) => { return callback.operations.map((operation, index) => { return ( diff --git a/src/components/ContentItems/ContentItems.tsx b/src/components/ContentItems/ContentItems.tsx index 2766887a..616120b6 100644 --- a/src/components/ContentItems/ContentItems.tsx +++ b/src/components/ContentItems/ContentItems.tsx @@ -17,7 +17,7 @@ export class ContentItems extends React.Component<{ if (items.length === 0) { return null; } - return items.map(item => { + return items.map((item) => { return ; }); } @@ -61,7 +61,7 @@ export class ContentItem extends React.Component { } } -const middlePanelWrap = component => {component}; +const middlePanelWrap = (component) => {component}; @observer export class SectionItem extends React.Component { diff --git a/src/components/Endpoint/Endpoint.tsx b/src/components/Endpoint/Endpoint.tsx index 9e9a5f92..69844c73 100644 --- a/src/components/Endpoint/Endpoint.tsx +++ b/src/components/Endpoint/Endpoint.tsx @@ -47,7 +47,7 @@ export class Endpoint extends React.Component { // TODO: highlight server variables, e.g. https://{user}.test.com return ( - {options => ( + {(options) => ( @@ -63,7 +63,7 @@ export class Endpoint extends React.Component { /> - {operation.servers.map(server => { + {operation.servers.map((server) => { const normalizedUrl = options.expandDefaultServerVariables ? expandDefaultServerVariables(server.url, server.variables) : server.url; diff --git a/src/components/Endpoint/styled.elements.ts b/src/components/Endpoint/styled.elements.ts index 041de2d4..487c6312 100644 --- a/src/components/Endpoint/styled.elements.ts +++ b/src/components/Endpoint/styled.elements.ts @@ -7,7 +7,7 @@ export const OperationEndpointWrap = styled.div` `; export const ServerRelativeURL = styled.span` - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; margin-left: 10px; flex: 1; overflow-x: hidden; @@ -20,22 +20,22 @@ export const EndpointInfo = styled.button<{ expanded?: boolean; inverted?: boole width: 100%; text-align: left; cursor: pointer; - padding: 10px 30px 10px ${props => (props.inverted ? '10px' : '20px')}; - border-radius: ${props => (props.inverted ? '0' : '4px 4px 0 0')}; - background-color: ${props => + padding: 10px 30px 10px ${(props) => (props.inverted ? '10px' : '20px')}; + border-radius: ${(props) => (props.inverted ? '0' : '4px 4px 0 0')}; + background-color: ${(props) => props.inverted ? 'transparent' : props.theme.codeBlock.backgroundColor}; display: flex; white-space: nowrap; align-items: center; - border: ${props => (props.inverted ? '0' : '1px solid transparent')}; - border-bottom: ${props => (props.inverted ? '1px solid #ccc' : '0')}; + border: ${(props) => (props.inverted ? '0' : '1px solid transparent')}; + border-bottom: ${(props) => (props.inverted ? '1px solid #ccc' : '0')}; transition: border-color 0.25s ease; - ${props => + ${(props) => (props.expanded && !props.inverted && `border-color: ${props.theme.colors.border.dark};`) || ''} .${ServerRelativeURL} { - color: ${props => (props.inverted ? props.theme.colors.text.primary : '#ffffff')} + color: ${(props) => (props.inverted ? props.theme.colors.text.primary : '#ffffff')} } &:focus { box-shadow: inset 0 2px 2px rgba(0, 0, 0, 0.45), 0 2px 0 rgba(128, 128, 128, 0.25); @@ -45,13 +45,13 @@ export const EndpointInfo = styled.button<{ expanded?: boolean; inverted?: boole export const HttpVerb = styled.span.attrs((props: { type: string; compact?: boolean }) => ({ className: `http-verb ${props.type}`, }))<{ type: string; compact?: boolean }>` - font-size: ${props => (props.compact ? '0.8em' : '0.929em')}; - line-height: ${props => (props.compact ? '18px' : '20px')}; - background-color: ${props => props.theme.colors.http[props.type] || '#999999'}; + font-size: ${(props) => (props.compact ? '0.8em' : '0.929em')}; + line-height: ${(props) => (props.compact ? '18px' : '20px')}; + background-color: ${(props) => props.theme.colors.http[props.type] || '#999999'}; color: #ffffff; - padding: ${props => (props.compact ? '2px 8px' : '3px 10px')}; + padding: ${(props) => (props.compact ? '2px 8px' : '3px 10px')}; text-transform: uppercase; - font-family: ${props => props.theme.typography.headings.fontFamily}; + font-family: ${(props) => props.theme.typography.headings.fontFamily}; margin: 0; `; @@ -68,7 +68,7 @@ export const ServersOverlay = styled.div<{ expanded: boolean }>` border-bottom-right-radius: 4px; transition: all 0.25s ease; visibility: hidden; - ${props => (props.expanded ? 'visibility: visible;' : 'transform: translateY(-50%) scaleY(0);')} + ${(props) => (props.expanded ? 'visibility: visible;' : 'transform: translateY(-50%) scaleY(0);')} `; export const ServerItem = styled.div` @@ -80,8 +80,8 @@ export const ServerUrl = styled.div` border: 1px solid #ccc; background: #fff; word-break: break-all; - color: ${props => props.theme.colors.primary.main}; + color: ${(props) => props.theme.colors.primary.main}; > span { - color: ${props => props.theme.colors.text.primary}; + color: ${(props) => props.theme.colors.text.primary}; } `; diff --git a/src/components/Fields/EnumValues.tsx b/src/components/Fields/EnumValues.tsx index 978426f6..6417757b 100644 --- a/src/components/Fields/EnumValues.tsx +++ b/src/components/Fields/EnumValues.tsx @@ -81,7 +81,7 @@ export class EnumValues extends React.PureComponent props.theme.colors.primary.main}; + color: ${(props) => props.theme.colors.primary.main}; vertical-align: middle; font-size: 13px; line-height: 20px; diff --git a/src/components/Fields/Extensions.tsx b/src/components/Fields/Extensions.tsx index 5a450ce4..9b26e69c 100644 --- a/src/components/Fields/Extensions.tsx +++ b/src/components/Fields/Extensions.tsx @@ -23,10 +23,10 @@ export class Extensions extends React.PureComponent { const exts = this.props.extensions; return ( - {options => ( + {(options) => ( <> {options.showExtensions && - Object.keys(exts).map(key => ( + Object.keys(exts).map((key) => ( {key.substring(2)}: {' '} diff --git a/src/components/Fields/Field.tsx b/src/components/Fields/Field.tsx index 53bedc77..bce4cde9 100644 --- a/src/components/Fields/Field.tsx +++ b/src/components/Fields/Field.tsx @@ -38,7 +38,7 @@ export class Field extends React.Component { } }; - handleKeyPress = e => { + handleKeyPress = (e) => { if (e.key === 'Enter') { e.preventDefault(); this.toggle(); diff --git a/src/components/Fields/FieldContstraints.tsx b/src/components/Fields/FieldContstraints.tsx index c92e8f5c..246249c6 100644 --- a/src/components/Fields/FieldContstraints.tsx +++ b/src/components/Fields/FieldContstraints.tsx @@ -13,7 +13,7 @@ export class ConstraintsView extends React.PureComponent { return ( {' '} - {this.props.constraints.map(constraint => ( + {this.props.constraints.map((constraint) => ( {constraint} ))} diff --git a/src/components/JsonViewer/JsonViewer.tsx b/src/components/JsonViewer/JsonViewer.tsx index 0ef0da51..36c20b83 100644 --- a/src/components/JsonViewer/JsonViewer.tsx +++ b/src/components/JsonViewer/JsonViewer.tsx @@ -34,11 +34,11 @@ class Json extends React.PureComponent { - {options => ( + {(options) => ( (this.node = node!)} + ref={(node) => (this.node = node!)} dangerouslySetInnerHTML={{ __html: jsonToHTML(this.props.data, options.jsonSampleExpandLevel), }} diff --git a/src/components/JsonViewer/style.ts b/src/components/JsonViewer/style.ts index 14ef6492..4437e6e3 100644 --- a/src/components/JsonViewer/style.ts +++ b/src/components/JsonViewer/style.ts @@ -5,8 +5,8 @@ export const jsonStyles = css` display: none; } - font-family: ${props => props.theme.typography.code.fontFamily}; - font-size: ${props => props.theme.typography.code.fontSize}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; + font-size: ${(props) => props.theme.typography.code.fontSize}; white-space: ${({ theme }) => (theme.typography.code.wrap ? 'pre-wrap' : 'pre')}; contain: content; diff --git a/src/components/Loading/Loading.tsx b/src/components/Loading/Loading.tsx index ac1ced11..59bd526d 100644 --- a/src/components/Loading/Loading.tsx +++ b/src/components/Loading/Loading.tsx @@ -9,7 +9,7 @@ const LoadingMessage = styled.div<{ color: string }>` text-align: center; font-size: 25px; margin: 30px 0 20px 0; - color: ${props => props.color}; + color: ${(props) => props.color}; `; export interface LoadingProps { diff --git a/src/components/Loading/Spinner.svg.tsx b/src/components/Loading/Spinner.svg.tsx index fd9d73d8..a040ed8a 100644 --- a/src/components/Loading/Spinner.svg.tsx +++ b/src/components/Loading/Spinner.svg.tsx @@ -31,6 +31,6 @@ export const Spinner = styled(_Spinner)` margin-left: -25px; path { - fill: ${props => props.color}; + fill: ${(props) => props.color}; } `; diff --git a/src/components/Markdown/AdvancedMarkdown.tsx b/src/components/Markdown/AdvancedMarkdown.tsx index 18bc3f33..3d19ed3b 100644 --- a/src/components/Markdown/AdvancedMarkdown.tsx +++ b/src/components/Markdown/AdvancedMarkdown.tsx @@ -15,15 +15,15 @@ export class AdvancedMarkdown extends React.Component { render() { return ( - {options => ( - {store => this.renderWithOptionsAndStore(options, store)} + {(options) => ( + {(store) => this.renderWithOptionsAndStore(options, store)} )} ); } renderWithOptionsAndStore(options: RedocNormalizedOptions, store?: AppStore) { - const { source, htmlWrap = i => i } = this.props; + const { source, htmlWrap = (i) => i } = this.props; if (!store) { throw new Error('When using components in markdown, store prop must be provided'); } diff --git a/src/components/Markdown/SanitizedMdBlock.tsx b/src/components/Markdown/SanitizedMdBlock.tsx index a3c44e05..4c43a9b8 100644 --- a/src/components/Markdown/SanitizedMdBlock.tsx +++ b/src/components/Markdown/SanitizedMdBlock.tsx @@ -16,7 +16,7 @@ export function SanitizedMarkdownHTML( return ( - {options => ( + {(options) => ( props.theme.typography.links.color}; + color: ${(props) => props.theme.typography.links.color}; &:visited { - color: ${props => props.theme.typography.links.visited}; + color: ${(props) => props.theme.typography.links.visited}; } &:hover { - color: ${props => props.theme.typography.links.hover}; + color: ${(props) => props.theme.typography.links.hover}; } } `; @@ -27,9 +27,9 @@ export const StyledMarkdownBlock = styled( >, )` - font-family: ${props => props.theme.typography.fontFamily}; - font-weight: ${props => props.theme.typography.fontWeightRegular}; - line-height: ${props => props.theme.typography.lineHeight}; + font-family: ${(props) => props.theme.typography.fontFamily}; + font-weight: ${(props) => props.theme.typography.fontWeightRegular}; + line-height: ${(props) => props.theme.typography.lineHeight}; p { &:last-child { @@ -56,35 +56,35 @@ export const StyledMarkdownBlock = styled( h1 { ${headerCommonMixin(1)}; - color: ${props => props.theme.colors.primary.main}; + color: ${(props) => props.theme.colors.primary.main}; margin-top: 0; } h2 { ${headerCommonMixin(2)}; - color: ${props => props.theme.colors.text.primary}; + color: ${(props) => props.theme.colors.text.primary}; } code { color: ${({ theme }) => theme.typography.code.color}; background-color: ${({ theme }) => theme.typography.code.backgroundColor}; - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; border-radius: 2px; border: 1px solid rgba(38, 50, 56, 0.1); padding: 0 ${({ theme }) => theme.spacing.unit}px; - font-size: ${props => props.theme.typography.code.fontSize}; + font-size: ${(props) => props.theme.typography.code.fontSize}; font-weight: ${({ theme }) => theme.typography.code.fontWeight}; word-break: break-word; } pre { - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; white-space:${({ theme }) => (theme.typography.code.wrap ? 'pre-wrap' : 'pre')}; background-color: ${({ theme }) => theme.codeBlock.backgroundColor}; color: white; - padding: ${props => props.theme.spacing.unit * 4}px; + padding: ${(props) => props.theme.spacing.unit * 4}px; overflow-x: auto; line-height: normal; border-radius: 0px diff --git a/src/components/Parameters/Parameters.tsx b/src/components/Parameters/Parameters.tsx index 17ab9c48..053dbbaa 100644 --- a/src/components/Parameters/Parameters.tsx +++ b/src/components/Parameters/Parameters.tsx @@ -28,7 +28,7 @@ const PARAM_PLACES = ['path', 'query', 'cookie', 'header']; export class Parameters extends React.PureComponent { orderParams(params: FieldModel[]): Record { const res = {}; - params.forEach(param => { + params.forEach((param) => { safePush(res, param.in, param); }); return res; @@ -50,7 +50,7 @@ export class Parameters extends React.PureComponent { return ( <> - {paramsPlaces.map(place => ( + {paramsPlaces.map((place) => ( ))} {bodyContent && } @@ -67,7 +67,10 @@ function DropdownWithinHeader(props) { ); } -export function BodyContent(props: { content: MediaContentModel; description?: string }): JSX.Element { +export function BodyContent(props: { + content: MediaContentModel; + description?: string; +}): JSX.Element { const { content, description } = props; return ( diff --git a/src/components/PayloadSamples/PayloadSamples.tsx b/src/components/PayloadSamples/PayloadSamples.tsx index 7e2a85f0..4489f488 100644 --- a/src/components/PayloadSamples/PayloadSamples.tsx +++ b/src/components/PayloadSamples/PayloadSamples.tsx @@ -21,7 +21,7 @@ export class PayloadSamples extends React.Component { return ( - {mediaType => ( + {(mediaType) => ( { ); } - private renderDropdown = props => { + private renderDropdown = (props) => { return ; }; } diff --git a/src/components/PayloadSamples/styled.elements.ts b/src/components/PayloadSamples/styled.elements.ts index fa7f9120..ccf91a6a 100644 --- a/src/components/PayloadSamples/styled.elements.ts +++ b/src/components/PayloadSamples/styled.elements.ts @@ -71,7 +71,7 @@ export const InvertedSimpleDropdown = styled(StyledDropdown)` `; export const NoSampleLabel = styled.div` - font-family: ${props => props.theme.typography.code.fontFamily}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; font-size: 12px; color: #ee807f; `; diff --git a/src/components/Redoc/styled.elements.tsx b/src/components/Redoc/styled.elements.tsx index 4118384e..bc9dd4bf 100644 --- a/src/components/Redoc/styled.elements.tsx +++ b/src/components/Redoc/styled.elements.tsx @@ -29,7 +29,7 @@ export const ApiContentWrap = styled.div` z-index: 1; position: relative; overflow: hidden; - width: calc(100% - ${props => props.theme.sidebar.width}); + width: calc(100% - ${(props) => props.theme.sidebar.width}); ${media.lessThan('small', true)` width: 100%; `}; diff --git a/src/components/RequestSamples/RequestSamples.tsx b/src/components/RequestSamples/RequestSamples.tsx index 89b12d74..a7c7f831 100644 --- a/src/components/RequestSamples/RequestSamples.tsx +++ b/src/components/RequestSamples/RequestSamples.tsx @@ -30,13 +30,13 @@ export class RequestSamples extends React.Component { - {samples.map(sample => ( + {samples.map((sample) => ( {isPayloadSample(sample) ? (
diff --git a/src/components/ResponseSamples/ResponseSamples.tsx b/src/components/ResponseSamples/ResponseSamples.tsx index 3f9eefa0..7f96fc22 100644 --- a/src/components/ResponseSamples/ResponseSamples.tsx +++ b/src/components/ResponseSamples/ResponseSamples.tsx @@ -16,7 +16,7 @@ export class ResponseSamples extends React.Component { render() { const { operation } = this.props; - const responses = operation.responses.filter(response => { + const responses = operation.responses.filter((response) => { return response.content && response.content.hasSample; }); @@ -27,13 +27,13 @@ export class ResponseSamples extends React.Component { - {responses.map(response => ( + {responses.map((response) => ( {response.code} ))} - {responses.map(response => ( + {responses.map((response) => (
diff --git a/src/components/Responses/Response.tsx b/src/components/Responses/Response.tsx index 58e0ae32..e569a0df 100644 --- a/src/components/Responses/Response.tsx +++ b/src/components/Responses/Response.tsx @@ -14,7 +14,7 @@ export class ResponseView extends React.Component<{ response: ResponseModel }> { render() { const { headers, type, summary, description, code, expanded, content } = this.props.response; const mimes = - content === undefined ? [] : content.mediaTypes.filter(mime => mime.schema !== undefined); + content === undefined ? [] : content.mediaTypes.filter((mime) => mime.schema !== undefined); const empty = headers.length === 0 && mimes.length === 0 && !description; diff --git a/src/components/Responses/ResponseDetails.tsx b/src/components/Responses/ResponseDetails.tsx index 821fc2da..193059e4 100644 --- a/src/components/Responses/ResponseDetails.tsx +++ b/src/components/Responses/ResponseDetails.tsx @@ -26,7 +26,7 @@ export class ResponseDetails extends React.PureComponent<{ response: ResponseMod ); } - private renderDropdown = props => { + private renderDropdown = (props) => { return ( Response Schema: diff --git a/src/components/Responses/ResponsesList.tsx b/src/components/Responses/ResponsesList.tsx index 157aca58..d3e85bd4 100644 --- a/src/components/Responses/ResponsesList.tsx +++ b/src/components/Responses/ResponsesList.tsx @@ -27,7 +27,7 @@ export class ResponsesList extends React.PureComponent { return (
{isCallback ? 'Callback responses' : 'Responses'} - {responses.map(response => { + {responses.map((response) => { return ; })}
diff --git a/src/components/Schema/ArraySchema.tsx b/src/components/Schema/ArraySchema.tsx index 48e7dc41..6e5d1a6c 100644 --- a/src/components/Schema/ArraySchema.tsx +++ b/src/components/Schema/ArraySchema.tsx @@ -4,7 +4,7 @@ import { Schema, SchemaProps } from './Schema'; import { ArrayClosingLabel, ArrayOpenningLabel } from '../../common-elements'; import styled from '../../styled-components'; -import {humanizeConstraints} from "../../utils"; +import { humanizeConstraints } from '../../utils'; const PaddedSchema = styled.div` padding-left: ${({ theme }) => theme.spacing.unit * 2}px; @@ -18,7 +18,9 @@ export class ArraySchema extends React.PureComponent { max: number | undefined = undefined, ) => ({ type: 'array', minItems: min, maxItems: max }); - const minMaxItems = humanizeConstraints(itemConstraintSchema(itemsSchema.schema.minItems, itemsSchema.schema.maxItems)); + const minMaxItems = humanizeConstraints( + itemConstraintSchema(itemsSchema.schema.minItems, itemsSchema.schema.maxItems), + ); return (
diff --git a/src/components/Schema/ObjectSchema.tsx b/src/components/Schema/ObjectSchema.tsx index 66f6034a..1c760b6c 100644 --- a/src/components/Schema/ObjectSchema.tsx +++ b/src/components/Schema/ObjectSchema.tsx @@ -36,7 +36,7 @@ export class ObjectSchema extends React.Component { const needFilter = this.props.skipReadOnly || this.props.skipWriteOnly; const filteredFields = needFilter - ? fields.filter(item => { + ? fields.filter((item) => { return !( (this.props.skipReadOnly && item.schema.readOnly) || (this.props.skipWriteOnly && item.schema.writeOnly) diff --git a/src/components/SchemaDefinition/SchemaDefinition.tsx b/src/components/SchemaDefinition/SchemaDefinition.tsx index 69308dfd..adde3bc1 100644 --- a/src/components/SchemaDefinition/SchemaDefinition.tsx +++ b/src/components/SchemaDefinition/SchemaDefinition.tsx @@ -74,7 +74,7 @@ export class SchemaDefinition extends React.PureComponent { + private renderDropdown = (props) => { return ; }; } @@ -83,7 +83,7 @@ const MediaSamplesWrap = styled.div` background: ${({ theme }) => theme.codeBlock.backgroundColor}; & > div, & > pre { - padding: ${props => props.theme.spacing.unit * 4}px; + padding: ${(props) => props.theme.spacing.unit * 4}px; margin: 0; } diff --git a/src/components/SearchBox/SearchBox.tsx b/src/components/SearchBox/SearchBox.tsx index 5476dc9b..836bb9a2 100644 --- a/src/components/SearchBox/SearchBox.tsx +++ b/src/components/SearchBox/SearchBox.tsx @@ -102,7 +102,7 @@ export class SearchBox extends React.PureComponent { + this.props.search.search(searchTerm).then((res) => { this.setResults(res, searchTerm); }); } @@ -124,7 +124,7 @@ export class SearchBox extends React.PureComponent ({ + const results = this.state.results.map((res) => ({ item: this.props.getItemById(res.meta)!, score: res.score, })); diff --git a/src/components/SearchBox/styled.elements.tsx b/src/components/SearchBox/styled.elements.tsx index 22aae826..6bc9dd4e 100644 --- a/src/components/SearchBox/styled.elements.tsx +++ b/src/components/SearchBox/styled.elements.tsx @@ -11,11 +11,11 @@ export const SearchWrap = styled.div` export const SearchInput = styled.input.attrs(() => ({ className: 'search-input', }))` - width: calc(100% - ${props => props.theme.spacing.unit * 8}px); + width: calc(100% - ${(props) => props.theme.spacing.unit * 8}px); box-sizing: border-box; - margin: 0 ${props => props.theme.spacing.unit * 4}px; - padding: 5px ${props => props.theme.spacing.unit * 2}px 5px - ${props => props.theme.spacing.unit * 4}px; + margin: 0 ${(props) => props.theme.spacing.unit * 4}px; + padding: 5px ${(props) => props.theme.spacing.unit * 2}px 5px + ${(props) => props.theme.spacing.unit * 4}px; border: 0; border-bottom: 1px solid ${({ theme }) => @@ -26,7 +26,7 @@ export const SearchInput = styled.input.attrs(() => ({ font-family: ${({ theme }) => theme.typography.fontFamily}; font-weight: bold; font-size: 13px; - color: ${props => props.theme.sidebar.textColor}; + color: ${(props) => props.theme.sidebar.textColor}; background-color: transparent; outline: none; `; @@ -46,19 +46,19 @@ export const SearchIcon = styled((props: { className?: string }) => ( className: 'search-icon', })` position: absolute; - left: ${props => props.theme.spacing.unit * 4}px; + left: ${(props) => props.theme.spacing.unit * 4}px; height: 1.8em; width: 0.9em; path { - fill: ${props => props.theme.sidebar.textColor}; + fill: ${(props) => props.theme.sidebar.textColor}; } `; export const SearchResultsBox = styled.div` - padding: ${props => props.theme.spacing.unit}px 0; + padding: ${(props) => props.theme.spacing.unit}px 0; background-color: ${({ theme }) => darken(0.05, theme.sidebar.backgroundColor)}}; - color: ${props => props.theme.sidebar.textColor}; + color: ${(props) => props.theme.sidebar.textColor}; min-height: 150px; max-height: 250px; border-top: ${({ theme }) => darken(0.1, theme.sidebar.backgroundColor)}}; @@ -85,9 +85,9 @@ export const SearchResultsBox = styled.div` export const ClearIcon = styled.i` position: absolute; display: inline-block; - width: ${props => props.theme.spacing.unit * 2}px; + width: ${(props) => props.theme.spacing.unit * 2}px; text-align: center; - right: ${props => props.theme.spacing.unit * 4}px; + right: ${(props) => props.theme.spacing.unit * 4}px; line-height: 2em; vertical-align: middle; margin-right: 2px; diff --git a/src/components/SecurityRequirement/SecurityRequirement.tsx b/src/components/SecurityRequirement/SecurityRequirement.tsx index e6aafb30..2904f182 100644 --- a/src/components/SecurityRequirement/SecurityRequirement.tsx +++ b/src/components/SecurityRequirement/SecurityRequirement.tsx @@ -8,8 +8,8 @@ import { SecurityRequirementModel } from '../../services/models/SecurityRequirem import { linksCss } from '../Markdown/styled.elements'; const ScopeName = styled.code` - font-size: ${props => props.theme.typography.code.fontSize}; - font-family: ${props => props.theme.typography.code.fontFamily}; + font-size: ${(props) => props.theme.typography.code.fontSize}; + font-family: ${(props) => props.theme.typography.code.fontFamily}; border: 1px solid ${({ theme }) => theme.colors.border.dark}; margin: 0 3px; padding: 0.2em; @@ -67,12 +67,12 @@ export class SecurityRequirement extends React.PureComponent - {security.schemes.map(scheme => { + {security.schemes.map((scheme) => { return ( {scheme.id} {scheme.scopes.length > 0 && ' ('} - {scheme.scopes.map(scope => ( + {scheme.scopes.map((scope) => ( {scope} ))} {scheme.scopes.length > 0 && ') '} @@ -89,7 +89,7 @@ const AuthHeaderColumn = styled.div` `; const SecuritiesColumn = styled.div` - width: ${props => props.theme.schema.defaultDetailsWidth}; + width: ${(props) => props.theme.schema.defaultDetailsWidth}; `; const AuthHeader = styled(UnderlinedHeader)` diff --git a/src/components/SecuritySchemes/SecuritySchemes.tsx b/src/components/SecuritySchemes/SecuritySchemes.tsx index 91fac68e..422cd4f1 100644 --- a/src/components/SecuritySchemes/SecuritySchemes.tsx +++ b/src/components/SecuritySchemes/SecuritySchemes.tsx @@ -49,7 +49,7 @@ export class OAuthFlow extends React.PureComponent { Scopes:
    - {Object.keys(flow!.scopes || {}).map(scope => ( + {Object.keys(flow!.scopes || {}).map((scope) => (
  • {scope} -
  • @@ -67,7 +67,7 @@ export interface SecurityDefsProps { export class SecurityDefs extends React.PureComponent { render() { - return this.props.securitySchemes.schemes.map(scheme => ( + return this.props.securitySchemes.schemes.map((scheme) => (
    @@ -115,7 +115,7 @@ export class SecurityDefs extends React.PureComponent { ) : scheme.flows ? ( - Object.keys(scheme.flows).map(type => ( + Object.keys(scheme.flows).map((type) => ( )) ) : null} diff --git a/src/components/SelectOnClick/SelectOnClick.tsx b/src/components/SelectOnClick/SelectOnClick.tsx index c724f8c8..ea82a00a 100644 --- a/src/components/SelectOnClick/SelectOnClick.tsx +++ b/src/components/SelectOnClick/SelectOnClick.tsx @@ -12,7 +12,7 @@ export class SelectOnClick extends React.PureComponent { const { children } = this.props; return (
    (this.child = el)} + ref={(el) => (this.child = el)} onClick={this.selectElement} onFocus={this.selectElement} tabIndex={0} diff --git a/src/components/SideMenu/SideMenu.tsx b/src/components/SideMenu/SideMenu.tsx index 386fed07..4cd7f6bf 100644 --- a/src/components/SideMenu/SideMenu.tsx +++ b/src/components/SideMenu/SideMenu.tsx @@ -46,7 +46,7 @@ export class SideMenu extends React.Component<{ menu: MenuStore; className?: str }); }; - private saveScrollUpdate = upd => { + private saveScrollUpdate = (upd) => { this._updateScroll = upd; }; } diff --git a/src/components/SideMenu/styled.elements.ts b/src/components/SideMenu/styled.elements.ts index 55846434..7679d4a5 100644 --- a/src/components/SideMenu/styled.elements.ts +++ b/src/components/SideMenu/styled.elements.ts @@ -9,8 +9,8 @@ export const OperationBadge = styled.span.attrs((props: { type: string }) => ({ }))<{ type: string }>` width: 9ex; display: inline-block; - height: ${props => props.theme.typography.code.fontSize}; - line-height: ${props => props.theme.typography.code.fontSize}; + height: ${(props) => props.theme.typography.code.fontSize}; + line-height: ${(props) => props.theme.typography.code.fontSize}; background-color: #333; border-radius: 3px; background-repeat: no-repeat; @@ -26,43 +26,43 @@ export const OperationBadge = styled.span.attrs((props: { type: string }) => ({ margin-top: 2px; &.get { - background-color: ${props => props.theme.colors.http.get}; + background-color: ${(props) => props.theme.colors.http.get}; } &.post { - background-color: ${props => props.theme.colors.http.post}; + background-color: ${(props) => props.theme.colors.http.post}; } &.put { - background-color: ${props => props.theme.colors.http.put}; + background-color: ${(props) => props.theme.colors.http.put}; } &.options { - background-color: ${props => props.theme.colors.http.options}; + background-color: ${(props) => props.theme.colors.http.options}; } &.patch { - background-color: ${props => props.theme.colors.http.patch}; + background-color: ${(props) => props.theme.colors.http.patch}; } &.delete { - background-color: ${props => props.theme.colors.http.delete}; + background-color: ${(props) => props.theme.colors.http.delete}; } &.basic { - background-color: ${props => props.theme.colors.http.basic}; + background-color: ${(props) => props.theme.colors.http.basic}; } &.link { - background-color: ${props => props.theme.colors.http.link}; + background-color: ${(props) => props.theme.colors.http.link}; } &.head { - background-color: ${props => props.theme.colors.http.head}; + background-color: ${(props) => props.theme.colors.http.head}; } &.hook { - background-color: ${props => props.theme.colors.primary.main}; + background-color: ${(props) => props.theme.colors.primary.main}; } `; @@ -84,7 +84,7 @@ export const MenuItemUl = styled.ul<{ expanded: boolean }>` font-size: 0.929em; } - ${props => (props.expanded ? '' : 'display: none;')}; + ${(props) => (props.expanded ? '' : 'display: none;')}; `; export const MenuItemLi = styled.li<{ depth: number }>` @@ -92,7 +92,7 @@ export const MenuItemLi = styled.li<{ depth: number }>` overflow: hidden; text-overflow: ellipsis; padding: 0; - ${props => (props.depth === 0 ? 'margin-top: 15px' : '')}; + ${(props) => (props.depth === 0 ? 'margin-top: 15px' : '')}; `; export const menuItemDepth = { @@ -102,17 +102,17 @@ export const menuItemDepth = { font-size: 0.8em; padding-bottom: 0; cursor: default; - color: ${props => props.theme.sidebar.textColor}; + color: ${(props) => props.theme.sidebar.textColor}; `, 1: css` font-size: 0.929em; text-transform: ${({ theme }) => theme.sidebar.level1Items.textTransform}; &:hover { - color: ${props => props.theme.sidebar.activeTextColor}; + color: ${(props) => props.theme.sidebar.activeTextColor}; } `, 2: css` - color: ${props => props.theme.sidebar.textColor}; + color: ${(props) => props.theme.sidebar.textColor}; `, }; @@ -130,22 +130,22 @@ export const MenuItemLabel = styled.label.attrs((props: MenuItemLabelType) => ({ }), }))` cursor: pointer; - color: ${props => + color: ${(props) => props.active ? props.theme.sidebar.activeTextColor : props.theme.sidebar.textColor}; margin: 0; - padding: 12.5px ${props => props.theme.spacing.unit * 4}px; + padding: 12.5px ${(props) => props.theme.spacing.unit * 4}px; ${({ depth, type, theme }) => (type === 'section' && depth > 1 && 'padding-left: ' + theme.spacing.unit * 8 + 'px;') || ''} display: flex; justify-content: space-between; - font-family: ${props => props.theme.typography.headings.fontFamily}; - ${props => menuItemDepth[props.depth]}; - background-color: ${props => (props.active ? menuItemActiveBg(props.depth, props) : '')}; + font-family: ${(props) => props.theme.typography.headings.fontFamily}; + ${(props) => menuItemDepth[props.depth]}; + background-color: ${(props) => (props.active ? menuItemActiveBg(props.depth, props) : '')}; - ${props => (props.deprecated && deprecatedCss) || ''}; + ${(props) => (props.deprecated && deprecatedCss) || ''}; &:hover { - background-color: ${props => menuItemActiveBg(props.depth, props)}; + background-color: ${(props) => menuItemActiveBg(props.depth, props)}; } ${ShelfIcon} { @@ -160,7 +160,7 @@ export const MenuItemLabel = styled.label.attrs((props: MenuItemLabelType) => ({ export const MenuItemTitle = styled.span<{ width?: string }>` display: inline-block; vertical-align: middle; - width: ${props => (props.width ? props.width : 'auto')}; + width: ${(props) => (props.width ? props.width : 'auto')}; overflow: hidden; text-overflow: ellipsis; `; diff --git a/src/components/StickySidebar/ChevronSvg.tsx b/src/components/StickySidebar/ChevronSvg.tsx index 5343ddb1..41bf1785 100644 --- a/src/components/StickySidebar/ChevronSvg.tsx +++ b/src/components/StickySidebar/ChevronSvg.tsx @@ -62,5 +62,5 @@ const ChevronContainer = styled.div` align-self: center; display: flex; flex-direction: column; - color: ${props => props.theme.colors.primary.main}; + color: ${(props) => props.theme.colors.primary.main}; `; diff --git a/src/components/StickySidebar/StickyResponsiveSidebar.tsx b/src/components/StickySidebar/StickyResponsiveSidebar.tsx index 45b70e2b..e0270b09 100644 --- a/src/components/StickySidebar/StickyResponsiveSidebar.tsx +++ b/src/components/StickySidebar/StickyResponsiveSidebar.tsx @@ -26,8 +26,8 @@ export interface StickySidebarState { const stickyfill = Stickyfill && Stickyfill(); const StyledStickySidebar = styled.div<{ open?: boolean }>` - width: ${props => props.theme.sidebar.width}; - background-color: ${props => props.theme.sidebar.backgroundColor}; + width: ${(props) => props.theme.sidebar.width}; + background-color: ${(props) => props.theme.sidebar.backgroundColor}; overflow: hidden; display: flex; flex-direction: column; @@ -45,7 +45,7 @@ const StyledStickySidebar = styled.div<{ open?: boolean }>` z-index: 20; width: 100%; background: ${({ theme }) => theme.sidebar.backgroundColor}; - display: ${props => (props.open ? 'flex' : 'none')}; + display: ${(props) => (props.open ? 'flex' : 'none')}; `}; @media print { @@ -57,7 +57,7 @@ const FloatingButton = styled.div` outline: none; user-select: none; background-color: #f2f2f2; - color: ${props => props.theme.colors.primary.main}; + color: ${(props) => props.theme.colors.primary.main}; display: none; cursor: pointer; position: fixed; @@ -134,7 +134,7 @@ export class StickyResponsiveSidebar extends React.Component< height: `calc(100vh - ${top})`, }} // tslint:disable-next-line - ref={el => { + ref={(el) => { this.stickyElement = el as any; }} > diff --git a/src/services/AppStore.ts b/src/services/AppStore.ts index 9387c521..1e75e3a6 100644 --- a/src/services/AppStore.ts +++ b/src/services/AppStore.ts @@ -89,7 +89,7 @@ export class AppStore { this.search.indexItems(this.menu.items); } - this.disposer = observe(this.menu, 'activeItemIdx', change => { + this.disposer = observe(this.menu, 'activeItemIdx', (change) => { this.updateMarkOnMenu(change.newValue as number); }); } diff --git a/src/services/MarkdownRenderer.ts b/src/services/MarkdownRenderer.ts index 9276a096..9ef98d60 100644 --- a/src/services/MarkdownRenderer.ts +++ b/src/services/MarkdownRenderer.ts @@ -121,10 +121,7 @@ export class MarkdownRenderer { prevRegexp = regexp; prevPos = currentPos; } - prevHeading.description = rawText - .substring(prevPos) - .replace(prevRegexp, '') - .trim(); + prevHeading.description = rawText.substring(prevPos).replace(prevRegexp, '').trim(); } headingRule = ( diff --git a/src/services/MarkerService.ts b/src/services/MarkerService.ts index 1bde6b3b..8e609015 100644 --- a/src/services/MarkerService.ts +++ b/src/services/MarkerService.ts @@ -37,7 +37,7 @@ export class MarkerService { if (!term && !this.prevTerm) { return; } - this.map.forEach(val => { + this.map.forEach((val) => { val.unmark(); val.mark(term || this.prevTerm); }); @@ -45,7 +45,7 @@ export class MarkerService { } unmark() { - this.map.forEach(val => val.unmark()); + this.map.forEach((val) => val.unmark()); this.prevTerm = ''; } } diff --git a/src/services/MenuBuilder.ts b/src/services/MenuBuilder.ts index 339ba6cf..da1fe906 100644 --- a/src/services/MenuBuilder.ts +++ b/src/services/MenuBuilder.ts @@ -86,7 +86,7 @@ export class MenuBuilder { } const mapHeadingsDeep = (_parent, items, depth = 1) => - items.map(heading => { + items.map((heading) => { const group = new GroupModel('section', heading, _parent); group.depth = depth; if (heading.items) { @@ -149,7 +149,7 @@ export class MenuBuilder { tagNames = group.tags; } - const tags = tagNames.map(tagName => { + const tags = tagNames.map((tagName) => { if (!tagsMap[tagName]) { console.warn(`Non-existing tag "${tagName}" is added to the group "${group!.name}"`); return null; diff --git a/src/services/MenuStore.ts b/src/services/MenuStore.ts index 2a619af6..9adb61c5 100644 --- a/src/services/MenuStore.ts +++ b/src/services/MenuStore.ts @@ -142,12 +142,12 @@ export class MenuStore { } let item: IMenuItem | undefined; - item = this.flatItems.find(i => i.id === id); + item = this.flatItems.find((i) => i.id === id); if (item) { this.activateAndScroll(item, false); } else { if (id.startsWith(SECURITY_SCHEMES_SECTION_PREFIX)) { - item = this.flatItems.find(i => SECURITY_SCHEMES_SECTION_PREFIX.startsWith(i.id)); + item = this.flatItems.find((i) => SECURITY_SCHEMES_SECTION_PREFIX.startsWith(i.id)); this.activate(item); } this.scroll.scrollIntoViewBySelector(`[${SECTION_ATTR}="${id}"]`); @@ -183,7 +183,7 @@ export class MenuStore { } getItemById = (id: string) => { - return this.flatItems.find(item => item.id === id); + return this.flatItems.find((item) => item.id === id); }; /** diff --git a/src/services/OpenAPIParser.ts b/src/services/OpenAPIParser.ts index 489769ee..f8794045 100644 --- a/src/services/OpenAPIParser.ts +++ b/src/services/OpenAPIParser.ts @@ -234,7 +234,7 @@ export class OpenAPIParser { schema: subMerged, }; }) - .filter(child => child !== undefined) as Array<{ + .filter((child) => child !== undefined) as Array<{ $ref: string | undefined; schema: MergedOpenAPISchema; }>; @@ -311,7 +311,7 @@ export class OpenAPIParser { const def = this.deref(schemas[defName]); if ( def.allOf !== undefined && - def.allOf.find(obj => obj.$ref !== undefined && $refs.indexOf(obj.$ref) > -1) + def.allOf.find((obj) => obj.$ref !== undefined && $refs.indexOf(obj.$ref) > -1) ) { res['#/components/schemas/' + defName] = [def['x-discriminator-value'] || defName]; } @@ -337,7 +337,7 @@ export class OpenAPIParser { const beforeAllOf = allOf.slice(0, i); const afterAllOf = allOf.slice(i + 1); return { - oneOf: sub.oneOf.map(part => { + oneOf: sub.oneOf.map((part) => { const merged = this.mergeAllOf({ allOf: [...beforeAllOf, part, ...afterAllOf], }); diff --git a/src/services/RedocNormalizedOptions.ts b/src/services/RedocNormalizedOptions.ts index 126e313a..d1c28587 100644 --- a/src/services/RedocNormalizedOptions.ts +++ b/src/services/RedocNormalizedOptions.ts @@ -250,7 +250,9 @@ export class RedocNormalizedOptions { this.expandDefaultServerVariables = argValueToBoolean(raw.expandDefaultServerVariables); this.maxDisplayedEnumValues = argValueToNumber(raw.maxDisplayedEnumValues); - const ignoreNamedSchemas = Array.isArray(raw.ignoreNamedSchemas) ? raw.ignoreNamedSchemas : raw.ignoreNamedSchemas?.split(',').map(s => s.trim()); + const ignoreNamedSchemas = Array.isArray(raw.ignoreNamedSchemas) + ? raw.ignoreNamedSchemas + : raw.ignoreNamedSchemas?.split(',').map((s) => s.trim()); this.ignoreNamedSchemas = new Set(ignoreNamedSchemas); } } diff --git a/src/services/SearchStore.ts b/src/services/SearchStore.ts index ebf2ca56..b7ffe69c 100644 --- a/src/services/SearchStore.ts +++ b/src/services/SearchStore.ts @@ -23,8 +23,8 @@ export class SearchStore { searchWorker = getWorker(); indexItems(groups: Array) { - const recurse = items => { - items.forEach(group => { + const recurse = (items) => { + items.forEach((group) => { if (group.type !== 'group') { this.add(group.name, group.description || '', group.id); } @@ -59,7 +59,7 @@ export class SearchStore { fromExternalJS(path?: string, exportName?: string) { if (path && exportName) { - this.searchWorker.fromExternalJS(path, exportName) + this.searchWorker.fromExternalJS(path, exportName); } } } diff --git a/src/services/SearchWorker.worker.ts b/src/services/SearchWorker.worker.ts index a90287b5..3b3e93b0 100644 --- a/src/services/SearchWorker.worker.ts +++ b/src/services/SearchWorker.worker.ts @@ -47,14 +47,14 @@ function initEmpty() { builder.pipeline.add(lunr.trimmer, lunr.stopWordFilter, lunr.stemmer); - index = new Promise(resolve => { + index = new Promise((resolve) => { resolveIndex = resolve; }); } initEmpty(); -const expandTerm = term => '*' + lunr.stemmer(new lunr.Token(term, {})) + '*'; +const expandTerm = (term) => '*' + lunr.stemmer(new lunr.Token(term, {})) + '*'; export function add(title: string, description: string, meta?: T) { const ref = store.push(meta) - 1; @@ -104,11 +104,11 @@ export async function search( return []; } - let searchResults = (await index).query(t => { + let searchResults = (await index).query((t) => { q.trim() .toLowerCase() .split(/\s+/) - .forEach(term => { + .forEach((term) => { if (term.length === 1) return; const exp = expandTerm(term); t.term(exp, {}); @@ -119,5 +119,5 @@ export async function search( searchResults = searchResults.slice(0, limit); } - return searchResults.map(res => ({ meta: store[res.ref], score: res.score })); + return searchResults.map((res) => ({ meta: store[res.ref], score: res.score })); } diff --git a/src/services/models/Example.ts b/src/services/models/Example.ts index 66bb9201..36b7f81a 100644 --- a/src/services/models/Example.ts +++ b/src/services/models/Example.ts @@ -41,8 +41,8 @@ export class ExampleModel { return externalExamplesCache[this.externalValueUrl]; } - externalExamplesCache[this.externalValueUrl] = fetch(this.externalValueUrl).then(res => { - return res.text().then(txt => { + externalExamplesCache[this.externalValueUrl] = fetch(this.externalValueUrl).then((res) => { + return res.text().then((txt) => { if (!res.ok) { return Promise.reject(new Error(txt)); } diff --git a/src/services/models/MediaContent.ts b/src/services/models/MediaContent.ts index ff2c4950..11811170 100644 --- a/src/services/models/MediaContent.ts +++ b/src/services/models/MediaContent.ts @@ -29,7 +29,7 @@ export class MediaContentModel { if (options.unstable_ignoreMimeParameters) { info = mergeSimilarMediaTypes(info); } - this.mediaTypes = Object.keys(info).map(name => { + this.mediaTypes = Object.keys(info).map((name) => { const mime = info[name]; // reset deref cache just in case something is left there parser.resetVisited(); @@ -52,6 +52,6 @@ export class MediaContentModel { } get hasSample(): boolean { - return this.mediaTypes.filter(mime => !!mime.examples).length > 0; + return this.mediaTypes.filter((mime) => !!mime.examples).length > 0; } } diff --git a/src/services/models/MediaType.ts b/src/services/models/MediaType.ts index eda76e32..2f9f499e 100644 --- a/src/services/models/MediaType.ts +++ b/src/services/models/MediaType.ts @@ -32,7 +32,7 @@ export class MediaTypeModel { if (info.examples !== undefined) { this.examples = mapValues( info.examples, - example => new ExampleModel(parser, example, name, info.encoding), + (example) => new ExampleModel(parser, example, name, info.encoding), ); } else if (info.example !== undefined) { this.examples = { diff --git a/src/services/models/Response.ts b/src/services/models/Response.ts index 3fc4d06c..a65bdcf7 100644 --- a/src/services/models/Response.ts +++ b/src/services/models/Response.ts @@ -47,7 +47,7 @@ export class ResponseModel { const headers = info.headers; if (headers !== undefined) { - this.headers = Object.keys(headers).map(name => { + this.headers = Object.keys(headers).map((name) => { const header = headers[name]; return new FieldModel(parser, { ...header, name }, '', options); }); diff --git a/src/services/models/SecurityRequirement.ts b/src/services/models/SecurityRequirement.ts index 0fc62a79..82644d71 100644 --- a/src/services/models/SecurityRequirement.ts +++ b/src/services/models/SecurityRequirement.ts @@ -15,7 +15,7 @@ export class SecurityRequirementModel { const schemes = (parser.spec.components && parser.spec.components.securitySchemes) || {}; this.schemes = Object.keys(requirement || {}) - .map(id => { + .map((id) => { const scheme = parser.deref(schemes[id]); const scopes = requirement[id] || []; @@ -31,6 +31,6 @@ export class SecurityRequirementModel { scopes, }; }) - .filter(scheme => scheme !== undefined) as SecurityScheme[]; + .filter((scheme) => scheme !== undefined) as SecurityScheme[]; } } diff --git a/src/services/models/SecuritySchemes.ts b/src/services/models/SecuritySchemes.ts index fc5deda8..af8d1d01 100644 --- a/src/services/models/SecuritySchemes.ts +++ b/src/services/models/SecuritySchemes.ts @@ -60,7 +60,7 @@ export class SecuritySchemesModel { constructor(parser: OpenAPIParser) { const schemes = (parser.spec.components && parser.spec.components.securitySchemes) || {}; this.schemes = Object.keys(schemes).map( - name => new SecuritySchemeModel(parser, name, schemes[name]), + (name) => new SecuritySchemeModel(parser, name, schemes[name]), ); } } diff --git a/src/styled-components.ts b/src/styled-components.ts index 9db27997..e136e12c 100644 --- a/src/styled-components.ts +++ b/src/styled-components.ts @@ -15,7 +15,7 @@ const { export const media = { lessThan(breakpoint, print?: boolean) { return (...args) => css` - @media ${print ? 'print, ' : ''} screen and (max-width: ${props => + @media ${print ? 'print, ' : ''} screen and (max-width: ${(props) => props.theme.breakpoints[breakpoint]}) { ${(css as any)(...args)}; } @@ -24,7 +24,7 @@ export const media = { greaterThan(breakpoint) { return (...args) => css` - @media (min-width: ${props => props.theme.breakpoints[breakpoint]}) { + @media (min-width: ${(props) => props.theme.breakpoints[breakpoint]}) { ${(css as any)(...args)}; } `; @@ -32,9 +32,9 @@ export const media = { between(firstBreakpoint, secondBreakpoint) { return (...args) => css` - @media (min-width: ${props => - props.theme.breakpoints[firstBreakpoint]}) and (max-width: ${props => - props.theme.breakpoints[secondBreakpoint]}) { + @media (min-width: ${(props) => props.theme.breakpoints[firstBreakpoint]}) and (max-width: ${( + props, + ) => props.theme.breakpoints[secondBreakpoint]}) { ${(css as any)(...args)}; } `; @@ -45,7 +45,7 @@ export { css, createGlobalStyle, keyframes, ThemeProvider }; export default styled; export function extensionsHook(styledName: string) { - return props => { + return (props) => { if (!props.theme.extensionsHook) { return; } diff --git a/src/theme.ts b/src/theme.ts index fef81f30..791f31b5 100644 --- a/src/theme.ts +++ b/src/theme.ts @@ -80,21 +80,21 @@ const defaultTheme: ThemeInterface = { }, }, schema: { - linesColor: theme => + linesColor: (theme) => lighten( theme.colors.tonalOffset, desaturate(theme.colors.tonalOffset, theme.colors.primary.main), ), defaultDetailsWidth: '75%', - typeNameColor: theme => theme.colors.text.secondary, - typeTitleColor: theme => theme.schema.typeNameColor, - requireLabelColor: theme => theme.colors.error.main, + typeNameColor: (theme) => theme.colors.text.secondary, + typeTitleColor: (theme) => theme.schema.typeNameColor, + requireLabelColor: (theme) => theme.colors.error.main, labelsTextSize: '0.9em', nestingSpacing: '1em', nestedBackground: '#fafafa', arrow: { size: '1.1em', - color: theme => theme.colors.text.secondary, + color: (theme) => theme.colors.text.secondary, }, }, typography: { @@ -130,7 +130,7 @@ const defaultTheme: ThemeInterface = { width: '260px', backgroundColor: '#fafafa', textColor: '#333333', - activeTextColor: theme => + activeTextColor: (theme) => theme.sidebar.textColor !== defaultTheme.sidebar!.textColor ? theme.sidebar.textColor : theme.colors.primary.main, @@ -142,7 +142,7 @@ const defaultTheme: ThemeInterface = { }, arrow: { size: '1.5em', - color: theme => theme.sidebar.textColor, + color: (theme) => theme.sidebar.textColor, }, }, logo: { @@ -166,7 +166,7 @@ export function resolveTheme(theme: ThemeInterface): ResolvedThemeInterface { const resolvedValues = {}; let counter = 0; const setProxy = (obj, path: string) => { - Object.keys(obj).forEach(k => { + Object.keys(obj).forEach((k) => { const currentPath = (path ? path + '.' : '') + k; const val = obj[k]; if (typeof val === 'function') { diff --git a/src/utils/__tests__/openapi.test.ts b/src/utils/__tests__/openapi.test.ts index 94fb1e0c..d4993480 100644 --- a/src/utils/__tests__/openapi.test.ts +++ b/src/utils/__tests__/openapi.test.ts @@ -134,9 +134,9 @@ describe('Utils', () => { object: ['maxProperties', 'minProperties', 'required', 'additionalProperties', 'properties'], }; - Object.keys(tests).forEach(name => { + Object.keys(tests).forEach((name) => { it(`Should detect ${name} if ${name} properties are present`, () => { - tests[name].forEach(propName => { + tests[name].forEach((propName) => { expect( detectType({ [propName]: 0, @@ -569,11 +569,11 @@ describe('Utils', () => { }, ]; - testCases.forEach(locationTestGroup => { + testCases.forEach((locationTestGroup) => { describe(locationTestGroup.description, () => { - locationTestGroup.cases.forEach(valueTypeTestGroup => { + locationTestGroup.cases.forEach((valueTypeTestGroup) => { describe(valueTypeTestGroup.description, () => { - valueTypeTestGroup.cases.forEach(testCase => { + valueTypeTestGroup.cases.forEach((testCase) => { it(`should serialize correctly when style is ${testCase.style} and explode is ${testCase.explode}`, () => { const parameter: OpenAPIParameter = { name: locationTestGroup.name, diff --git a/src/utils/decorators.ts b/src/utils/decorators.ts index bfe5726f..ef26087d 100644 --- a/src/utils/decorators.ts +++ b/src/utils/decorators.ts @@ -12,7 +12,7 @@ function throttle(func, wait) { context = args = null; } }; - return function() { + return function () { const now = new Date().getTime(); const remaining = wait - (now - previous); context = this; diff --git a/src/utils/dom.ts b/src/utils/dom.ts index ce91a33a..c6d84330 100644 --- a/src/utils/dom.ts +++ b/src/utils/dom.ts @@ -15,10 +15,10 @@ export function querySelector(selector: string): Element | null { export function html2Str(html: string): string { return html .split(/<[^>]+>/) - .map(chunk => { + .map((chunk) => { return chunk.trim(); }) - .filter(trimmedChunk => { + .filter((trimmedChunk) => { return trimmedChunk.length > 0; }) .join(' '); @@ -27,7 +27,7 @@ export function html2Str(html: string): string { // scrollIntoViewIfNeeded polyfill if (typeof Element !== 'undefined' && !(Element as any).prototype.scrollIntoViewIfNeeded) { - (Element as any).prototype.scrollIntoViewIfNeeded = function(centerIfNeeded) { + (Element as any).prototype.scrollIntoViewIfNeeded = function (centerIfNeeded) { centerIfNeeded = arguments.length === 0 ? true : !!centerIfNeeded; const parent = this.parentNode; diff --git a/src/utils/openapi.ts b/src/utils/openapi.ts index ad98c811..160ee744 100644 --- a/src/utils/openapi.ts +++ b/src/utils/openapi.ts @@ -140,10 +140,10 @@ export function isFormUrlEncoded(contentType: string): boolean { function delimitedEncodeField(fieldVal: any, fieldName: string, delimiter: string): string { if (Array.isArray(fieldVal)) { - return fieldVal.map(v => v.toString()).join(delimiter); + return fieldVal.map((v) => v.toString()).join(delimiter); } else if (typeof fieldVal === 'object') { return Object.keys(fieldVal) - .map(k => `${k}${delimiter}${fieldVal[k]}`) + .map((k) => `${k}${delimiter}${fieldVal[k]}`) .join(delimiter); } else { return fieldName + '=' + fieldVal.toString(); @@ -156,7 +156,7 @@ function deepObjectEncodeField(fieldVal: any, fieldName: string): string { return ''; } else if (typeof fieldVal === 'object') { return Object.keys(fieldVal) - .map(k => `${fieldName}[${k}]=${fieldVal[k]}`) + .map((k) => `${fieldName}[${k}]=${fieldVal[k]}`) .join('&'); } else { console.warn('deepObject style cannot be used with non-object value:' + fieldVal.toString()); @@ -188,7 +188,7 @@ export function urlFormEncodePayload( throw new Error('Payload must have fields: ' + payload.toString()); } else { return Object.keys(payload) - .map(fieldName => { + .map((fieldName) => { const fieldVal = payload[fieldName]; const { style = 'form', explode = true } = encoding[fieldName] || {}; switch (style) { @@ -372,7 +372,7 @@ export function isNamedDefinition(pointer?: string): boolean { export function getDefinitionName(pointer?: string): string | undefined { if (!pointer) return undefined; const match = pointer.match(/^#\/components\/schemas\/([^\/]+)$/); - return match === null ? undefined : match[1] + return match === null ? undefined : match[1]; } function humanizeMultipleOfConstraint(multipleOf: number | undefined): string | undefined { @@ -456,7 +456,7 @@ export function sortByRequired(fields: FieldModel[], order: string[] = []) { const orderedFields: FieldModel[] = []; const unorderedFields: FieldModel[] = []; - fields.forEach(field => { + fields.forEach((field) => { if (field.required) { order.includes(field.name) ? orderedFields.push(field) : unorderedFields.push(field); } else { @@ -484,13 +484,13 @@ export function mergeParams( operationParams: Array> = [], ): Array> { const operationParamNames = {}; - operationParams.forEach(param => { + operationParams.forEach((param) => { param = parser.shalowDeref(param); operationParamNames[param.name + '_' + param.in] = true; }); // filter out path params overridden by operation ones with the same name - pathParams = pathParams.filter(param => { + pathParams = pathParams.filter((param) => { param = parser.shalowDeref(param); return !operationParamNames[param.name + '_' + param.in]; }); @@ -502,7 +502,7 @@ export function mergeSimilarMediaTypes( types: Record, ): Record { const mergedTypes = {}; - Object.keys(types).forEach(name => { + Object.keys(types).forEach((name) => { const mime = types[name]; // ignore content type parameters (e.g. charset) and merge const normalizedMimeName = name.split(';')[0].trim(); @@ -550,7 +550,7 @@ export function normalizeServers( return resolveUrl(baseUrl, url); } - return servers.map(server => { + return servers.map((server) => { return { ...server, url: normalizeUrl(server.url), @@ -568,7 +568,7 @@ export function setSecuritySchemePrefix(prefix: string) { SECURITY_SCHEMES_SECTION_PREFIX = prefix; } -export const shortenHTTPVerb = verb => +export const shortenHTTPVerb = (verb) => ({ delete: 'del', options: 'opts', @@ -599,7 +599,7 @@ export function extractExtensions( showExtensions: string[] | true, ): Record { return Object.keys(obj) - .filter(key => { + .filter((key) => { if (showExtensions === true) { return key.startsWith('x-') && !isRedocExtension(key); } @@ -614,6 +614,6 @@ export function extractExtensions( export function pluralizeType(displayType: string): string { return displayType .split(' or ') - .map(type => type.replace(/^(string|object|number|integer|array|boolean)s?( ?.*)/, '$1s$2')) + .map((type) => type.replace(/^(string|object|number|integer|array|boolean)s?( ?.*)/, '$1s$2')) .join(' or '); } diff --git a/src/utils/test-utils.ts b/src/utils/test-utils.ts index d46468ef..ba8d4ffd 100644 --- a/src/utils/test-utils.ts +++ b/src/utils/test-utils.ts @@ -17,7 +17,7 @@ function traverseComponent(root, fn) { } export function filterPropsDeep(component: T, paths: string[]): T { - traverseComponent(component, comp => { + traverseComponent(component, (comp) => { if (comp.props) { for (const path of paths) { if (has(comp.props, path)) {