@scalar/nextjs-api-reference 0.2.41 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,27 @@
1
1
  # @scalar/nextjs-api-reference
2
2
 
3
+ ## 0.3.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [8dc1640]
8
+ - @scalar/api-reference@1.22.1
9
+
10
+ ## 0.3.0
11
+
12
+ ### Minor Changes
13
+
14
+ - 0e64a36: refactor: rename all --theme-_ variables to --scalar-_
15
+
16
+ ### Patch Changes
17
+
18
+ - 22f2858: chore: ran syncpack to update packages
19
+ - Updated dependencies [22f2858]
20
+ - Updated dependencies [ced76e5]
21
+ - Updated dependencies [0e64a36]
22
+ - Updated dependencies [3afec45]
23
+ - @scalar/api-reference@1.22.0
24
+
3
25
  ## 0.2.41
4
26
 
5
27
  ### Patch Changes
package/dist/index.cjs CHANGED
@@ -2,68 +2,68 @@
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const nextjsThemeCss = `
4
4
  :root {
5
- --theme-font: 'Inter', var(--system-fonts);
5
+ --scalar-font: 'Inter', var(--system-fonts);
6
6
  }
7
7
  /* basic theme */
8
8
  .dark-mode {
9
- --theme-color-1: rgba(255, 255, 255, 0.9);
10
- --theme-color-2: rgba(255, 255, 255, 0.62);
11
- --theme-color-3: rgba(255, 255, 255, 0.44);
12
- --theme-color-accent: #3070ec;
9
+ --scalar-color-1: rgba(255, 255, 255, 0.9);
10
+ --scalar-color-2: rgba(255, 255, 255, 0.62);
11
+ --scalar-color-3: rgba(255, 255, 255, 0.44);
12
+ --scalar-color-accent: #3070ec;
13
13
 
14
- --theme-background-1: #000000;
15
- --theme-background-2: #1a1a1a;
16
- --theme-background-3: #2a2828;
17
- --theme-background-accent: transparent;
14
+ --scalar-background-1: #000000;
15
+ --scalar-background-2: #1a1a1a;
16
+ --scalar-background-3: #2a2828;
17
+ --scalar-background-accent: transparent;
18
18
 
19
- --theme-border-color: rgba(255, 255, 255, 0.1);
20
- --theme-code-language-color-supersede: var(--theme-color-1);
21
- --theme-code-languages-background-supersede: var(--theme-background-3);
19
+ --scalar-border-color: rgba(255, 255, 255, 0.1);
20
+ --scalar-code-language-color-supersede: var(--scalar-color-1);
21
+ --scalar-code-languages-background-supersede: var(--scalar-background-3);
22
22
  }
23
23
 
24
24
  .light-mode .dark-mode,
25
25
  .light-mode {
26
- --theme-color-1: #2a2f45;
27
- --theme-color-2: #757575;
28
- --theme-color-3: #8e8e8e;
29
- --theme-color-accent: #3070ec;
26
+ --scalar-color-1: #2a2f45;
27
+ --scalar-color-2: #757575;
28
+ --scalar-color-3: #8e8e8e;
29
+ --scalar-color-accent: #3070ec;
30
30
 
31
- --theme-background-1: #fff;
32
- --theme-background-2: #fafafa;
33
- --theme-background-3: #e7e7e7;
34
- --theme-background-accent: transparent;
31
+ --scalar-background-1: #fff;
32
+ --scalar-background-2: #fafafa;
33
+ --scalar-background-3: #e7e7e7;
34
+ --scalar-background-accent: transparent;
35
35
 
36
- --theme-border-color: rgba(0, 0, 0, 0.1);
36
+ --scalar-border-color: rgba(0, 0, 0, 0.1);
37
37
 
38
- --theme-code-language-color-supersede: var(--theme-color-1);
39
- --theme-code-languages-background-supersede: var(--theme-background-3);
38
+ --scalar-code-language-color-supersede: var(--scalar-color-1);
39
+ --scalar-code-languages-background-supersede: var(--scalar-background-3);
40
40
  }
41
41
  .light-mode .scalar-card {
42
- --theme-background-1: #fff;
43
- --theme-background-2: #fff !important;
44
- --theme-background-3: #fff !important;
42
+ --scalar-background-1: #fff;
43
+ --scalar-background-2: #fff !important;
44
+ --scalar-background-3: #fff !important;
45
45
  }
46
46
  .dark-mode .scalar-card {
47
- --theme-background-1: #000000;
48
- --theme-background-2: #000000 !important;
49
- --theme-background-3: #000000 !important;
47
+ --scalar-background-1: #000000;
48
+ --scalar-background-2: #000000 !important;
49
+ --scalar-background-3: #000000 !important;
50
50
  }
51
51
  .light-mode .examples .scalar-card .scalar-card-header {
52
- --theme-background-2: #fafafa;
52
+ --scalar-background-2: #fafafa;
53
53
  }
54
54
  .dark-mode .examples .scalar-card .scalar-card-header {
55
- --theme-background-2: #1a1a1a;
56
- --theme-border-color: #1a1a1a;
55
+ --scalar-background-2: #1a1a1a;
56
+ --scalar-border-color: #1a1a1a;
57
57
  }
58
58
  /* Document header */
59
59
  .light-mode .t-doc__header,
60
60
  .dark-mode .t-doc__header {
61
61
  --header-background-1: rgba(255,255,255,.8);
62
- --header-border-color: var(--theme-border-color);
63
- --header-color-1: var(--theme-color-1);
64
- --header-color-2: var(--theme-color-2);
65
- --header-background-toggle: var(--theme-color-3);
66
- --header-call-to-action-color: var(--theme-color-accent);
62
+ --header-border-color: var(--scalar-border-color);
63
+ --header-color-1: var(--scalar-color-1);
64
+ --header-color-2: var(--scalar-color-2);
65
+ --header-background-toggle: var(--scalar-color-3);
66
+ --header-call-to-action-color: var(--scalar-color-accent);
67
67
  backdrop-filter: saturate(180%) blur(5px);
68
68
  }
69
69
 
@@ -73,54 +73,54 @@ const nextjsThemeCss = `
73
73
  /* Document Sidebar */
