@redocly/theme 0.28.0 → 0.28.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.
Files changed (16) hide show
  1. package/lib/components/Feedback/Mood.js +1 -1
  2. package/lib/components/Feedback/Rating.js +1 -1
  3. package/lib/components/Feedback/Reasons.js +3 -3
  4. package/lib/components/Feedback/Scale.js +1 -1
  5. package/lib/components/Feedback/Sentiment.js +1 -1
  6. package/lib/components/Feedback/types.d.ts +5 -5
  7. package/lib/config.d.ts +8 -4
  8. package/lib/config.js +10 -2
  9. package/package.json +1 -1
  10. package/src/components/Feedback/Mood.tsx +1 -1
  11. package/src/components/Feedback/Rating.tsx +1 -1
  12. package/src/components/Feedback/Reasons.tsx +6 -5
  13. package/src/components/Feedback/Scale.tsx +1 -1
  14. package/src/components/Feedback/Sentiment.tsx +1 -1
  15. package/src/components/Feedback/types.ts +5 -5
  16. package/src/config.ts +10 -2
package/lib/components/Feedback/Mood.js CHANGED
@@ -112,7 +112,7 @@ const Mood = ({ settings, onSubmit, className }) => {
112
112
  displayReasons && (React.createElement(Feedback_1.Reasons, { settings: {
113
113
  label: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.label,
114
114
  items: (reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.items) || [],
115
- multi: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.multi,
115
+ component: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.component,
116
116
  }, onChange: setReasons })),
117
117
  displayComment && (React.createElement(Feedback_1.Comment, { standAlone: false, onSubmit: ({ comment }) => setComment(comment), settings: { label: renderCommentLabel(score) } }))),
