@redocly/theme 0.7.3 → 0.7.4

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 (8) hide show
  1. package/lib/Markdown/CodeSample/CodeSample.js +7 -7
  2. package/lib/config.d.ts +90 -82
  3. package/lib/config.js +24 -18
  4. package/lib/mocks/hooks/index.js +7 -5
  5. package/package.json +1 -1
  6. package/src/Markdown/CodeSample/CodeSample.tsx +9 -12
  7. package/src/config.ts +24 -18
  8. package/src/mocks/hooks/index.ts +7 -5
package/lib/Markdown/CodeSample/CodeSample.js CHANGED
@@ -33,24 +33,24 @@ const useSubmitFeedback_1 = require("../../mocks/Feedback/useSubmitFeedback");
33
33
  const useReportDialog_1 = require("../../hooks/useReportDialog");
34
34
  function CodeSample({ rawContent, highlighted, language }) {
35
35
  const langClassName = language ? `language-${language}` : '';
36
- const { markdown: { copyCodeSnippet = {}, reportCodeSnippet = {} } = {} } = (0, useThemeConfig_1.useThemeConfig)();
36
+ const { codeSnippet: { copy = {}, report = { hide: true } } = {} } = (0, useThemeConfig_1.useThemeConfig)(); // TODO: report temporary disabled
37
37
  const { submitFeedback } = (0, useSubmitFeedback_1.useSubmitFeedback)();
38
38
  const [isCopied, setIsCopied] = (0, react_1.useState)(false);
39
39
  const [isDialogShown, showDialog, hideDialog] = (0, useReportDialog_1.useReportDialog)(false);
40
40
  const copyCode = (code) => {
41
41
  ClipboardService_1.ClipboardService.copyCustom(code);
42
42
  setIsCopied(true);
43
- setTimeout(() => setIsCopied(false), copyCodeSnippet.toasterDuration || 1000);
43
+ setTimeout(() => setIsCopied(false), copy.toasterDuration || 1000);
44
44
  };
45
45
  return (react_1.default.createElement(Wrapper, { className: "code-sample", "data-component-name": "Markdown/CodeSample/CodeSample" },
46
46
  react_1.default.createElement(CodeSampleButtonContainer, null,
47
- !copyCodeSnippet.hide && (react_1.default.createElement(react_1.default.Fragment, null,
48
- !isCopied && (react_1.default.createElement(Button, { onClick: () => copyCode(rawContent), title: copyCodeSnippet.tooltipText || 'Copy to clipboard' }, copyCodeSnippet.buttonText || 'Copy')),
49
- isCopied && react_1.default.createElement(DoneIndicator, null, copyCodeSnippet.toasterText || 'Copied!'))),
50
- !reportCodeSnippet.hide && (react_1.default.createElement(Button, { onClick: () => showDialog(), title: reportCodeSnippet.tooltipText || 'Report a problem' }, "Report")),
47
+ !copy.hide && (react_1.default.createElement(react_1.default.Fragment, null,
48
+ !isCopied && (react_1.default.createElement(Button, { onClick: () => copyCode(rawContent), title: copy.tooltipText || 'Copy to clipboard' }, copy.buttonText || 'Copy')),
49
+ isCopied && react_1.default.createElement(DoneIndicator, null, copy.toasterText || 'Copied!'))),
50
+ !report.hide && (react_1.default.createElement(Button, { onClick: () => showDialog(), title: report.tooltipText || 'Report a problem' }, "Report")),
51
51
  isDialogShown && (react_1.default.createElement(ReportDialog, { id: "modal" },
52
52
  react_1.default.createElement(Feedback_1.Comment, { settings: {
53
- label: reportCodeSnippet.label || 'What is wrong with a code?',
53
+ label: report.label || 'What is wrong with a code?',
54
54
  onCancel: () => {
55
55
  hideDialog();
56
56
  },
package/lib/config.d.ts CHANGED
@@ -312,6 +312,68 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
312
312
  text?: string | undefined;
313
313
  } | undefined;
314
314
  }>>>;
315
+ codeSnippet: z.ZodOptional<z.ZodDefault<z.ZodObject<{
316
+ copy: z.ZodDefault<z.ZodOptional<z.ZodObject<z.extendShape<{
317
+ buttonText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
318
+ tooltipText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
319
+ toasterText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
320
+ toasterDuration: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
321
+ }, {
322
+ hide: z.ZodOptional<z.ZodBoolean>;
323
+ }>, "strip", z.ZodTypeAny, {
324
+ hide?: boolean | undefined;
325
+ buttonText?: string | undefined;
326
+ tooltipText?: string | undefined;
327
+ toasterText?: string | undefined;
328
+ toasterDuration?: number | undefined;
329
+ }, {
330
+ hide?: boolean | undefined;
331
+ buttonText?: string | undefined;
332
+ tooltipText?: string | undefined;
333
+ toasterText?: string | undefined;
334
+ toasterDuration?: number | undefined;
335
+ }>>>;
336
+ report: z.ZodDefault<z.ZodOptional<z.ZodObject<z.extendShape<{
337
+ tooltipText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
338
+ label: z.ZodOptional<z.ZodString>;
339
+ }, {
340
+ hide: z.ZodOptional<z.ZodBoolean>;
341
+ }>, "strip", z.ZodTypeAny, {
342
+ hide?: boolean | undefined;
343
+ tooltipText?: string | undefined;
344
+ label?: string | undefined;
345
+ }, {
346
+ hide?: boolean | undefined;
347
+ tooltipText?: string | undefined;
348
+ label?: string | undefined;
349
+ }>>>;
350
+ }, "strict", z.ZodTypeAny, {
351
+ copy: {
352
+ hide?: boolean | undefined;
353
+ buttonText?: string | undefined;
354
+ tooltipText?: string | undefined;
355
+ toasterText?: string | undefined;
356
+ toasterDuration?: number | undefined;
357
+ };
358
+ report: {
359
+ hide?: boolean | undefined;
360
+ tooltipText?: string | undefined;
361
+ label?: string | undefined;
362
+ };
363
+ }, {
364
+ copy?: {
365
+ hide?: boolean | undefined;
366
+ buttonText?: string | undefined;
367
+ tooltipText?: string | undefined;
368
+ toasterText?: string | undefined;
369
+ toasterDuration?: number | undefined;
370
+ } | undefined;
371
+ report?: {
372
+ hide?: boolean | undefined;
373
+ tooltipText?: string | undefined;
374
+ label?: string | undefined;
375
+ } | undefined;
376
+ }>>>;
315
377
  markdown: z.ZodOptional<z.ZodDefault<z.ZodObject<{
316
378
  frontMatterKeysToResolve: z.ZodOptional<z.ZodDefault<z.ZodArray<z.ZodString, "many">>>;
317
379
  lastUpdatedBlock: z.ZodOptional<z.ZodDefault<z.ZodObject<z.extendShape<{
@@ -359,40 +421,6 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
359
421
  baseUrl?: string | undefined;
360
422
  icon?: string | undefined;
361
423
  }>>>;
362
- copyCodeSnippet: z.ZodDefault<z.ZodOptional<z.ZodObject<z.extendShape<{
363
- buttonText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
364
- tooltipText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
365
- toasterText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
366
- toasterDuration: z.ZodOptional<z.ZodDefault<z.ZodNumber>>;
367
- }, {
368
- hide: z.ZodOptional<z.ZodBoolean>;
369
- }>, "strip", z.ZodTypeAny, {
370
- hide?: boolean | undefined;
371
- buttonText?: string | undefined;
372
- tooltipText?: string | undefined;
373
- toasterText?: string | undefined;
374
- toasterDuration?: number | undefined;
375
- }, {
376
- hide?: boolean | undefined;
377
- buttonText?: string | undefined;
378
- tooltipText?: string | undefined;
379
- toasterText?: string | undefined;
380
- toasterDuration?: number | undefined;
381
- }>>>;
382
- reportCodeSnippet: z.ZodDefault<z.ZodOptional<z.ZodObject<z.extendShape<{
383
- tooltipText: z.ZodOptional<z.ZodDefault<z.ZodString>>;
384
- label: z.ZodOptional<z.ZodString>;
385
- }, {
386
- hide: z.ZodOptional<z.ZodBoolean>;
387
- }>, "strip", z.ZodTypeAny, {
388
- hide?: boolean | undefined;
389
- tooltipText?: string | undefined;
390
- label?: string | undefined;
391
- }, {
392
- hide?: boolean | undefined;
393
- tooltipText?: string | undefined;
394
- label?: string | undefined;
395
- }>>>;
396
424
  }, "strict", z.ZodTypeAny, {
397
425
  frontMatterKeysToResolve?: string[] | undefined;
398
426
  lastUpdatedBlock?: {
@@ -411,18 +439,6 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
411
439
  header?: string | undefined;
412
440
  depth?: number | undefined;
413
441
  };
414
- copyCodeSnippet: {
415
- hide?: boolean | undefined;
416
- buttonText?: string | undefined;
417
- tooltipText?: string | undefined;
418
- toasterText?: string | undefined;
419
- toasterDuration?: number | undefined;
420
- };
421
- reportCodeSnippet: {
422
- hide?: boolean | undefined;
423
- tooltipText?: string | undefined;
424
- label?: string | undefined;
425
- };
426
442
  }, {
427
443
  frontMatterKeysToResolve?: string[] | undefined;
428
444
  lastUpdatedBlock?: {
@@ -441,18 +457,6 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
441
457
  baseUrl?: string | undefined;
442
458
  icon?: string | undefined;
443
459
  } | undefined;
444
- copyCodeSnippet?: {
445
- hide?: boolean | undefined;
446
- buttonText?: string | undefined;
447
- tooltipText?: string | undefined;
448
- toasterText?: string | undefined;
449
- toasterDuration?: number | undefined;
450
- } | undefined;
451
- reportCodeSnippet?: {
452
- hide?: boolean | undefined;
453
- tooltipText?: string | undefined;
454
- label?: string | undefined;
455
- } | undefined;
456
460
  }>>>;
457
461
  openapi: z.ZodOptional<z.ZodObject<{}, "passthrough", z.ZodTypeAny, {}, {}>>;
458
462
  graphql: z.ZodOptional<z.ZodObject<{}, "passthrough", z.ZodTypeAny, {}, {}>>;
@@ -549,6 +553,20 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
549
553
  placement?: string | undefined;
550
554
  shortcuts?: string[] | undefined;
551
555
  } | undefined;
556
+ codeSnippet?: {
557
+ copy: {
558
+ hide?: boolean | undefined;
559
+ buttonText?: string | undefined;
560
+ tooltipText?: string | undefined;
561
+ toasterText?: string | undefined;
562
+ toasterDuration?: number | undefined;
563
+ };
564
+ report: {
565
+ hide?: boolean | undefined;
566
+ tooltipText?: string | undefined;
567
+ label?: string | undefined;
568
+ };
569
+ } | undefined;
552
570
  markdown?: {
553
571
  frontMatterKeysToResolve?: string[] | undefined;
554
572
  lastUpdatedBlock?: {
@@ -567,18 +585,6 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
567
585
  header?: string | undefined;
568
586
  depth?: number | undefined;
569
587
  };
570
- copyCodeSnippet: {
571
- hide?: boolean | undefined;
572
- buttonText?: string | undefined;
573
- tooltipText?: string | undefined;
574
- toasterText?: string | undefined;
575
- toasterDuration?: number | undefined;
576
- };
577
- reportCodeSnippet: {
578
- hide?: boolean | undefined;
579
- tooltipText?: string | undefined;
580
- label?: string | undefined;
581
- };
582
588
  } | undefined;
583
589
  openapi?: {} | undefined;
584
590
  graphql?: {} | undefined;
@@ -694,6 +700,20 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
694
700
  text?: string | undefined;
695
701
  } | undefined;
696
702
  } | undefined;
703
+ codeSnippet?: {
704
+ copy?: {
705
+ hide?: boolean | undefined;
706
+ buttonText?: string | undefined;
707
+ tooltipText?: string | undefined;
708
+ toasterText?: string | undefined;
709
+ toasterDuration?: number | undefined;
710
+ } | undefined;
711
+ report?: {
712
+ hide?: boolean | undefined;
713
+ tooltipText?: string | undefined;
714
+ label?: string | undefined;
715
+ } | undefined;
716
+ } | undefined;
697
717
  markdown?: {
698
718
  frontMatterKeysToResolve?: string[] | undefined;
699
719
  lastUpdatedBlock?: {
@@ -712,18 +732,6 @@ export declare const ThemeConfig: z.ZodDefault<z.ZodObject<{
712
732
  baseUrl?: string | undefined;
713
733
  icon?: string | undefined;
714
734
  } | undefined;
715
- copyCodeSnippet?: {
716
- hide?: boolean | undefined;
717
- buttonText?: string | undefined;
718
- tooltipText?: string | undefined;
719
- toasterText?: string | undefined;
720
- toasterDuration?: number | undefined;
721
- } | undefined;
722
- reportCodeSnippet?: {
723
- hide?: boolean | undefined;
724
- tooltipText?: string | undefined;
725
- label?: string | undefined;
726
- } | undefined;
727
735
  } | undefined;
728
736
  openapi?: {} | undefined;
729
737
  graphql?: {} | undefined;
package/lib/config.js CHANGED
@@ -117,6 +117,30 @@ exports.ThemeConfig = zod_1.z
117
117
  .strict()
118
118
  .optional()
119
119
  .default({}),
120
+ codeSnippet: zod_1.z
121
+ .object({
122
+ copy: zod_1.z
123
+ .object({
124
+ buttonText: zod_1.z.string().default('Copy').optional(),
125
+ tooltipText: zod_1.z.string().default('Copy to clipboard').optional(),
126
+ toasterText: zod_1.z.string().default('Copied').optional(),
127
+ toasterDuration: zod_1.z.number().default(1500).optional(),
128
+ })
129
+ .extend(HideConfig.shape)
130
+ .optional()
131
+ .default({}),
132
+ report: zod_1.z
133
+ .object({
134
+ tooltipText: zod_1.z.string().default('Report a problem').optional(),
135
+ label: zod_1.z.string().optional(),
136
+ })
137
+ .extend(HideConfig.shape)
138
+ .optional()
139
+ .default({}),
140
+ })
141
+ .strict()
142
+ .default({})
143
+ .optional(),
120
144
  markdown: zod_1.z
121
145
  .object({
122
146
  frontMatterKeysToResolve: zod_1.z.array(zod_1.z.string()).default(['image', 'links']).optional(),
@@ -145,24 +169,6 @@ exports.ThemeConfig = zod_1.z
145
169
  .extend(HideConfig.shape)
146
170
  .default({})
147
171
  .optional(),
148
- copyCodeSnippet: zod_1.z
149
- .object({
150
- buttonText: zod_1.z.string().default('Copy').optional(),
151
- tooltipText: zod_1.z.string().default('Copy to clipboard').optional(),
152
- toasterText: zod_1.z.string().default('Copied').optional(),
153
- toasterDuration: zod_1.z.number().default(1500).optional(),
154
- })
155
- .extend(HideConfig.shape)
156
- .optional()
157
- .default({}),
158
- reportCodeSnippet: zod_1.z
159
- .object({
160
- tooltipText: zod_1.z.string().default('Report a problem').optional(),
161
- label: zod_1.z.string().optional(),
162
- })
163
- .extend(HideConfig.shape)
164
- .optional()
165
- .default({ hide: true }), // TODO: temporary disabled
166
172
  })
167
173
  .strict()
168
174
  .default({})
package/lib/mocks/hooks/index.js CHANGED
@@ -8,20 +8,22 @@ function useThemeConfig() {
8
8
  placement: 'navbar',
9
9
  shortcuts: ['ctrl+f', 'cmd+k', '/'],
10
10
  },
11
- markdown: {
12
- toc: { depth: 3, header: 'Table of contents', hide: false },
13
- lastUpdatedBlock: { hide: false, format: 'timeago', locale: 'en-US' },
14
- copyCodeSnippet: {
11
+ codeSnippet: {
12
+ copy: {
15
13
  hide: false,
16
14
  buttonText: 'Copy',
17
15
  tooltipText: 'Copy to clipboard',
18
16
  toasterText: 'Copied',
19
17
  toasterDuration: 1500,
20
18
  },
21
- reportCodeSnippet: {
19
+ report: {
22
20
  hide: false,
23
21
  tooltipText: 'Report a problem',
24
22
  },
23
+ },
24
+ markdown: {
25
+ toc: { depth: 3, header: 'Table of contents', hide: false },
26
+ lastUpdatedBlock: { hide: false, format: 'timeago', locale: 'en-US' },
25
27
  editPage: {
26
28
  baseUrl: '',
27
29
  text: 'Edit this page',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redocly/theme",
3
- "version": "0.7.3",
3
+ "version": "0.7.4",
4
4
  "description": "Shared UI components lib",
5
5
  "author": "team@redocly.com",
6
6
  "license": "SEE LICENSE IN LICENSE",
package/src/Markdown/CodeSample/CodeSample.tsx CHANGED
@@ -15,7 +15,7 @@ export type CodeSampleProps = {
15
15
 
16
16
  export function CodeSample({ rawContent, highlighted, language }: CodeSampleProps): JSX.Element {
17
17
  const langClassName = language ? `language-${language}` : '';
18
- const { markdown: { copyCodeSnippet = {}, reportCodeSnippet = {} } = {} } = useThemeConfig();
18
+ const { codeSnippet: { copy = {}, report = { hide: true } } = {} } = useThemeConfig(); // TODO: report temporary disabled
19
19
  const { submitFeedback } = useSubmitFeedback();
20
20
 
21
21
  const [isCopied, setIsCopied] = useState(false);
@@ -24,31 +24,28 @@ export function CodeSample({ rawContent, highlighted, language }: CodeSampleProp
24
24
  const copyCode = (code: string) => {
25
25
  ClipboardService.copyCustom(code);
26
26
  setIsCopied(true);
27
- setTimeout(() => setIsCopied(false), copyCodeSnippet.toasterDuration || 1000);
27
+ setTimeout(() => setIsCopied(false), copy.toasterDuration || 1000);
28
28
  };
29
29
 
30
30
  return (
31
31
  <Wrapper className="code-sample" data-component-name="Markdown/CodeSample/CodeSample">
32
32
  <CodeSampleButtonContainer>
33
- {!copyCodeSnippet.hide && (
33
+ {!copy.hide && (
34
34
  <>
35
35
  {!isCopied && (
36
36
  <Button
37
37
  onClick={() => copyCode(rawContent)}
38
- title={copyCodeSnippet.tooltipText || 'Copy to clipboard'}
38
+ title={copy.tooltipText || 'Copy to clipboard'}
39
39
  >
40
- {copyCodeSnippet.buttonText || 'Copy'}
40
+ {copy.buttonText || 'Copy'}
41
41
  </Button>
42
42
  )}
43
- {isCopied && <DoneIndicator>{copyCodeSnippet.toasterText || 'Copied!'}</DoneIndicator>}
43
+ {isCopied && <DoneIndicator>{copy.toasterText || 'Copied!'}</DoneIndicator>}
44
44
  </>
45
45
  )}
46
46
 
47
- {!reportCodeSnippet.hide && (
48
- <Button
49
- onClick={() => showDialog()}
50
- title={reportCodeSnippet.tooltipText || 'Report a problem'}
51
- >
47
+ {!report.hide && (
48
+ <Button onClick={() => showDialog()} title={report.tooltipText || 'Report a problem'}>
52
49
  Report
53
50
  </Button>
54
51
  )}
@@ -57,7 +54,7 @@ export function CodeSample({ rawContent, highlighted, language }: CodeSampleProp
57
54
  <ReportDialog id="modal">
58
55
  <Comment
59
56
  settings={{
60
- label: reportCodeSnippet.label || 'What is wrong with a code?',
57
+ label: report.label || 'What is wrong with a code?',
61
58
  onCancel: () => {
62
59
  hideDialog();
63
60
  },
package/src/config.ts CHANGED
@@ -126,6 +126,30 @@ export const ThemeConfig = z
126
126
  .strict()
127
127
  .optional()
128
128
  .default({}),
129
+ codeSnippet: z
130
+ .object({
131
+ copy: z
132
+ .object({
133
+ buttonText: z.string().default('Copy').optional(),
134
+ tooltipText: z.string().default('Copy to clipboard').optional(),
135
+ toasterText: z.string().default('Copied').optional(),
136
+ toasterDuration: z.number().default(1500).optional(),
137
+ })
138
+ .extend(HideConfig.shape)
139
+ .optional()
140
+ .default({}),
141
+ report: z
142
+ .object({
143
+ tooltipText: z.string().default('Report a problem').optional(),
144
+ label: z.string().optional(),
145
+ })
146
+ .extend(HideConfig.shape)
147
+ .optional()
148
+ .default({}),
149
+ })
150
+ .strict()
151
+ .default({})
152
+ .optional(),
129
153
  markdown: z
130
154
  .object({
131
155
  frontMatterKeysToResolve: z.array(z.string()).default(['image', 'links']).optional(),
@@ -154,24 +178,6 @@ export const ThemeConfig = z
154
178
  .extend(HideConfig.shape)
155
179
  .default({})
156
180
  .optional(),
157
- copyCodeSnippet: z
158
- .object({
159
- buttonText: z.string().default('Copy').optional(),
160
- tooltipText: z.string().default('Copy to clipboard').optional(),
161
- toasterText: z.string().default('Copied').optional(),
162
- toasterDuration: z.number().default(1500).optional(),
163
- })
164
- .extend(HideConfig.shape)
165
- .optional()
166
- .default({}),
167
- reportCodeSnippet: z
168
- .object({
169
- tooltipText: z.string().default('Report a problem').optional(),
170
- label: z.string().optional(),
171
- })
172
- .extend(HideConfig.shape)
173
- .optional()
174
- .default({ hide: true }), // TODO: temporary disabled
175
181
  })
176
182
  .strict()
177
183
  .default({})
package/src/mocks/hooks/index.ts CHANGED
@@ -13,20 +13,22 @@ export function useThemeConfig<T extends Record<string, unknown>>(): T & ThemeUI
13
13
  placement: 'navbar',
14
14
  shortcuts: ['ctrl+f', 'cmd+k', '/'],
15
15
  },
16
- markdown: {
17
- toc: { depth: 3, header: 'Table of contents', hide: false },
18
- lastUpdatedBlock: { hide: false, format: 'timeago', locale: 'en-US' },
19
- copyCodeSnippet: {
16
+ codeSnippet: {
17
+ copy: {
20
18
  hide: false,
21
19
  buttonText: 'Copy',
22
20
  tooltipText: 'Copy to clipboard',
23
21
  toasterText: 'Copied',
24
22
  toasterDuration: 1500,
25
23
  },
26
- reportCodeSnippet: {
24
+ report: {
27
25
  hide: false,
28
26
  tooltipText: 'Report a problem',
29
27
  },
28
+ },
29
+ markdown: {
30
+ toc: { depth: 3, header: 'Table of contents', hide: false },
31
+ lastUpdatedBlock: { hide: false, format: 'timeago', locale: 'en-US' },
30
32
  editPage: {
31
33
  baseUrl: '',
32
34
  text: 'Edit this page',