74
74
  .light-mode .t-doc__sidebar,
75
75
  .dark-mode .t-doc__sidebar {
76
- --sidebar-background-1: var(--theme-background-1);
77
- --sidebar-item-hover-color: var(--sidebar-color-1);
78
- --sidebar-item-hover-background: transparent;
79
- --sidebar-item-active-background: var(--theme-background-accent);
80
- --sidebar-border-color: transparent;
81
- --sidebar-color-1: var(--theme-color-1);
82
- --sidebar-color-2: var(--theme-color-2);
83
- --sidebar-color-active: var(--theme-color-accent);
84
- --sidebar-search-background: var(--theme-background-2);
85
- --sidebar-search-border-color: var(--theme-background-2);
86
- --sidebar-search-color: var(--theme-color-3);
87
- --sidebar-indent-border: var(--theme-border-color);
88
- --sidebar-indent-border-active: #6aacf8;
76
+ --scalar-sidebar-background-1: var(--scalar-background-1);
77
+ --scalar-sidebar-item-hover-color: var(--scalar-sidebar-color-1);
78
+ --scalar-sidebar-item-hover-background: transparent;
79
+ --scalar-sidebar-item-active-background: var(--scalar-background-accent);
80
+ --scalar-sidebar-border-color: transparent;
81
+ --scalar-sidebar-color-1: var(--scalar-color-1);
82
+ --scalar-sidebar-color-2: var(--scalar-color-2);
83
+ --scalar-sidebar-color-active: var(--scalar-color-accent);
84
+ --scalar-sidebar-search-background: var(--scalar-background-2);
85
+ --scalar-sidebar-search-border-color: var(--scalar-background-2);
86
+ --scalar-sidebar-search-color: var(--scalar-color-3);
87
+ --scalar-sidebar-indent-border: var(--scalar-border-color);
88
+ --scalar-sidebar-indent-border-active: #6aacf8;
89
89
  }
90
90
  .api-client-drawer .t-doc__sidebar {
91
- --sidebar-border-color: var(--theme-border-color);
91
+ --scalar-sidebar-border-color: var(--scalar-border-color);
92
92
  }
93
93
  /* advanced */
94
94
  .light-mode .dark-mode,