118
118
  displaySubmitBnt && (React.createElement(ButtonsContainer, null,
package/lib/components/Feedback/Rating.js CHANGED
@@ -79,7 +79,7 @@ const Rating = ({ settings, onSubmit, className }) => {
79
79
  displayReasons && (React.createElement(Feedback_1.Reasons, { settings: {
80
80
  label: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.label,
81
81
  items: (reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.items) || [],
82
- multi: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.multi,
82
+ component: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.component,
83
83
  }, onChange: setReasons })),
84
84
  displayComment && (React.createElement(Feedback_1.Comment, { standAlone: false, onSubmit: ({ comment }) => setComment(comment), settings: { label: commentSettings.label } }))),
85
85
  displaySubmitBnt && (React.createElement(ButtonsContainer, null,
package/lib/components/Feedback/Reasons.js CHANGED
@@ -31,15 +31,15 @@ const React = __importStar(require("react"));
31
31
  const styled_components_1 = __importDefault(require("styled-components"));
32
32
  const hooks_1 = require("../../mocks/hooks");
33
33
  const Reasons = ({ settings, onChange, className }) => {
34
- const { label, multi, items = [] } = settings;
34
+ const { label, component, items = [] } = settings;
35
35
  const [checkedState, setCheckedState] = React.useState(new Array(items.length).fill(false));
36
36
  const { translate } = (0, hooks_1.useTranslate)();
37
37
  if (!items.length) {
38
38
  return React.createElement(React.Fragment, null);
39
39
  }
40
- const input_type = multi ? 'checkbox' : 'radio';
40
+ const input_type = component || 'checkbox';
41
41
  const handleOptionChange = (position) => {
42
- const updatedCheckedState = multi
42
+ const updatedCheckedState = component === 'checkbox'
43
43
  ? checkedState.map((item, index) => (index === position ? !item : item))
44
44
  : items.map((_, idx) => position === idx);
45
45
  setCheckedState(updatedCheckedState);
package/lib/components/Feedback/Scale.js CHANGED
@@ -86,7 +86,7 @@ const Scale = ({ settings, onSubmit, className }) => {
86
86
  displayReasons && (React.createElement(Feedback_1.Reasons, { settings: {
87
87
  label: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.label,
88
88
  items: (reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.items) || [],
89
- multi: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.multi,
89
+ component: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.component,
90
90
  }, onChange: setReasons })),
91
91
  displayComment && (React.createElement(Feedback_1.Comment, { standAlone: false, onSubmit: ({ comment }) => setComment(comment), settings: { label: commentSettings.label } }))),
92
92
  displaySubmitBnt && (React.createElement(ButtonsContainer, null,
package/lib/components/Feedback/Sentiment.js CHANGED
@@ -90,7 +90,7 @@ const Sentiment = ({ settings, onSubmit, className }) => {
90
90
  displayReasons && (React.createElement(Feedback_1.Reasons, { settings: {
91
91
  label: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.label,
92
92
  items: (reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.items) || [],
93
- multi: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.multi,
93
+ component: reasonsSettings === null || reasonsSettings === void 0 ? void 0 : reasonsSettings.component,
94
94
  }, onChange: setReasons })),
95
95
  displayComment && (React.createElement(Feedback_1.Comment, { standAlone: false, onSubmit: ({ comment }) => setComment(comment), settings: { label: commentLabel } }))),
96
96
  displaySubmitBnt && (React.createElement(ButtonsContainer, null,
package/lib/components/Feedback/types.d.ts CHANGED
@@ -17,7 +17,7 @@ export type RatingProps = {
17
17
  reasons?: {
18
18
  enable: boolean;
19
19
  label?: string;
20
- multi?: boolean;
20
+ component?: string;
21
21
  items: string[];
22
22
  };
23
23
  };
@@ -43,7 +43,7 @@ export type ScaleProps = {
43
43
  reasons?: {
44
44
  enable: boolean;
45
45
  label?: string;
46
- multi?: boolean;
46
+ component?: string;
47
47
  items: string[];
48
48
  };
49
49
  };
@@ -68,7 +68,7 @@ export type MoodProps = {
68
68
  reasons?: {
69
69
  enable: boolean;
70
70
  label?: string;
71
- multi?: boolean;
71
+ component?: string;
72
72
  items: string[];
73
73
  };
74
74
  };
@@ -92,7 +92,7 @@ export type SentimentProps = {
92
92
  reasons?: {
93
93
  enable: boolean;
94
94
  label?: string;
95
- multi?: boolean;
95
+ component?: string;
96
96
  items: string[];
97
97
  };
98
98
  };
@@ -115,7 +115,7 @@ export type ReasonsProps = {
115
115
  onChange: (value: string[]) => void;
116
116
  settings: {
117
117
  label?: string;
118
- multi?: boolean;
118
+ component?: string;
119
119
  items: string[];
120
120
  };
121
121
  className?: string;
package/lib/config.d.ts CHANGED
@@ -1053,8 +1053,10 @@ export declare const themeConfigSchema: {
1053
1053
  readonly buttonText: {
1054
1054
  readonly type: "string";
1055
1055
  };
1056
- readonly multi: {
1057
- readonly type: "boolean";
1056
+ readonly component: {
1057
+ readonly type: "string";
1058
+ readonly enum: readonly ["radio", "checkbox"];
1059
+ readonly default: "checkbox";
1058
1060
  };
1059
1061
  readonly items: {
1060
1062
  readonly type: "array";
@@ -1076,8 +1078,10 @@ export declare const themeConfigSchema: {
1076
1078
  readonly type: "boolean";
1077
1079
  readonly default: true;
1078
1080
  };
1079
- readonly multi: {
1080
- readonly type: "boolean";
1081
+ readonly component: {
1082
+ readonly type: "string";
1083
+ readonly enum: readonly ["radio", "checkbox"];
1084
+ readonly default: "checkbox";
1081
1085
  };
1082
1086
  readonly label: {
1083
1087
  readonly type: "string";
package/lib/config.js CHANGED
@@ -402,7 +402,11 @@ exports.themeConfigSchema = {
402
402
  label: { type: 'string' },
403
403
  submitText: { type: 'string' },
404
404
  buttonText: { type: 'string' },
405
- multi: { type: 'boolean' },
405
+ component: {
406
+ type: 'string',
407
+ enum: ['radio', 'checkbox'],
408
+ default: 'checkbox',
409
+ },
406
410
  items: { type: 'array', items: { type: 'string' }, minItems: 1 },
407
411
  leftScaleLabel: { type: 'string' },
408
412
  rightScaleLabel: { type: 'string' },
@@ -410,7 +414,11 @@ exports.themeConfigSchema = {
410
414
  type: 'object',
411
415
  properties: {
412
416
  enable: { type: 'boolean', default: true },
413
- multi: { type: 'boolean' },
417
+ component: {
418
+ type: 'string',
419
+ enum: ['radio', 'checkbox'],
420
+ default: 'checkbox',
421
+ },
414
422
  label: { type: 'string' },
415
423
  items: { type: 'array', items: { type: 'string' } },
416
424
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redocly/theme",
3
- "version": "0.28.0",
3
+ "version": "0.28.1",
4
4
  "description": "Shared UI components lib",
5
5
  "keywords": [
6
6
  "theme",
package/src/components/Feedback/Mood.tsx CHANGED
@@ -126,7 +126,7 @@ export const Mood = ({ settings, onSubmit, className }: MoodProps): JSX.Element
126
126
  settings={{
127
127
  label: reasonsSettings?.label,
128
128
  items: reasonsSettings?.items || [],
129
- multi: reasonsSettings?.multi,
129
+ component: reasonsSettings?.component,
130
130
  }}
131
131
  onChange={setReasons}
132
132
  />
package/src/components/Feedback/Rating.tsx CHANGED
@@ -77,7 +77,7 @@ export const Rating = ({ settings, onSubmit, className }: RatingProps): JSX.Elem
77
77
  settings={{
78
78
  label: reasonsSettings?.label,
79
79
  items: reasonsSettings?.items || [],
80
- multi: reasonsSettings?.multi,
80
+ component: reasonsSettings?.component,
81
81
  }}
82
82
  onChange={setReasons}
83
83
  />
package/src/components/Feedback/Reasons.tsx CHANGED
@@ -5,7 +5,7 @@ import type { ReasonsProps } from '@theme/components/Feedback';
5
5
  import { useTranslate } from '@portal/hooks';
6
6
 
7
7
  export const Reasons = ({ settings, onChange, className }: ReasonsProps): JSX.Element => {
8
- const { label, multi, items = [] } = settings;
8
+ const { label, component, items = [] } = settings;
9
9
  const [checkedState, setCheckedState] = React.useState(new Array(items.length).fill(false));
10
10
  const { translate } = useTranslate();
11
11
 
@@ -13,12 +13,13 @@ export const Reasons = ({ settings, onChange, className }: ReasonsProps): JSX.El
13
13
  return <></>;
14
14
  }
15
15
 
16
- const input_type = multi ? 'checkbox' : 'radio';
16
+ const input_type = component || 'checkbox';
17
17
 
18
18
  const handleOptionChange = (position: number) => {
19
- const updatedCheckedState = multi
20
- ? checkedState.map((item, index) => (index === position ? !item : item))
21
- : items.map((_, idx) => position === idx);
19
+ const updatedCheckedState =
20
+ component === 'checkbox'
21
+ ? checkedState.map((item, index) => (index === position ? !item : item))
22
+ : items.map((_, idx) => position === idx);
22
23
  setCheckedState(updatedCheckedState);
23
24
 
24
25
  onChange(items.filter((_, index) => !!updatedCheckedState[index]));
package/src/components/Feedback/Scale.tsx CHANGED
@@ -105,7 +105,7 @@ export const Scale = ({ settings, onSubmit, className }: ScaleProps): JSX.Elemen
105
105
  settings={{
106
106
  label: reasonsSettings?.label,
107
107
  items: reasonsSettings?.items || [],
108
- multi: reasonsSettings?.multi,
108
+ component: reasonsSettings?.component,
109
109
  }}
110
110
  onChange={setReasons}
111
111
  />
package/src/components/Feedback/Sentiment.tsx CHANGED
@@ -96,7 +96,7 @@ export const Sentiment = ({ settings, onSubmit, className }: SentimentProps): JS
96
96
  settings={{
97
97
  label: reasonsSettings?.label,
98
98
  items: reasonsSettings?.items || [],
99
- multi: reasonsSettings?.multi,
99
+ component: reasonsSettings?.component,
100
100
  }}
101
101
  onChange={setReasons}
102
102
  />
package/src/components/Feedback/types.ts CHANGED
@@ -18,7 +18,7 @@ export type RatingProps = {
18
18
  reasons?: {
19
19
  enable: boolean;
20
20
  label?: string;
21
- multi?: boolean;
21
+ component?: string;
22
22
  items: string[];
23
23
  };
24
24
  };
@@ -45,7 +45,7 @@ export type ScaleProps = {
45
45
  reasons?: {
46
46
  enable: boolean;
47
47
  label?: string;
48
- multi?: boolean;
48
+ component?: string;
49
49
  items: string[];
50
50
  };
51
51
  };
@@ -66,7 +66,7 @@ export type MoodProps = {
66
66
  reasons?: {
67
67
  enable: boolean;
68
68
  label?: string;
69
- multi?: boolean;
69
+ component?: string;
70
70
  items: string[];
71
71
  };
72
72
  };
@@ -86,7 +86,7 @@ export type SentimentProps = {
86
86
  reasons?: {
87
87
  enable: boolean;
88
88
  label?: string;
89
- multi?: boolean;
89
+ component?: string;
90
90
  items: string[];
91
91
  };
92
92
  };
@@ -108,7 +108,7 @@ export type ReasonsProps = {
108
108
  onChange: (value: string[]) => void;
109
109
  settings: {
110
110
  label?: string;
111
- multi?: boolean;
111
+ component?: string;
112
112
  items: string[];
113
113
  };
114
114
  className?: string;
package/src/config.ts CHANGED
@@ -458,7 +458,11 @@ export const themeConfigSchema = {
458
458
  label: { type: 'string' },
459
459
  submitText: { type: 'string' },
460
460
  buttonText: { type: 'string' },
461
- multi: { type: 'boolean' },
461
+ component: {
462
+ type: 'string',
463
+ enum: ['radio', 'checkbox'],
464
+ default: 'checkbox',
465
+ },
462
466
  items: { type: 'array', items: { type: 'string' }, minItems: 1 },
463
467
  leftScaleLabel: { type: 'string' },
464
468
  rightScaleLabel: { type: 'string' },
@@ -466,7 +470,11 @@ export const themeConfigSchema = {
466
470
  type: 'object',
467
471
  properties: {
468
472
  enable: { type: 'boolean', default: true },
469
- multi: { type: 'boolean' },
473
+ component: {
474
+ type: 'string',
475
+ enum: ['radio', 'checkbox'],
476
+ default: 'checkbox',
477
+ },
470
478
  label: { type: 'string' },
471
479
  items: { type: 'array', items: { type: 'string' } },
472
480
  },