@redocly/theme 0.1.11 → 0.1.14

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.
Files changed (135) hide show
  1. package/CodeBlock/CodeBlock.js +2 -1
  2. package/Markdown/CodeSample/index.d.ts +0 -1
  3. package/Markdown/CodeSample/index.js +0 -1
  4. package/Markdown/CodeSample/styled.d.ts +0 -1
  5. package/Markdown/CodeSample/styled.js +10 -102
  6. package/Markdown/StyledMarkdown.d.ts +0 -2
  7. package/Markdown/StyledMarkdown.js +5 -16
  8. package/OperationBadge/OperationBadge.js +1 -1
  9. package/PageNavigation/NextPageLink.js +1 -1
  10. package/PageNavigation/PreviousPageLink.js +1 -1
  11. package/Search/ClearIcon.js +1 -1
  12. package/Search/Input.js +1 -1
  13. package/Search/Popover.js +1 -1
  14. package/Search/SearchIcon.js +1 -1
  15. package/Search/SearchItem.js +1 -1
  16. package/Sidebar/ApiCallItem.js +1 -1
  17. package/globalStyle.js +24 -6
  18. package/mocks/Link.js +1 -1
  19. package/mocks/hooks/usePageData.d.ts +1 -1
  20. package/package.json +1 -1
  21. package/src/CodeBlock/CodeBlock.ts +3 -42
  22. package/src/Markdown/CodeSample/index.ts +0 -1
  23. package/src/Markdown/CodeSample/styled.ts +65 -195
  24. package/src/Markdown/StyledMarkdown.tsx +14 -28
  25. package/src/OperationBadge/OperationBadge.ts +5 -2
  26. package/src/PageNavigation/NextPageLink.tsx +2 -2
  27. package/src/PageNavigation/PreviousPageLink.tsx +2 -2
  28. package/src/Search/ClearIcon.tsx +1 -1
  29. package/src/Search/Input.tsx +7 -7
  30. package/src/Search/Popover.tsx +2 -2
  31. package/src/Search/SearchIcon.tsx +1 -1
  32. package/src/Search/SearchItem.tsx +1 -1
  33. package/src/Sidebar/ApiCallItem.tsx +1 -2
  34. package/src/globalStyle.ts +660 -461
  35. package/src/mocks/Link.tsx +1 -1
  36. package/src/mocks/hooks/usePageData.ts +1 -1
  37. package/src/ui/Typography.tsx +12 -89
  38. package/src/ui/UniversalLink.tsx +3 -8
  39. package/src/utils/ClipboardService.ts +3 -86
  40. package/src/utils/isUrl.ts +4 -4
  41. package/src/utils/theme-helpers.ts +46 -0
  42. package/ui/Typography.d.ts +2 -71
  43. package/ui/Typography.js +15 -93
  44. package/ui/UniversalLink.js +1 -5
  45. package/utils/ClipboardService.d.ts +1 -5
  46. package/utils/ClipboardService.js +2 -73
  47. package/utils/isUrl.d.ts +2 -2
  48. package/utils/isUrl.js +4 -4
  49. package/utils/theme-helpers.d.ts +1 -0
  50. package/utils/theme-helpers.js +42 -2
  51. package/Markdown/CodeSample/types.d.ts +0 -9
  52. package/Markdown/CodeSample/types.js +0 -2
  53. package/src/Button/Button.stories.tsx +0 -74
  54. package/src/Button/__tests__/Button.test.tsx +0 -42
  55. package/src/Button/__tests__/__snapshots__/Button.test.tsx.snap +0 -274
  56. package/src/CodeBlock/__tests__/CodeBlock.test.tsx +0 -12
  57. package/src/CodeBlock/__tests__/__snapshots__/CodeBlock.test.tsx.snap +0 -140
  58. package/src/CopyButton/CopyButton.stories.tsx +0 -18
  59. package/src/CopyButton/__tests__/CopyButton.test.tsx +0 -35
  60. package/src/CopyButton/__tests__/CopyButtonWrapper.test.tsx +0 -17
  61. package/src/CopyButton/__tests__/__snapshots__/CopyButton.test.tsx.snap +0 -55
  62. package/src/CopyButton/__tests__/__snapshots__/CopyButtonWrapper.test.tsx.snap +0 -46
  63. package/src/DesignTokens/borders.stories.mdx +0 -20
  64. package/src/DesignTokens/colors.stories.mdx +0 -24
  65. package/src/DesignTokens/page-layout.stories.mdx +0 -12
  66. package/src/DesignTokens/tokens-generated.scss +0 -610
  67. package/src/DesignTokens/typography.stories.mdx +0 -36
  68. package/src/Footer/Footer.stories.tsx +0 -57
  69. package/src/Footer/__tests__/Footer.test.tsx +0 -55
  70. package/src/Footer/__tests__/__snapshots__/Footer.test.tsx.snap +0 -253
  71. package/src/Headings/Headings.stories.tsx +0 -36
  72. package/src/Headings/__tests__/Headings.test.tsx +0 -24
  73. package/src/Headings/__tests__/__snapshots__/Headings.test.tsx.snap +0 -57
  74. package/src/JsonViewer/JsonViewer.stories.tsx +0 -57
  75. package/src/JsonViewer/__tests__/JsonViewer.test.tsx +0 -83
  76. package/src/JsonViewer/__tests__/__snapshots__/JsonViewer.test.tsx.snap +0 -2728
  77. package/src/Layout/__tests__/PageLayout.test.tsx +0 -17
  78. package/src/Layout/__tests__/RootLayout.test.tsx +0 -17
  79. package/src/Layout/__tests__/__snapshots__/PageLayout.test.tsx.snap +0 -38
  80. package/src/Layout/__tests__/__snapshots__/RootLayout.test.tsx.snap +0 -18
  81. package/src/Markdown/CodeSample/types.ts +0 -40
  82. package/src/Navbar/Navbar.stories.tsx +0 -32
  83. package/src/Navbar/__tests__/Navbar.test.tsx +0 -55
  84. package/src/Navbar/__tests__/__snapshots__/Navbar.test.tsx.snap +0 -256
  85. package/src/NavbarLogo/NavbarLogo.stories.tsx +0 -20
  86. package/src/NavbarLogo/__tests__/NavbarLogo.test.tsx +0 -47
  87. package/src/NavbarLogo/__tests__/__snapshots__/NavbarLogo.test.tsx.snap +0 -38
  88. package/src/OperationBadge/OperationBadge.stories.tsx +0 -35
  89. package/src/OperationBadge/__tests__/OperationBadge.test.tsx +0 -59
  90. package/src/OperationBadge/__tests__/__snapshots__/OperationBadge.test.tsx.snap +0 -651
  91. package/src/PageNavigation/PageNavigation.stories.tsx +0 -21
  92. package/src/PageNavigation/__tests__/NextPageLink.test.tsx +0 -29
  93. package/src/PageNavigation/__tests__/PageNavigation.test.tsx +0 -54
  94. package/src/PageNavigation/__tests__/PreviousPageLink.test.tsx +0 -29
  95. package/src/PageNavigation/__tests__/__snapshots__/NextPageLink.test.tsx.snap +0 -67
  96. package/src/PageNavigation/__tests__/__snapshots__/PageNavigation.test.tsx.snap +0 -275
  97. package/src/PageNavigation/__tests__/__snapshots__/PreviousPageLink.test.tsx.snap +0 -67
  98. package/src/Panel/CodePanel.stories.tsx +0 -26
  99. package/src/Panel/ContentPanel.stories.tsx +0 -26
  100. package/src/Panel/Panel.stories.tsx +0 -56
  101. package/src/Panel/__tests__/CodePanel.test.tsx +0 -26
  102. package/src/Panel/__tests__/ContentPanel.test.tsx +0 -26
  103. package/src/Panel/__tests__/Panel.test.tsx +0 -53
  104. package/src/Panel/__tests__/__snapshots__/CodePanel.test.tsx.snap +0 -258
  105. package/src/Panel/__tests__/__snapshots__/ContentPanel.test.tsx.snap +0 -278
  106. package/src/Panel/__tests__/__snapshots__/Panel.test.tsx.snap +0 -398
  107. package/src/SamplesPanelControls/SamplesControlButton.stories.tsx +0 -18
  108. package/src/SamplesPanelControls/__tests__/SamplesPanelControls.test.tsx +0 -36
  109. package/src/SamplesPanelControls/__tests__/__snapshots__/SamplesPanelControls.test.tsx.snap +0 -228
  110. package/src/Search/__tests__/Input.test.tsx +0 -13
  111. package/src/Search/__tests__/__snapshots__/Input.test.tsx.snap +0 -36
  112. package/src/SidebarLogo/SidebarLogo.stories.tsx +0 -21
  113. package/src/SidebarLogo/__tests__/SidebarLogo.test.tsx +0 -32
  114. package/src/SidebarLogo/__tests__/__snapshots__/SidebarLogo.test.tsx.snap +0 -62
  115. package/src/SourceCode/SourceCode.stories.tsx +0 -29
  116. package/src/SourceCode/__tests__/SourceCode.test.tsx +0 -48
  117. package/src/SourceCode/__tests__/__snapshots__/SourceCode.test.tsx.snap +0 -786
  118. package/src/TableOfContent/TableOfContent.stories.tsx +0 -37
  119. package/src/TableOfContent/__tests__/TableOfContent.test.tsx +0 -61
  120. package/src/TableOfContent/__tests__/__snapshots__/TableOfContent.test.tsx.snap +0 -153
  121. package/src/Tooltip/Tooltip.stories.tsx +0 -27
  122. package/src/Tooltip/__tests__/Tooltip.test.tsx +0 -41
  123. package/src/Tooltip/__tests__/__snapshots__/Tooltip.test.tsx.snap +0 -83
  124. package/src/Welcome.stories.mdx +0 -7
  125. package/src/icons/ShelfIcon/ShelfIcon.stories.tsx +0 -36
  126. package/src/icons/ShelfIcon/__tests__/ShelfIcon.test.tsx +0 -54
  127. package/src/icons/ShelfIcon/__tests__/__snapshots__/ShelfIcon.test.tsx.snap +0 -235
  128. package/src/utils/__tests__/ClipboardService.test.ts +0 -24
  129. package/src/utils/__tests__/__snapshots__/highlight.test.ts.snap +0 -5
  130. package/src/utils/__tests__/__snapshots__/jsonToHtml.test.ts.snap +0 -5
  131. package/src/utils/__tests__/css-variables.test.ts +0 -20
  132. package/src/utils/__tests__/highlight.test.ts +0 -51
  133. package/src/utils/__tests__/jsonToHtml.test.ts +0 -40
  134. package/src/utils/__tests__/media-css.test.ts +0 -20
  135. package/src/utils/__tests__/theme-helpers.test.ts +0 -25