95
95
  .light-mode {
96
- --theme-button-1: rgb(49 53 56);
97
- --theme-button-1-color: #fff;
98
- --theme-button-1-hover: rgb(28 31 33);
96
+ --scalar-button-1: rgb(49 53 56);
97
+ --scalar-button-1-color: #fff;
98
+ --scalar-button-1-hover: rgb(28 31 33);
99
99
 
100
- --theme-color-green: #417942;
101
- --theme-color-red: #ae3763;
102
- --theme-color-yellow: #edbe20;
103
- --theme-color-blue: #2b66cf;
104
- --theme-color-orange: #cf7a2b;
105
- --theme-color-purple: #6e27b5;
100
+ --scalar-color-green: #417942;
101
+ --scalar-color-red: #ae3763;
102
+ --scalar-color-yellow: #edbe20;
103
+ --scalar-color-blue: #2b66cf;
104
+ --scalar-color-orange: #cf7a2b;
105
+ --scalar-color-purple: #6e27b5;
106
106
 
107
- --theme-scrollbar-color: rgba(0, 0, 0, 0.18);
108
- --theme-scrollbar-color-active: rgba(0, 0, 0, 0.36);
107
+ --scalar-scrollbar-color: rgba(0, 0, 0, 0.18);
108
+ --scalar-scrollbar-color-active: rgba(0, 0, 0, 0.36);
109
109
  }
110
110
  .dark-mode {
111
- --theme-button-1: #f6f6f6;
112
- --theme-button-1-color: #000;
113
- --theme-button-1-hover: #e7e7e7;
111
+ --scalar-button-1: #f6f6f6;
112
+ --scalar-button-1-color: #000;
113
+ --scalar-button-1-hover: #e7e7e7;
114
114
 
115
- --theme-color-green: #7abe7b;
116
- --theme-color-red: #e5698f;
117
- --theme-color-yellow: #f8ea68;
118
- --theme-color-blue: #68a6f8;
119
- --theme-color-orange: #f89c68;
120
- --theme-color-purple: #b57de9;
115
+ --scalar-color-green: #7abe7b;
116
+ --scalar-color-red: #e5698f;
117
+ --scalar-color-yellow: #f8ea68;
118
+ --scalar-color-blue: #68a6f8;
119
+ --scalar-color-orange: #f89c68;
120
+ --scalar-color-purple: #b57de9;
121
121
 
122
- --theme-scrollbar-color: rgba(255, 255, 255, 0.24);
123
- --theme-scrollbar-color-active: rgba(255, 255, 255, 0.48);
122
+ --scalar-scrollbar-color: rgba(255, 255, 255, 0.24);
123
+ --scalar-scrollbar-color-active: rgba(255, 255, 255, 0.48);
124
124
  }
