Skip to content

Commit 8eb03f0

Browse files
committed
🎉 feat: theme
1 parent 37b9ddf commit 8eb03f0

File tree

5 files changed

+127
-67
lines changed

5 files changed

+127
-67
lines changed

CHANGELOG.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,11 @@ Feature:
77
Improvement:
88
- [#23](https://github.com/elysiajs/elysia-swagger/pull/23) Add github action to run bun test
99
- remove `removeComment` from tsconfig to show JSDoc
10+
- add `theme` to customize Swagger CSS link
11+
- add `autoDarkMode` using poor man Swagger dark mode CSS 😭
12+
13+
Change:
14+
- Set default swagger version to 5.7.2
1015

1116
Bug fix:
1217
- [#16](https://github.com/elysiajs/elysia-swagger/pull/16) fix: use global prefix

bun.lockb

373 Bytes
Binary file not shown.

package.json

Lines changed: 52 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,54 @@
11
{
2-
"name": "@elysiajs/swagger",
3-
"version": "0.7.3",
4-
"description": "Plugin for Elysia to auto-generate Swagger page",
5-
"author": {
6-
"name": "saltyAom",
7-
"url": "https://github.com/SaltyAom",
8-
"email": "[email protected]"
9-
},
10-
"main": "./dist/index.js",
11-
"exports": {
12-
"bun": "./dist/index.js",
13-
"node": "./dist/cjs/index.js",
14-
"require": "./dist/cjs/index.js",
15-
"import": "./dist/index.js",
16-
"default": "./dist/index.js"
17-
},
18-
"types": "./src/index.ts",
19-
"keywords": [
20-
"elysia",
21-
"swagger"
22-
],
23-
"homepage": "https://github.com/elysiajs/elysia-swagger",
24-
"repository": {
25-
"type": "git",
26-
"url": "https://github.com/elysiajs/elysia-swagger"
27-
},
28-
"bugs": "https://github.com/elysiajs/elysia-swagger/issues",
29-
"license": "MIT",
30-
"scripts": {
31-
"dev": "bun run --watch example/index.ts",
32-
"test": "bun test && npm run test:node",
33-
"test:node": "npm install --prefix ./test/node/cjs/ && npm install --prefix ./test/node/esm/ && node ./test/node/cjs/index.js && node ./test/node/esm/index.js",
34-
"build": "rimraf dist && tsc --project tsconfig.esm.json && tsc --project tsconfig.cjs.json",
35-
"release": "npm run build && npm run test && npm publish --access public"
36-
},
37-
"peerDependencies": {
38-
"elysia": ">= 0.7.0"
39-
},
40-
"devDependencies": {
41-
"@types/node": "^20.1.4",
42-
"bun-types": "^0.7.0",
43-
"elysia": "0.7.10",
44-
"eslint": "^8.40.0",
45-
"rimraf": "4.3",
46-
"typescript": "^5.0.4"
47-
},
48-
"dependencies": {
49-
"@types/lodash.clonedeep": "^4.5.7",
50-
"lodash.clonedeep": "^4.5.0",
51-
"openapi-types": "^12.1.3"
52-
}
2+
"name": "@elysiajs/swagger",
3+
"version": "0.7.3",
4+
"description": "Plugin for Elysia to auto-generate Swagger page",
5+
"author": {
6+
"name": "saltyAom",
7+
"url": "https://github.com/SaltyAom",
8+
"email": "[email protected]"
9+
},
10+
"main": "./dist/index.js",
11+
"exports": {
12+
"bun": "./dist/index.js",
13+
"node": "./dist/cjs/index.js",
14+
"require": "./dist/cjs/index.js",
15+
"import": "./dist/index.js",
16+
"default": "./dist/index.js"
17+
},
18+
"types": "./src/index.ts",
19+
"keywords": [
20+
"elysia",
21+
"swagger"
22+
],
23+
"homepage": "https://github.com/elysiajs/elysia-swagger",
24+
"repository": {
25+
"type": "git",
26+
"url": "https://github.com/elysiajs/elysia-swagger"
27+
},
28+
"bugs": "https://github.com/elysiajs/elysia-swagger/issues",
29+
"license": "MIT",
30+
"scripts": {
31+
"dev": "bun run --watch example/index.ts",
32+
"test": "bun test && npm run test:node",
33+
"test:node": "npm install --prefix ./test/node/cjs/ && npm install --prefix ./test/node/esm/ && node ./test/node/cjs/index.js && node ./test/node/esm/index.js",
34+
"build": "rimraf dist && tsc --project tsconfig.esm.json && tsc --project tsconfig.cjs.json",
35+
"release": "npm run build && npm run test && npm publish --access public"
36+
},
37+
"peerDependencies": {
38+
"elysia": ">= 0.7.0"
39+
},
40+
"devDependencies": {
41+
"@types/node": "^20.1.4",
42+
"bun-types": "^0.7.0",
43+
"elysia": "0.7.10",
44+
"eslint": "^8.40.0",
45+
"rimraf": "4.3",
46+
"typescript": "^5.0.4"
47+
},
48+
"dependencies": {
49+
"@types/lodash.clonedeep": "^4.5.7",
50+
"@types/swagger-ui": "^3.52.2",
51+
"lodash.clonedeep": "^4.5.0",
52+
"openapi-types": "^12.1.3"
53+
}
5354
}

src/index.ts

Lines changed: 37 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
/* eslint-disable @typescript-eslint/ban-ts-comment */
12
import { type Elysia, type InternalRoute } from 'elysia'
23

34
import { filterPaths, registerSchemaPath } from './utils'
@@ -14,24 +15,30 @@ export const swagger =
1415
<Path extends string = '/swagger'>(
1516
{
1617
documentation = {},
17-
version = '4.18.2',
18+
version = '5.7.2',
1819
excludeStaticFile = true,
1920
path = '/swagger' as Path,
2021
exclude = [],
21-
swaggerOptions = {}
22+
swaggerOptions = {},
23+
theme = `https://unpkg.com/swagger-ui-dist@${version}/swagger-ui.css`,
24+
autoDarkMode = true
2225
}: ElysiaSwaggerConfig<Path> = {
2326
documentation: {},
24-
version: '4.18.2',
27+
version: '5.7.2',
2528
excludeStaticFile: true,
2629
path: '/swagger' as Path,
2730
exclude: [],
28-
swaggerOptions: {}
31+
swaggerOptions: {},
32+
autoDarkMode: true
2933
}
3034
) =>
3135
(app: Elysia) => {
3236
const schema = {}
3337
let totalRoutes = 0
3438

39+
if (!version)
40+
version = `https://unpkg.com/swagger-ui-dist@${version}/swagger-ui.css`
41+
3542
const info = {
3643
title: 'Elysia Documentation',
3744
description: 'Development documentation',
@@ -73,7 +80,32 @@ export const swagger =
7380
name="og:description"
7481
content="${info.description}"
7582
/>
76-
<link rel="stylesheet" href="https://unpkg.com/swagger-ui-dist@${version}/swagger-ui.css" />
83+
${
84+
autoDarkMode && typeof theme === 'string'
85+
? `
86+
<style>
87+
@media (prefers-color-scheme: dark) {
88+
body {
89+
background-color: #222;
90+
color: #faf9a;
91+
}
92+
.swagger-ui {
93+
filter: invert(92%) hue-rotate(180deg);
94+
}
95+
96+
.swagger-ui .microlight {
97+
filter: invert(100%) hue-rotate(180deg);
98+
}
99+
}
100+
</style>`
101+
: ''
102+
}
103+
${
104+
typeof theme === 'string'
105+
? `<link rel="stylesheet" href="${theme}" />`
106+
: `<link rel="stylesheet" media="(prefers-color-scheme: light)" href="${theme.light}" />
107+
<link rel="stylesheet" media="(prefers-color-scheme: dark)" href="${theme.dark}" />`
108+
}
77109
</head>
78110
<body>
79111
<div id="swagger-ui"></div>

src/types.ts

Lines changed: 33 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import type { OpenAPIV3 } from 'openapi-types'
2-
import {SwaggerUIOptions} from 'swagger-ui'
2+
import type { SwaggerUIOptions } from 'swagger-ui'
33

44
export interface ElysiaSwaggerConfig<Path extends string = '/swagger'> {
55
/**
@@ -14,9 +14,9 @@ export interface ElysiaSwaggerConfig<Path extends string = '/swagger'> {
1414
>
1515
/**
1616
* Version to use for swagger cdn bundle
17-
*
17+
*
1818
* @see unpkg.com/swagger-ui-dist
19-
*
19+
*
2020
* @default 4.18.2
2121
*/
2222
version?: string
@@ -41,12 +41,34 @@ export interface ElysiaSwaggerConfig<Path extends string = '/swagger'> {
4141
/**
4242
* Options to send to SwaggerUIBundle
4343
* Currently, options that are defined as functions such as requestInterceptor
44-
* and onComplete are not supported.
45-
*/
46-
swaggerOptions?: Omit<Partial<SwaggerUIOptions>,
47-
'dom_id'|'dom_node'|'spec'|'url'|'urls'
48-
|'layout' | 'pluginsOptions' | 'plugins'|'presets'
49-
|'onComplete' |'requestInterceptor'|'responseInterceptor'
50-
|'modelPropertyMacro'|'parameterMacro'
51-
>
44+
* and onComplete are not supported.
45+
*/
46+
swaggerOptions?: Omit<
47+
Partial<SwaggerUIOptions>,
48+
| 'dom_id'
49+
| 'dom_node'
50+
| 'spec'
51+
| 'url'
52+
| 'urls'
53+
| 'layout'
54+
| 'pluginsOptions'
55+
| 'plugins'
56+
| 'presets'
57+
| 'onComplete'
58+
| 'requestInterceptor'
59+
| 'responseInterceptor'
60+
| 'modelPropertyMacro'
61+
| 'parameterMacro'
62+
>
63+
/**
64+
* Custom Swagger CSS
65+
*/
66+
theme?: string | {
67+
light: string
68+
dark: string
69+
}
70+
/**
71+
* Using poor man dark mode 😭
72+
*/
73+
autoDarkMode?: boolean
5274
}

0 commit comments

Comments
 (0)