@@ -1,17 +0,0 @@
1
- import React from 'react';
2
-
3
- import { renderWithTheme } from '../../../tests/utils';
4
-
5
- import { PageLayout } from '@theme/Layout/PageLayout';
6
-
7
- describe('PageLayout', () => {
8
- it('renders', () => {
9
- const { container } = renderWithTheme(
10
- <PageLayout sidebar={<div>sidebar</div>}>
11
- <div>test content</div>
12
- </PageLayout>,
13
- );
14
-
15
- expect(container.firstChild).toMatchSnapshot();
16
- });
17
- });
@@ -1,17 +0,0 @@
1
- import React from 'react';
2
-
3
- import { renderWithTheme } from '../../../tests/utils';
4
-
5
- import { RootLayout } from '@theme/Layout/RootLayout';
6
-
7
- describe('RootLayout', () => {
8
- it('renders', () => {
9
- const { container } = renderWithTheme(
10
- <RootLayout footer={<div>footer</div>} navbar={<div>navbar</div>}>
11
- <div>content</div>
12
- </RootLayout>,
13
- );
14
-
15
- expect(container.firstChild).toMatchSnapshot();
16
- });
17
- });
@@ -1,38 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`PageLayout renders 1`] = `
4
- .c0 {
5
- display: -webkit-box;
6
- display: -webkit-flex;
7
- display: -ms-flexbox;
8
- display: flex;
9
- -webkit-flex-direction: row;
10
- -ms-flex-direction: row;
11
- flex-direction: row;
12
- min-height: calc(100vh - var(--navbar-height));
13
- }
14
-
15
- .c1 {
16
- -webkit-flex: 1 0 0;
17
- -ms-flex: 1 0 0;
18
- flex: 1 0 0;
19
- width: 0;
20
- max-width: 100%;
21
- }
22
-
23
- <div
24
- class="c0"
25
- data-component-name="Layout/PageLayout"
26
- >
27
- <div>
28
- sidebar
29
- </div>
30
- <div
31
- class="c1"
32
- >
33
- <div>
34
- test content
35
- </div>
36
- </div>
37
- </div>
38
- `;
@@ -1,18 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`RootLayout renders 1`] = `
4
- <div
5
- class=""
6
- data-component-name="Layout/RootLayout"
7
- >
8
- <div>
9
- navbar
10
- </div>
11
- <div>
12
- content
13
- </div>
14
- <div>
15
- footer
16
- </div>
17
- </div>
18
- `;
@@ -1,40 +0,0 @@
1
- import { ITypography } from '@theme/ui/Typography';
2
-
3
- export type Token =
4
- | 'comment'
5
- | 'prolog'
6
- | 'doctype'
7
- | 'cdata'
8
- | 'punctuation'
9
- | 'property'
10
- | 'tag'
11
- | 'number'
12
- | 'constant'
13
- | 'symbol'
14
- | 'boolean'
15
- | 'selector'
16
- | 'string'
17
- | 'char'
18
- | 'builtin'
19
- | 'inserted'
20
- | 'operator'
21
- | 'entity'
22
- | 'url'
23
- | 'variable'
24
- | 'atrule'
25
- | 'keyword'
26
- | 'regex'
27
- | 'important'
28
- | 'important'
29
- | 'bold'
30
- | 'italic'
31
- | 'entity'
32
- | 'deleted';
33
-
34
- export type Tokens = {
35
- [P in Token]?: {
36
- color: string;
37
- };
38
- } & {
39
- default?: ITypography;
40
- };
@@ -1,32 +0,0 @@
1
- import React from 'react';
2
- import { ComponentStory, ComponentMeta } from '@storybook/react';
3
-
4
- import { Navbar } from './Navbar';
5
- import { NavbarMenu } from './NavbarMenu';
6
-
7
- import { NavbarLogo } from '@theme/NavbarLogo/NavbarLogo';
8
-
9
- export default {
10
- title: 'Components/Navbar',
11
- component: Navbar,
12
- } as ComponentMeta<typeof Navbar>;
13
-
14
- const Template: ComponentStory<typeof Navbar> = (args) => <Navbar {...args} />;
15
-
16
- export const Main = Template.bind({});
17
- Main.args = {
18
- logo: (
19
- <NavbarLogo
20
- logo={{ link: '/test/', image: 'https://picsum.photos/id/2/400/100', altText: 'test' }}
21
- />
22
- ),
23
- menu: (
24
- <NavbarMenu
25
- menuItems={[
26
- { type: 'link', link: 'https://google.com', label: 'Google' },
27
- { type: 'link', link: '/test/', label: 'Test' },
28
- ]}
29
- />
30
- ),
31
- search: <span> search </span>,
32
- };
@@ -1,55 +0,0 @@
1
- import React from 'react';
2
-
3
- import { renderWithTheme } from '../../../tests/utils';
4
-
5
- import { Navbar, NavbarMenu } from '@theme/Navbar';
6
- import { NavbarLogo } from '@theme/NavbarLogo';
7
-
8
- jest.mock('react-router-dom', () => {
9
- const originalModule = jest.requireActual('react-router-dom');
10
- return {
11
- __esModule: true,
12
- ...originalModule,
13
- useLocation: jest.fn().mockReturnValue({ pathname: '/' }),
14
- };
15
- });
16
-
17
- describe('Navbar', () => {
18
- it('renders', () => {
19
- const { container } = renderWithTheme(
20
- <Navbar
21
- logo={
22
- <NavbarLogo
23
- logo={{ link: '/test/', image: 'https://picsum.photos/id/2/400/100', altText: 'test' }}
24
- />
25
- }
26
- menu={
27
- <NavbarMenu
28
- menuItems={[
29
- { type: 'link', link: 'https://google.com', label: 'Google' },
30
- { type: 'link', link: '/', label: 'Test' },
31
- ]}
32
- />
33
- }
34
- search={<span> Search </span>}
35
- />,
36
- );
37
-
38
- expect(container.firstChild).toMatchSnapshot();
39
- });
40
- it('renders with empty menu items', () => {
41
- const { container } = renderWithTheme(
42
- <Navbar
43
- logo={
44
- <NavbarLogo
45
- logo={{ link: '/test/', image: 'https://picsum.photos/id/2/400/100', altText: 'test' }}
46
- />
47
- }
48
- menu={<NavbarMenu menuItems={[]} />}
49
- search={<span> Search </span>}
50
- />,
51
- );
52
-
53
- expect(container.firstChild).toMatchSnapshot();
54
- });
55
- });
@@ -1,256 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`Navbar renders 1`] = `
4
- .c0 {
5
- height: var(--navbar-height);
6
- box-sizing: border-box;
7
- display: -webkit-box;
8
- display: -webkit-flex;
9
- display: -ms-flexbox;
10
- display: flex;
11
- color: var(--navbar-text-color);
12
- -webkit-align-items: center;
13
- -webkit-box-align: center;
14
- -ms-flex-align: center;
15
- align-items: center;
16
- -webkit-box-pack: justify;
17
- -webkit-justify-content: space-between;
18
- -ms-flex-pack: justify;
19
- justify-content: space-between;
20
- -webkit-flex-shrink: 0;
21
- -ms-flex-negative: 0;
22
- flex-shrink: 0;
23
- font-size: 0.875rem;
24
- position: -webkit-sticky;
25
- position: sticky;
26
- top: 0;
27
- z-index: 200;
28
- padding: 10px var(--sidebar-margin-left);
29
- background: var(--navbar-background-color);
30
- font-family: var(--h-font-family);
31
- }
32
-
33
- .c3 {
34
- display: inline-block;
35
- padding: 20px calc(var(--sidebar-spacing-horizontal) * 2);
36
- text-align: center;
37
- line-height: 1;
38
- font-size: var(--navbar-item-font-size);
39
- margin-left: var(--navbar-item-margin-horizontal);
40
- margin-right: var(--navbar-item-margin-horizontal);
41
- border-radius: var(--navbar-item-border-radius);
42
- font-weight: var(--navbar-item-font-weight);
43
- background: none;
44
- }
45
-
46
- .c6 {
47
- display: inline-block;
48
- padding: 20px calc(var(--sidebar-spacing-horizontal) * 2);
49
- text-align: center;
50
- line-height: 1;
51
- font-size: var(--navbar-item-font-size);
52
- margin-left: var(--navbar-item-margin-horizontal);
53
- margin-right: var(--navbar-item-margin-horizontal);
54
- border-radius: var(--navbar-item-border-radius);
55
- font-weight: var(--navbar-item-font-weight);
56
- background: var(--navbar-item-active-background-color);
57
- }
58
-
59
- .c4 {
60
- color: var(--navbar-text-color);
61
- -webkit-text-decoration: none;
62
- text-decoration: none;
63
- }
64
-
65
- .c7 {
66
- color: var(--navbar-item-active-text-color);
67
- -webkit-text-decoration: var(--navbar-item-active-text-decoration);
68
- text-decoration: var(--navbar-item-active-text-decoration);
69
- }
70
-
71
- .c5 {
72
- cursor: pointer;
73
- vertical-align: middle;
74
- }
75
-
76
- .c2 {
77
- list-style: none;
78
- margin: 0;
79
- padding: 0;
80
- display: block;
81
- }
82
-
83
- .c1 {
84
- max-width: var(--logo-max-width);
85
- max-height: var(--logo-max-height);
86
- height: var(--logo-height);
87
- margin: var(--logo-margin);
88
- }
89
-
90
- @media screen and (min-width:85rem) {
91
- .c0 {
92
- padding: 10px var(--sidebar-margin-left);
93
- font-size: 1rem;
94
- }
95
- }
96
-
97
- @media print {
98
- .c0 {
99
- background: transparent;
100
- display: none;
101
- }
102
-
103
- .c0 > :not(a,img) {
104
- display: none !important;
105
- }
106
-
107
- .c0 img {
108
- padding: 0;
109
- margin: 0;
110
- }
111
- }
112
-
113
- @media screen and (min-width:85rem) {
114
- .c2 {
115
- display: block;
116
- }
117
- }
118
-
119
- <nav
120
- class="c0"
121
- data-component-name="Navbar/Navbar"
122
- >
123
- <a
124
- href="/test/"
125
- to="/test/"
126
- >
127
- <img
128
- alt="test"
129
- class="c1"
130
- data-component-name="NavbarLogo/NavbarLogo"
131
- src="https://picsum.photos/id/2/400/100"
132
- />
133
- </a>
134
- <ul
135
- class="c2"
136
- data-component-name="Navbar/NavbarMenu"
137
- >
138
- <li
139
- class="c3"
140
- data-component-name="Navbar/NavbarItem"
141
- >
142
- <a
143
- class="c4"
144
- href="https://google.com"
145
- to="https://google.com"
146
- >
147
- <span
148
- class="c5"
149
- >
150
- Google
151
- </span>
152
- </a>
153
- </li>
154
- <li
155
- class="c6"
156
- data-component-name="Navbar/NavbarItem"
157
- >
158
- <a
159
- class="c7"
160
- href="/"
161
- to="/"
162
- >
163
- <span
164
- class="c5"
165
- >
166
- Test
167
- </span>
168
- </a>
169
- </li>
170
- </ul>
171
- <span>
172
- Search
173
- </span>
174
- </nav>
175
- `;
176
-
177
- exports[`Navbar renders with empty menu items 1`] = `
178
- .c0 {
179
- height: var(--navbar-height);
180
- box-sizing: border-box;
181
- display: -webkit-box;
182
- display: -webkit-flex;
183
- display: -ms-flexbox;
184
- display: flex;
185
- color: var(--navbar-text-color);
186
- -webkit-align-items: center;
187
- -webkit-box-align: center;
188
- -ms-flex-align: center;
189
- align-items: center;
190
- -webkit-box-pack: justify;
191
- -webkit-justify-content: space-between;
192
- -ms-flex-pack: justify;
193
- justify-content: space-between;
194
- -webkit-flex-shrink: 0;
195
- -ms-flex-negative: 0;
196
- flex-shrink: 0;
197
- font-size: 0.875rem;
198
- position: -webkit-sticky;
199
- position: sticky;
200
- top: 0;
201
- z-index: 200;
202
- padding: 10px var(--sidebar-margin-left);
203
- background: var(--navbar-background-color);
204
- font-family: var(--h-font-family);
205
- }
206
-
207
- .c1 {
208
- max-width: var(--logo-max-width);
209
- max-height: var(--logo-max-height);
210
- height: var(--logo-height);
211
- margin: var(--logo-margin);
212
- }
213
-
214
- @media screen and (min-width:85rem) {
215
- .c0 {
216
- padding: 10px var(--sidebar-margin-left);
217
- font-size: 1rem;
218
- }
219
- }
220
-
221
- @media print {
222
- .c0 {
223
- background: transparent;
224
- display: none;
225
- }
226
-
227
- .c0 > :not(a,img) {
228
- display: none !important;
229
- }
230
-
231
- .c0 img {
232
- padding: 0;
233
- margin: 0;
234
- }
235
- }
236
-
237
- <nav
238
- class="c0"
239
- data-component-name="Navbar/Navbar"
240
- >
241
- <a
242
- href="/test/"
243
- to="/test/"
244
- >
245
- <img
246
- alt="test"
247
- class="c1"
248
- data-component-name="NavbarLogo/NavbarLogo"
249
- src="https://picsum.photos/id/2/400/100"
250
- />
251
- </a>
252
- <span>
253
- Search
254
- </span>
255
- </nav>
256
- `;
@@ -1,20 +0,0 @@
1
- import React from 'react';
2
- import { ComponentStory, ComponentMeta } from '@storybook/react';
3
-
4
- import { NavbarLogo } from '@theme/NavbarLogo/NavbarLogo';
5
-
6
- export default {
7
- title: 'Portal/NavbarLogo',
8
- component: NavbarLogo,
9
- } as ComponentMeta<typeof NavbarLogo>;
10
-
11
- const Template: ComponentStory<typeof NavbarLogo> = (args) => <NavbarLogo {...args} />;
12
-
13
- export const Default = Template.bind({});
14
- Default.args = {
15
- logo: {
16
- image: 'https://redocly.github.io/redoc/petstore-logo.png',
17
- link: 'http://redocly.com/',
18
- altText: 'Pet Store',
19
- },
20
- };
@@ -1,47 +0,0 @@
1
- import React from 'react';
2
-
3
- import { renderWithTheme } from '../../../tests/utils';
4
-
5
- import { NavbarLogo } from '@theme/NavbarLogo';
6
-
7
- describe('NavbarLogo', () => {
8
- it('renders', () => {
9
- const { container } = renderWithTheme(
10
- <NavbarLogo
11
- logo={{
12
- image: 'https://test.com/logo.png',
13
- altText: 'Navbar Logo',
14
- link: 'https://test.com/',
15
- }}
16
- />,
17
- );
18
-
19
- expect(container.firstChild).toMatchSnapshot();
20
- });
21
-
22
- it('renders without link', () => {
23
- const { container } = renderWithTheme(
24
- <NavbarLogo
25
- logo={{
26
- image: 'https://test.com/logo.png',
27
- altText: 'Navbar Logo',
28
- }}
29
- />,
30
- );
31
-
32
- expect(container.firstChild).toMatchSnapshot();
33
- });
34
-
35
- it('renders nothing, if no image provided', () => {
36
- const { container } = renderWithTheme(
37
- <NavbarLogo
38
- logo={{
39
- altText: 'Navbar Logo',
40
- link: 'https://test.com/',
41
- }}
42
- />,
43
- );
44
-
45
- expect(container.firstChild).toBeNull();
46
- });
47
- });
@@ -1,38 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`NavbarLogo renders 1`] = `
4
- .c0 {
5
- max-width: var(--logo-max-width);
6
- max-height: var(--logo-max-height);
7
- height: var(--logo-height);
8
- margin: var(--logo-margin);
9
- }
10
-
11
- <a
12
- href="https://test.com/"
13
- to="https://test.com/"
14
- >
15
- <img
16
- alt="Navbar Logo"
17
- class="c0"
18
- data-component-name="NavbarLogo/NavbarLogo"
19
- src="https://test.com/logo.png"
20
- />
21
- </a>
22
- `;
23
-
24
- exports[`NavbarLogo renders without link 1`] = `
25
- .c0 {
26
- max-width: var(--logo-max-width);
27
- max-height: var(--logo-max-height);
28
- height: var(--logo-height);
29
- margin: var(--logo-margin);
30
- }
31
-
32
- <img
33
- alt="Navbar Logo"
34
- class="c0"
35
- data-component-name="NavbarLogo/NavbarLogo"
36
- src="https://test.com/logo.png"
37
- />
38
- `;
@@ -1,35 +0,0 @@
1
- import React from 'react';
2
- import { ComponentStory, ComponentMeta } from '@storybook/react';
3
-
4
- import { OperationBadge } from '@theme/OperationBadge';
5
-
6
- export default {
7
- title: 'Components/OperationBadge',
8
- component: OperationBadge,
9
- argTypes: {},
10
- } as ComponentMeta<typeof OperationBadge>;
11
-
12
- const Template: ComponentStory<typeof OperationBadge> = (args) => (
13
- <OperationBadge {...args}>Default</OperationBadge>
14
- );
15
-
16
- export const Default = Template.bind({});
17
- Default.args = {};
18
-
19
- const TemplateAll: ComponentStory<typeof OperationBadge> = () => (
20
- <>
21
- <OperationBadge type="get">get</OperationBadge>
22
- <OperationBadge type="post">post</OperationBadge>
23
- <OperationBadge type="put">put</OperationBadge>
24
- <OperationBadge type="delete">delete</OperationBadge>
25
- <OperationBadge type="options">options</OperationBadge>
26
- <OperationBadge type="patch">patch</OperationBadge>
27
- <OperationBadge type="basic">basic</OperationBadge>
28
- <OperationBadge type="link">link</OperationBadge>
29
- <OperationBadge type="head">head</OperationBadge>
30
- <OperationBadge type="hook">hook</OperationBadge>
31
- </>
32
- );
33
-
34
- export const All = TemplateAll.bind({});
35
- All.args = {};
@@ -1,59 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@testing-library/react';
3
-
4
- import { OperationBadge } from '@theme/OperationBadge';
5
-
6
- describe('OperationBadge', () => {
7
- it('renders basic', () => {
8
- const { container } = render(<OperationBadge type={'basic'}>basic</OperationBadge>);
9
-
10
- expect(container.firstChild).toMatchSnapshot();
11
- });
12
-
13
- it('renders get', () => {
14
- const { container } = render(<OperationBadge type={'get'}>get</OperationBadge>);
15
-
16
- expect(container.firstChild).toMatchSnapshot();
17
- });
18
-
19
- it('renders post', () => {
20
- const { container } = render(<OperationBadge type={'post'}>post</OperationBadge>);
21
-
22
- expect(container.firstChild).toMatchSnapshot();
23
- });
24
- it('renders put', () => {
25
- const { container } = render(<OperationBadge type={'put'}>put</OperationBadge>);
26
-
27
- expect(container.firstChild).toMatchSnapshot();
28
- });
29
- it('renders delete', () => {
30
- const { container } = render(<OperationBadge type={'delete'}>delete</OperationBadge>);
31
-
32
- expect(container.firstChild).toMatchSnapshot();
33
- });
34
- it('renders options', () => {
35
- const { container } = render(<OperationBadge type={'options'}>options</OperationBadge>);
36
-
37
- expect(container.firstChild).toMatchSnapshot();
38
- });
39
- it('renders patch', () => {
40
- const { container } = render(<OperationBadge type={'patch'}>patch</OperationBadge>);
41
-
42
- expect(container.firstChild).toMatchSnapshot();
43
- });
44
- it('renders link', () => {
45
- const { container } = render(<OperationBadge type={'link'}>link</OperationBadge>);
46
-
47
- expect(container.firstChild).toMatchSnapshot();
48
- });
49
- it('renders head', () => {
50
- const { container } = render(<OperationBadge type={'head'}>head</OperationBadge>);
51
-
52
- expect(container.firstChild).toMatchSnapshot();
53
- });
54
- it('renders hook', () => {
55
- const { container } = render(<OperationBadge type={'hook'}>hook</OperationBadge>);
56
-
57
- expect(container.firstChild).toMatchSnapshot();
58
- });
59
- });