125
125
  .sidebar .sidebar-indent-nested .sidebar-heading {
126
126
  padding-right: 0;
@@ -129,8 +129,8 @@ const nextjsThemeCss = `
129
129
  padding: 10px !important;
130
130
  }
131
131
  .sidebar-search-key {
132
- background: var(--theme-background-1) !important;
133
- border: 1px solid var(--theme-border-color);
132
+ background: var(--scalar-background-1) !important;
133
+ border: 1px solid var(--scalar-border-color);
134
134
  }
135
135
  `;
136
136
  const ApiReference = (refConfig) => {
package/dist/index.js CHANGED
@@ -1,67 +1,67 @@
1
1
  const nextjsThemeCss = `
2
2
  :root {
3
- --theme-font: 'Inter', var(--system-fonts);
3
+ --scalar-font: 'Inter', var(--system-fonts);
4
4
  }
5
5
  /* basic theme */
6
6
  .dark-mode {
7
- --theme-color-1: rgba(255, 255, 255, 0.9);
8
- --theme-color-2: rgba(255, 255, 255, 0.62);
9
- --theme-color-3: rgba(255, 255, 255, 0.44);
10
- --theme-color-accent: #3070ec;
7
+ --scalar-color-1: rgba(255, 255, 255, 0.9);
8
+ --scalar-color-2: rgba(255, 255, 255, 0.62);
9
+ --scalar-color-3: rgba(255, 255, 255, 0.44);
10
+ --scalar-color-accent: #3070ec;
11
11
 
12
- --theme-background-1: #000000;
13
- --theme-background-2: #1a1a1a;
14
- --theme-background-3: #2a2828;
15
- --theme-background-accent: transparent;
12
+ --scalar-background-1: #000000;
13
+ --scalar-background-2: #1a1a1a;
14
+ --scalar-background-3: #2a2828;
15
+ --scalar-background-accent: transparent;
16
16
 
17
- --theme-border-color: rgba(255, 255, 255, 0.1);
18
- --theme-code-language-color-supersede: var(--theme-color-1);
19
- --theme-code-languages-background-supersede: var(--theme-background-3);
17
+ --scalar-border-color: rgba(255, 255, 255, 0.1);
18
+ --scalar-code-language-color-supersede: var(--scalar-color-1);
19
+ --scalar-code-languages-background-supersede: var(--scalar-background-3);
20
20
  }
21
21
 
22
22
  .light-mode .dark-mode,
23
23
  .light-mode {
24
- --theme-color-1: #2a2f45;
25
- --theme-color-2: #757575;
26
- --theme-color-3: #8e8e8e;
27
- --theme-color-accent: #3070ec;
24
+ --scalar-color-1: #2a2f45;
25
+ --scalar-color-2: #757575;
26
+ --scalar-color-3: #8e8e8e;
27
+ --scalar-color-accent: #3070ec;
28
28
 
29
- --theme-background-1: #fff;
30
- --theme-background-2: #fafafa;
31
- --theme-background-3: #e7e7e7;
32
- --theme-background-accent: transparent;
29
+ --scalar-background-1: #fff;
30
+ --scalar-background-2: #fafafa;
31
+ --scalar-background-3: #e7e7e7;
32
+ --scalar-background-accent: transparent;
33
33
 
34
- --theme-border-color: rgba(0, 0, 0, 0.1);
34
+ --scalar-border-color: rgba(0, 0, 0, 0.1);
35
35
 
36
- --theme-code-language-color-supersede: var(--theme-color-1);
37
- --theme-code-languages-background-supersede: var(--theme-background-3);
36
+ --scalar-code-language-color-supersede: var(--scalar-color-1);
37
+ --scalar-code-languages-background-supersede: var(--scalar-background-3);
38
38
  }
39
39
  .light-mode .scalar-card {
40
- --theme-background-1: #fff;
41
- --theme-background-2: #fff !important;
42
- --theme-background-3: #fff !important;
40
+ --scalar-background-1: #fff;
41
+ --scalar-background-2: #fff !important;
42
+ --scalar-background-3: #fff !important;
43
43
  }
44
44
  .dark-mode .scalar-card {
45
- --theme-background-1: #000000;
46
- --theme-background-2: #000000 !important;
47
- --theme-background-3: #000000 !important;
45
+ --scalar-background-1: #000000;
46
+ --scalar-background-2: #000000 !important;
47
+ --scalar-background-3: #000000 !important;
48
48
  }
49
49
  .light-mode .examples .scalar-card .scalar-card-header {
50
- --theme-background-2: #fafafa;
50
+ --scalar-background-2: #fafafa;
51
51
  }
52
52
  .dark-mode .examples .scalar-card .scalar-card-header {
53
- --theme-background-2: #1a1a1a;
54
- --theme-border-color: #1a1a1a;
53
+ --scalar-background-2: #1a1a1a;
54
+ --scalar-border-color: #1a1a1a;
55
55
  }
56
56
  /* Document header */
57
57
  .light-mode .t-doc__header,
58
58
  .dark-mode .t-doc__header {
59
59
  --header-background-1: rgba(255,255,255,.8);
60
- --header-border-color: var(--theme-border-color);
61
- --header-color-1: var(--theme-color-1);
62
- --header-color-2: var(--theme-color-2);
63
- --header-background-toggle: var(--theme-color-3);
64
- --header-call-to-action-color: var(--theme-color-accent);
60
+ --header-border-color: var(--scalar-border-color);
61
+ --header-color-1: var(--scalar-color-1);
62
+ --header-color-2: var(--scalar-color-2);
63
+ --header-background-toggle: var(--scalar-color-3);
64
+ --header-call-to-action-color: var(--scalar-color-accent);
65
65
  backdrop-filter: saturate(180%) blur(5px);
66
66
  }
67
67
 
@@ -71,54 +71,54 @@ const nextjsThemeCss = `
71
71
  /* Document Sidebar */
72
72
  .light-mode .t-doc__sidebar,
73
73
  .dark-mode .t-doc__sidebar {
74
- --sidebar-background-1: var(--theme-background-1);
75
- --sidebar-item-hover-color: var(--sidebar-color-1);
76
- --sidebar-item-hover-background: transparent;
77
- --sidebar-item-active-background: var(--theme-background-accent);
78
- --sidebar-border-color: transparent;
79
- --sidebar-color-1: var(--theme-color-1);
80
- --sidebar-color-2: var(--theme-color-2);
81
- --sidebar-color-active: var(--theme-color-accent);
82
- --sidebar-search-background: var(--theme-background-2);
83
- --sidebar-search-border-color: var(--theme-background-2);
84
- --sidebar-search-color: var(--theme-color-3);
85
- --sidebar-indent-border: var(--theme-border-color);
86
- --sidebar-indent-border-active: #6aacf8;
74
+ --scalar-sidebar-background-1: var(--scalar-background-1);
75
+ --scalar-sidebar-item-hover-color: var(--scalar-sidebar-color-1);
76
+ --scalar-sidebar-item-hover-background: transparent;
77
+ --scalar-sidebar-item-active-background: var(--scalar-background-accent);
78
+ --scalar-sidebar-border-color: transparent;
79
+ --scalar-sidebar-color-1: var(--scalar-color-1);
80
+ --scalar-sidebar-color-2: var(--scalar-color-2);
81
+ --scalar-sidebar-color-active: var(--scalar-color-accent);
82
+ --scalar-sidebar-search-background: var(--scalar-background-2);
83
+ --scalar-sidebar-search-border-color: var(--scalar-background-2);
84
+ --scalar-sidebar-search-color: var(--scalar-color-3);
85
+ --scalar-sidebar-indent-border: var(--scalar-border-color);
86
+ --scalar-sidebar-indent-border-active: #6aacf8;
87
87
  }
88
88
  .api-client-drawer .t-doc__sidebar {
89
- --sidebar-border-color: var(--theme-border-color);
89
+ --scalar-sidebar-border-color: var(--scalar-border-color);
90
90
  }
91
91
  /* advanced */
92
92
  .light-mode .dark-mode,
93
93
  .light-mode {
94
- --theme-button-1: rgb(49 53 56);
95
- --theme-button-1-color: #fff;
96
- --theme-button-1-hover: rgb(28 31 33);
94
+ --scalar-button-1: rgb(49 53 56);
95
+ --scalar-button-1-color: #fff;
96
+ --scalar-button-1-hover: rgb(28 31 33);
97
97
 
98
- --theme-color-green: #417942;
99
- --theme-color-red: #ae3763;
100
- --theme-color-yellow: #edbe20;
101
- --theme-color-blue: #2b66cf;
102
- --theme-color-orange: #cf7a2b;
103
- --theme-color-purple: #6e27b5;
98
+ --scalar-color-green: #417942;
99
+ --scalar-color-red: #ae3763;
100
+ --scalar-color-yellow: #edbe20;
101
+ --scalar-color-blue: #2b66cf;
102
+ --scalar-color-orange: #cf7a2b;
103
+ --scalar-color-purple: #6e27b5;
104
104
 
105
- --theme-scrollbar-color: rgba(0, 0, 0, 0.18);
106
- --theme-scrollbar-color-active: rgba(0, 0, 0, 0.36);
105
+ --scalar-scrollbar-color: rgba(0, 0, 0, 0.18);
106
+ --scalar-scrollbar-color-active: rgba(0, 0, 0, 0.36);
107
107
  }
108
108
  .dark-mode {
109
- --theme-button-1: #f6f6f6;
110
- --theme-button-1-color: #000;
111
- --theme-button-1-hover: #e7e7e7;
109
+ --scalar-button-1: #f6f6f6;
110
+ --scalar-button-1-color: #000;
111
+ --scalar-button-1-hover: #e7e7e7;
112
112
 
113
- --theme-color-green: #7abe7b;
114
- --theme-color-red: #e5698f;
115
- --theme-color-yellow: #f8ea68;
116
- --theme-color-blue: #68a6f8;
117
- --theme-color-orange: #f89c68;
118
- --theme-color-purple: #b57de9;
113
+ --scalar-color-green: #7abe7b;
114
+ --scalar-color-red: #e5698f;
115
+ --scalar-color-yellow: #f8ea68;
116
+ --scalar-color-blue: #68a6f8;
117
+ --scalar-color-orange: #f89c68;
118
+ --scalar-color-purple: #b57de9;
119
119
 
120
- --theme-scrollbar-color: rgba(255, 255, 255, 0.24);
121
- --theme-scrollbar-color-active: rgba(255, 255, 255, 0.48);
120
+ --scalar-scrollbar-color: rgba(255, 255, 255, 0.24);
121
+ --scalar-scrollbar-color-active: rgba(255, 255, 255, 0.48);
122
122
  }
123
123
  .sidebar .sidebar-indent-nested .sidebar-heading {
124
124
  padding-right: 0;
@@ -127,8 +127,8 @@ const nextjsThemeCss = `
127
127
  padding: 10px !important;
128
128
  }
129
129
  .sidebar-search-key {
130
- background: var(--theme-background-1) !important;
131
- border: 1px solid var(--theme-border-color);
130
+ background: var(--scalar-background-1) !important;
131
+ border: 1px solid var(--scalar-border-color);
132
132
  }
133
133
  `;
134
134
  const ApiReference = (refConfig) => {
@@ -4,68 +4,68 @@
4
4
  "use strict";
5
5
  const nextjsThemeCss = `
6
6
  :root {
7
- --theme-font: 'Inter', var(--system-fonts);
7
+ --scalar-font: 'Inter', var(--system-fonts);
8
8
  }
9
9
  /* basic theme */
10
10
  .dark-mode {
11
- --theme-color-1: rgba(255, 255, 255, 0.9);
12
- --theme-color-2: rgba(255, 255, 255, 0.62);
13
- --theme-color-3: rgba(255, 255, 255, 0.44);
14
- --theme-color-accent: #3070ec;
11
+ --scalar-color-1: rgba(255, 255, 255, 0.9);
12
+ --scalar-color-2: rgba(255, 255, 255, 0.62);
13
+ --scalar-color-3: rgba(255, 255, 255, 0.44);
14
+ --scalar-color-accent: #3070ec;
15
15
 
16
- --theme-background-1: #000000;
17
- --theme-background-2: #1a1a1a;
18
- --theme-background-3: #2a2828;
19
- --theme-background-accent: transparent;
16
+ --scalar-background-1: #000000;
17
+ --scalar-background-2: #1a1a1a;
18
+ --scalar-background-3: #2a2828;
19
+ --scalar-background-accent: transparent;
20
20
 
21
- --theme-border-color: rgba(255, 255, 255, 0.1);
22
- --theme-code-language-color-supersede: var(--theme-color-1);
23
- --theme-code-languages-background-supersede: var(--theme-background-3);
21
+ --scalar-border-color: rgba(255, 255, 255, 0.1);
22
+ --scalar-code-language-color-supersede: var(--scalar-color-1);
23
+ --scalar-code-languages-background-supersede: var(--scalar-background-3);
24
24
  }
25
25
 
26
26
  .light-mode .dark-mode,
27
27
  .light-mode {
28
- --theme-color-1: #2a2f45;
29
- --theme-color-2: #757575;
30
- --theme-color-3: #8e8e8e;
31
- --theme-color-accent: #3070ec;
28
+ --scalar-color-1: #2a2f45;
29
+ --scalar-color-2: #757575;
30
+ --scalar-color-3: #8e8e8e;
31
+ --scalar-color-accent: #3070ec;
32
32
 
33
- --theme-background-1: #fff;
34
- --theme-background-2: #fafafa;
35
- --theme-background-3: #e7e7e7;
36
- --theme-background-accent: transparent;
33
+ --scalar-background-1: #fff;
34
+ --scalar-background-2: #fafafa;
35
+ --scalar-background-3: #e7e7e7;
36
+ --scalar-background-accent: transparent;
37
37
 
38
- --theme-border-color: rgba(0, 0, 0, 0.1);
38
+ --scalar-border-color: rgba(0, 0, 0, 0.1);
39
39
 
40
- --theme-code-language-color-supersede: var(--theme-color-1);
41
- --theme-code-languages-background-supersede: var(--theme-background-3);
40
+ --scalar-code-language-color-supersede: var(--scalar-color-1);
41
+ --scalar-code-languages-background-supersede: var(--scalar-background-3);
42
42
  }
43
43
  .light-mode .scalar-card {
44
- --theme-background-1: #fff;
45
- --theme-background-2: #fff !important;
46
- --theme-background-3: #fff !important;
44
+ --scalar-background-1: #fff;
45
+ --scalar-background-2: #fff !important;
46
+ --scalar-background-3: #fff !important;
47
47
  }
48
48
  .dark-mode .scalar-card {
49
- --theme-background-1: #000000;
50
- --theme-background-2: #000000 !important;
51
- --theme-background-3: #000000 !important;
49
+ --scalar-background-1: #000000;
50
+ --scalar-background-2: #000000 !important;
51
+ --scalar-background-3: #000000 !important;
52
52
  }
53
53
  .light-mode .examples .scalar-card .scalar-card-header {
54
- --theme-background-2: #fafafa;
54
+ --scalar-background-2: #fafafa;
55
55
  }
56
56
  .dark-mode .examples .scalar-card .scalar-card-header {
57
- --theme-background-2: #1a1a1a;
58
- --theme-border-color: #1a1a1a;
57
+ --scalar-background-2: #1a1a1a;
58
+ --scalar-border-color: #1a1a1a;
59
59
  }
60
60
  /* Document header */
61
61
  .light-mode .t-doc__header,
62
62
  .dark-mode .t-doc__header {
63
63
  --header-background-1: rgba(255,255,255,.8);
64
- --header-border-color: var(--theme-border-color);
65
- --header-color-1: var(--theme-color-1);
66
- --header-color-2: var(--theme-color-2);
67
- --header-background-toggle: var(--theme-color-3);
68
- --header-call-to-action-color: var(--theme-color-accent);
64
+ --header-border-color: var(--scalar-border-color);
65
+ --header-color-1: var(--scalar-color-1);
66
+ --header-color-2: var(--scalar-color-2);
67
+ --header-background-toggle: var(--scalar-color-3);
68
+ --header-call-to-action-color: var(--scalar-color-accent);
69
69
  backdrop-filter: saturate(180%) blur(5px);
70
70
  }
71
71
 
@@ -75,54 +75,54 @@
75
75
  /* Document Sidebar */
76
76
  .light-mode .t-doc__sidebar,
77
77
  .dark-mode .t-doc__sidebar {
78
- --sidebar-background-1: var(--theme-background-1);
79
- --sidebar-item-hover-color: var(--sidebar-color-1);
80
- --sidebar-item-hover-background: transparent;
81
- --sidebar-item-active-background: var(--theme-background-accent);
82
- --sidebar-border-color: transparent;
83
- --sidebar-color-1: var(--theme-color-1);
84
- --sidebar-color-2: var(--theme-color-2);
85
- --sidebar-color-active: var(--theme-color-accent);
86
- --sidebar-search-background: var(--theme-background-2);
87
- --sidebar-search-border-color: var(--theme-background-2);
88
- --sidebar-search-color: var(--theme-color-3);
89
- --sidebar-indent-border: var(--theme-border-color);
90
- --sidebar-indent-border-active: #6aacf8;
78
+ --scalar-sidebar-background-1: var(--scalar-background-1);
79
+ --scalar-sidebar-item-hover-color: var(--scalar-sidebar-color-1);
80
+ --scalar-sidebar-item-hover-background: transparent;
81
+ --scalar-sidebar-item-active-background: var(--scalar-background-accent);
82
+ --scalar-sidebar-border-color: transparent;
83
+ --scalar-sidebar-color-1: var(--scalar-color-1);
84
+ --scalar-sidebar-color-2: var(--scalar-color-2);
85
+ --scalar-sidebar-color-active: var(--scalar-color-accent);
86
+ --scalar-sidebar-search-background: var(--scalar-background-2);
87
+ --scalar-sidebar-search-border-color: var(--scalar-background-2);
88
+ --scalar-sidebar-search-color: var(--scalar-color-3);
89
+ --scalar-sidebar-indent-border: var(--scalar-border-color);
90
+ --scalar-sidebar-indent-border-active: #6aacf8;
91
91
  }
92
92
  .api-client-drawer .t-doc__sidebar {
93
- --sidebar-border-color: var(--theme-border-color);
93
+ --scalar-sidebar-border-color: var(--scalar-border-color);
94
94
  }
95
95
  /* advanced */
96
96
  .light-mode .dark-mode,
97
97
  .light-mode {
98
- --theme-button-1: rgb(49 53 56);
99
- --theme-button-1-color: #fff;
100
- --theme-button-1-hover: rgb(28 31 33);
98
+ --scalar-button-1: rgb(49 53 56);
99
+ --scalar-button-1-color: #fff;
100
+ --scalar-button-1-hover: rgb(28 31 33);
101
101
 
102
- --theme-color-green: #417942;
103
- --theme-color-red: #ae3763;
104
- --theme-color-yellow: #edbe20;
105
- --theme-color-blue: #2b66cf;
106
- --theme-color-orange: #cf7a2b;
107
- --theme-color-purple: #6e27b5;
102
+ --scalar-color-green: #417942;
103
+ --scalar-color-red: #ae3763;
104
+ --scalar-color-yellow: #edbe20;
105
+ --scalar-color-blue: #2b66cf;
106
+ --scalar-color-orange: #cf7a2b;
107
+ --scalar-color-purple: #6e27b5;
108
108
 
109
- --theme-scrollbar-color: rgba(0, 0, 0, 0.18);
110
- --theme-scrollbar-color-active: rgba(0, 0, 0, 0.36);
109
+ --scalar-scrollbar-color: rgba(0, 0, 0, 0.18);
110
+ --scalar-scrollbar-color-active: rgba(0, 0, 0, 0.36);
111
111
  }
112
112
  .dark-mode {
113
- --theme-button-1: #f6f6f6;
114
- --theme-button-1-color: #000;
115
- --theme-button-1-hover: #e7e7e7;
113
+ --scalar-button-1: #f6f6f6;
114
+ --scalar-button-1-color: #000;
115
+ --scalar-button-1-hover: #e7e7e7;
116
116
 
117
- --theme-color-green: #7abe7b;
118
- --theme-color-red: #e5698f;
119
- --theme-color-yellow: #f8ea68;
120
- --theme-color-blue: #68a6f8;
121
- --theme-color-orange: #f89c68;
122
- --theme-color-purple: #b57de9;
117
+ --scalar-color-green: #7abe7b;
118
+ --scalar-color-red: #e5698f;
119
+ --scalar-color-yellow: #f8ea68;
120
+ --scalar-color-blue: #68a6f8;
121
+ --scalar-color-orange: #f89c68;
122
+ --scalar-color-purple: #b57de9;
123
123
 
124
- --theme-scrollbar-color: rgba(255, 255, 255, 0.24);
125
- --theme-scrollbar-color-active: rgba(255, 255, 255, 0.48);
124
+ --scalar-scrollbar-color: rgba(255, 255, 255, 0.24);
125
+ --scalar-scrollbar-color-active: rgba(255, 255, 255, 0.48);
126
126
  }
127
127
  .sidebar .sidebar-indent-nested .sidebar-heading {
128
128
  padding-right: 0;
@@ -131,8 +131,8 @@
131
131
  padding: 10px !important;
132
132
  }
133
133
  .sidebar-search-key {
134
- background: var(--theme-background-1) !important;
135
- border: 1px solid var(--theme-border-color);
134
+ background: var(--scalar-background-1) !important;
135
+ border: 1px solid var(--scalar-border-color);
136
136
  }
137
137
  `;
138
138
  const ApiReference = (refConfig) => {
package/package.json CHANGED
@@ -13,7 +13,7 @@
13
13
  "openapi",
14
14
  "swagger"
15
15
  ],
16
- "version": "0.2.41",
16
+ "version": "0.3.1",
17
17
  "engines": {
18
18
  "node": ">=18"
19
19
  },
@@ -35,7 +35,7 @@
35
35
  "directory": "packages/nextjs-api-reference"
36
36
  },
37
37
  "dependencies": {
38
- "@scalar/api-reference": "1.21.2"
38
+ "@scalar/api-reference": "1.22.1"
39
39
  },
40
40
  "devDependencies": {
41
41
  "@types/node": "^20.8.4",
@@ -45,9 +45,9 @@
45
45
  "next": "^14.1.0",
46
46
  "react": "^18.2.0",
47
47
  "react-dom": "^18.2.0",
48
- "vite": "^5.1.1",
48
+ "vite": "^5.2.9",
49
49
  "vite-plugin-dts": "^3.6.3",
50
- "@scalar/api-reference": "1.21.2"
50
+ "@scalar/api-reference": "1.22.1"
51
51
  },
52
52
  "peerDependencies": {
53
53
  "next": "^13 || ^14",