@omniumretail/component-library 1.1.52 → 1.1.53

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 (14) hide show
  1. package/dist/bundle.js +1 -1
  2. package/dist/main.css +1 -1
  3. package/dist/types/components/Questions/SingleQuestion/index.d.ts +1 -1
  4. package/dist/types/components/Questions/index.d.ts +1 -0
  5. package/package.json +1 -1
  6. package/src/components/Category/Category.stories.tsx +13 -0
  7. package/src/components/Category/CategoryContent/index.tsx +19 -27
  8. package/src/components/Category/CategoryContent/styles.module.scss +1 -0
  9. package/src/components/Questions/SingleQuestion/index.tsx +19 -2
  10. package/src/components/Questions/SingleQuestion/styles.module.scss +8 -0
  11. package/src/components/Questions/index.tsx +5 -2
  12. package/src/locales/en.json +3 -1
  13. package/src/locales/es.json +3 -1
  14. package/src/locales/pt.json +3 -1
package/dist/main.css CHANGED
@@ -18,7 +18,7 @@
18
18
  .gER2xKwlnobsIz4BLhGJ{background-color:var(--color-grey) !important}.gER2xKwlnobsIz4BLhGJ[aria-checked=true]{background:var(--color-orange) !important}
19
19
  .lOKzfPUFf3ukLT2wGZaY{display:grid;grid-template-columns:300px auto;gap:16px}.OIrZOBn2f036M5MGzc61,.adDQP_uvIYgNFVC4VdHj{background:#fff;padding:20px;overflow:auto}
20
20
  .yBjbWkudwA_AOwhHrnlc .ant-tree-title{font-weight:var(--font-weight-semibold)}.yBjbWkudwA_AOwhHrnlc button{margin-top:32px;width:100%}.yBjbWkudwA_AOwhHrnlc button:nth-child(3){margin-top:12px}.je000VEfsPqZupGr8ymu{font-size:var(--font-size-body-4);font-weight:600;line-height:100%;color:var(--color-blue);text-transform:uppercase}.tUDGWNXopUejF6zWJloy{margin-top:20px}
21
- .O0Juh2loT1HHb612gOA4 .ant-form-item{margin-bottom:0}.O0Juh2loT1HHb612gOA4 .ant-space{display:flex;flex-direction:column;gap:12px;border-bottom:1px solid var(--color-blue);padding:16px 10px}.O0Juh2loT1HHb612gOA4 .ant-space-item{width:100%}.hg7oiINfKCZSUt6dEq4A{display:none}.BAso_dbeoowN7VtxWiKx{display:grid;grid-template-columns:minmax(18px, auto) 1fr 90px;gap:20px;color:var(--color-black);font-size:var(--font-size-body-4);line-height:100%;font-weight:var(--font-weight-medium);align-items:center}.qg_bZXG9dQdJvLBRGuqw{display:grid;grid-template-columns:minmax(18px, auto) 1fr 90px;gap:20px;color:var(--color-grey-dark);font-size:var(--font-size-body-3);align-items:center}.GbZVOtcaUURjn4CweVjF{display:flex;gap:40px;font-size:var(--font-size-body-3);align-items:center}.C3Qrjv76hDipL39fyfzf{display:flex;align-items:center;gap:8px}.y8UJFmCyGQzEQk4XjnI9{display:none}.kknDal3CIbUXI7Lu2wPV{display:flex;align-items:center;justify-content:flex-start;gap:20px}.upuPapYjj1uGowukEEIi{display:none;align-items:center;justify-content:center}.KfrJPVKxY4b6bmXeJL5U{display:flex;align-items:center;justify-content:center;gap:16px}.zRPlv7rfSSACHPLZLs16,.EHyxN8DmDHOLkQDROSV5,.NLIlnBPfo09cpWYzpZ_J{font-size:var(--font-size-body-5);cursor:pointer}.AHIc83P7PkYUr3no83sO{margin-top:24px}
21
+ .O0Juh2loT1HHb612gOA4 .ant-form-item{margin-bottom:0}.O0Juh2loT1HHb612gOA4 .ant-space{display:flex;flex-direction:column;gap:12px;border-bottom:1px solid var(--color-blue);padding:16px 10px}.O0Juh2loT1HHb612gOA4 .ant-space-item{width:100%}.hg7oiINfKCZSUt6dEq4A{display:none}.BAso_dbeoowN7VtxWiKx{display:grid;grid-template-columns:minmax(18px, auto) 1fr 90px;gap:20px;color:var(--color-black);font-size:var(--font-size-body-4);line-height:100%;font-weight:var(--font-weight-medium);align-items:center}.qg_bZXG9dQdJvLBRGuqw{display:grid;grid-template-columns:minmax(18px, auto) 1fr 90px;gap:20px;color:var(--color-grey-dark);font-size:var(--font-size-body-3);align-items:center}.GbZVOtcaUURjn4CweVjF{display:flex;gap:40px;font-size:var(--font-size-body-3);align-items:center}.C3Qrjv76hDipL39fyfzf{display:flex;align-items:center;gap:8px}.y8UJFmCyGQzEQk4XjnI9{display:none}.kknDal3CIbUXI7Lu2wPV{display:flex;align-items:center;justify-content:flex-start;gap:20px}.CIMvcFtQWcBY31wttg2C{min-width:250px}@media(max-width: 768px){.CIMvcFtQWcBY31wttg2C{min-width:150px}}.upuPapYjj1uGowukEEIi{display:none;align-items:center;justify-content:center}.KfrJPVKxY4b6bmXeJL5U{display:flex;align-items:center;justify-content:center;gap:16px}.zRPlv7rfSSACHPLZLs16,.EHyxN8DmDHOLkQDROSV5,.NLIlnBPfo09cpWYzpZ_J{font-size:var(--font-size-body-5);cursor:pointer}.AHIc83P7PkYUr3no83sO{margin-top:24px}
22
22
  .vw302ajYc4_7bIROncyM{font-size:var(--font-size-body-4);font-weight:600;line-height:100%;color:var(--color-blue);text-transform:uppercase;margin-bottom:32px}.DrsaZTs1Ny6wZ76RwDR9{font-size:var(--font-size-body-2);color:var(--color-black);font-weight:700;text-transform:uppercase}.HVSssNqaNxLcYT_1lxBL{display:grid;grid-template-columns:minmax(200px, 1fr) auto auto auto auto;gap:46px}.ACPbYsV0wNkissVLHcFh{margin-top:16px}Label{margin-bottom:8px}.mIHYAri6ebHm4Oeb1ogj{min-width:200px}@media(max-width: 768px){.mIHYAri6ebHm4Oeb1ogj{min-width:150px}}.g19LZsD26yzPPjBtV31w .ant-select{width:100%}.g19LZsD26yzPPjBtV31w .ant-select-selector{border-color:rgba(var(--color-black-rgb), 0.5) !important;height:50px !important;display:flex;align-items:center}.g19LZsD26yzPPjBtV31w .ant-select-arrow{color:var(--color-black)}.g19LZsD26yzPPjBtV31w .ant-switch{width:30px}
23
23
  .j8_c3JHTX0JOkT36fF6A{contain:inline-size}.j8_c3JHTX0JOkT36fF6A .HgmGSts5FIH3osmekIYG{height:50px;width:300px}@media(min-width: 1024px){.j8_c3JHTX0JOkT36fF6A .HgmGSts5FIH3osmekIYG{width:450px}}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .ant-tag{background-color:var(--color-orange);color:var(--color-white);padding:6px 16px;max-width:240px}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .anticon-close{color:var(--color-white);font-size:12px}.j8_c3JHTX0JOkT36fF6A .xlaG0XsJDRR9AClqXzzC .anticon-close:hover{color:var(--color-black)}
24
24
  .BWmwZ5nFKyctBZyOAXzg{width:100%}.GWTSauaAl_v9W8o4YPxW{background:rgba(44,45,46,.0509803922);height:100%;position:relative}.GWTSauaAl_v9W8o4YPxW .ant-menu-light{background-color:rgba(0,0,0,0) !important;border-inline-end:none !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-title-content{font-size:17px;line-height:20px;font-weight:var(--font-weight-semibold)}.GWTSauaAl_v9W8o4YPxW .ant-menu-title-content:hover{color:var(--color-orange)}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-title-content{font-size:15px;line-height:18px;font-weight:var(--font-weight-medium)}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-item{height:30px;line-height:30px;margin-bottom:16px}.GWTSauaAl_v9W8o4YPxW .ant-menu-sub .ant-menu-item:first-child{margin-top:-10px}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu{border-top:1px solid var(--color-orange);border-radius:0}.GWTSauaAl_v9W8o4YPxW .ant-menu-item:hover{background-color:initial !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-item-selected,.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-selected>.ant-menu-submenu-title{color:var(--color-orange);background-color:initial}.GWTSauaAl_v9W8o4YPxW .ant-menu-inline .ant-menu-sub.ant-menu-inline{background:initial}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title{height:50px !important;line-height:50px !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title:hover{background-color:initial !important}.GWTSauaAl_v9W8o4YPxW .ant-menu-submenu-title .anticon{color:var(--color-orange)}.GWTSauaAl_v9W8o4YPxW .ant-menu-inline.ant-menu-root .ant-menu-item>.ant-menu-title-content{overflow-x:auto;text-overflow:unset}.hWGer1IJ7RdkfQWwYfsw{position:absolute;top:24px;left:24px;right:24px;height:144px}.MD1FhirslDDwd2izGwai{font-size:var(--font-size-body-2);line-height:14px;font-weight:var(--font-weight-light);display:inline-block;padding:12px;cursor:pointer;position:absolute;right:0;top:60px}.RxGn4c38kNq8Ai4ypW_x{position:absolute;top:144px;left:24px;right:24px;bottom:0;overflow-y:auto;overflow-x:hidden;padding-bottom:24px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{border-radius:10px;background:rgba(0,0,0,.1)}::-webkit-scrollbar-thumb{border-radius:10px;background:rgba(0,0,0,.2)}::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.4)}::-webkit-scrollbar-thumb:active{background:rgba(0,0,0,.9)}
package/dist/types/components/Questions/SingleQuestion/index.d.ts CHANGED
@@ -1 +1 @@
1
- export declare const SingleQuestion: ({ key, provided, snapshot, remove, name, showGrade, handleChanges, showCheckbox, ...restField }: any) => import("react/jsx-runtime").JSX.Element;
1
+ export declare const SingleQuestion: ({ key, provided, snapshot, remove, name, showGrade, handleChanges, showCheckbox, responseTypeOptions, ...restField }: any) => import("react/jsx-runtime").JSX.Element;
package/dist/types/components/Questions/index.d.ts CHANGED
@@ -2,5 +2,6 @@ export interface QuestionsProps {
2
2
  showGrade?: boolean;
3
3
  showCheckbox?: boolean;
4
4
  handleChanges: any;
5
+ responseTypeOptions: any;
5
6
  }
6
7
  export declare const Questions: (props: QuestionsProps) => import("react/jsx-runtime").JSX.Element;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@omniumretail/component-library",
3
- "version": "1.1.52",
3
+ "version": "1.1.53",
4
4
  "private": false,
5
5
  "main": "dist/bundle.js",
6
6
  "typings": "./dist/types/index",
package/src/components/Category/Category.stories.tsx CHANGED
@@ -89,6 +89,19 @@ const Template: Story<any> = (args) => {
89
89
  },
90
90
  "children": []
91
91
  }
92
+ ]} responseTypeOptions={[
93
+ {
94
+ "value": "B867BEA8-E0A4-44D2-BBDA-7CB89334D80E",
95
+ "label": "teste3Update",
96
+ },
97
+ {
98
+ "value": "B8267BEA8-E0A4-44D2-BBDA-7CB89334D80E",
99
+ "label": "test2eUpdate",
100
+ },
101
+ {
102
+ "value": "B867B4EA8-E0A4-44D2-BBDA-7CB89334D80E",
103
+ "label": "testeU4pdate",
104
+ }
92
105
  ]}></Category>
93
106
  };
94
107
 
package/src/components/Category/CategoryContent/index.tsx CHANGED
@@ -155,7 +155,7 @@ export const CategoryContent = (props: categoryContent) => {
155
155
  }
156
156
 
157
157
  {
158
- (!switchOpenAnswStatus && !switchYesOrNoAnswStatus) &&
158
+ (!switchOpenAnswStatus && !switchYesOrNoAnswStatus && !chooseResponseType) &&
159
159
  <>
160
160
  <div className={styles.generalEvaluationLevel}>
161
161
  <Label isUppercase>
@@ -164,32 +164,23 @@ export const CategoryContent = (props: categoryContent) => {
164
164
  <Form.Item
165
165
  name={['generalEvaluationLevel']}
166
166
  >
167
- {!chooseResponseType ?
168
- < Select
169
- options={[
170
- {
171
- value: '0',
172
- label: '1 a 5',
173
- },
174
- {
175
- value: '1',
176
- label: '1 a 4',
177
- },
178
- {
179
- value: '2',
180
- label: '1 a 5 ou “Não Aplicável”',
181
- },
182
- ]}
183
- onBlur={handleInputChange}
184
- />
185
- :
186
- < Select
187
- options={responseTypeOptions}
188
- onBlur={handleInputChange}
189
- className={styles.selectResponseType}
190
- />
191
- }
192
-
167
+ < Select
168
+ options={[
169
+ {
170
+ value: '0',
171
+ label: '1 a 5',
172
+ },
173
+ {
174
+ value: '1',
175
+ label: '1 a 4',
176
+ },
177
+ {
178
+ value: '2',
179
+ label: '1 a 5 ou “Não Aplicável”',
180
+ },
181
+ ]}
182
+ onBlur={handleInputChange}
183
+ />
193
184
  </Form.Item>
194
185
  </div>
195
186
 
@@ -222,6 +213,7 @@ export const CategoryContent = (props: categoryContent) => {
222
213
  showGrade={(switchOpenAnswStatus || switchYesOrNoAnswStatus || chooseResponseType) === true ? false : true}
223
214
  showCheckbox={chooseResponseType && true}
224
215
  handleChanges={handleInputChange}
216
+ responseTypeOptions={responseTypeOptions}
225
217
  />
226
218
  </Form.Item>
227
219
  </div>
package/src/components/Category/CategoryContent/styles.module.scss CHANGED
@@ -48,6 +48,7 @@ Label {
48
48
  display: flex;
49
49
  align-items: center;
50
50
  }
51
+
51
52
  .ant-select-arrow {
52
53
  color: var(--color-black);
53
54
  }
package/src/components/Questions/SingleQuestion/index.tsx CHANGED
@@ -3,8 +3,9 @@ import { Checkbox, Form, Input, Space } from 'antd';
3
3
  import { t } from 'i18next';
4
4
  import styles from './styles.module.scss';
5
5
  import { useState } from 'react';
6
+ import { Select } from 'antd';
6
7
 
7
- export const SingleQuestion = ({ key, provided, snapshot, remove, name, showGrade, handleChanges, showCheckbox, ...restField }: any) => {
8
+ export const SingleQuestion = ({ key, provided, snapshot, remove, name, showGrade, handleChanges, showCheckbox, responseTypeOptions, ...restField }: any) => {
8
9
  const [mandatoryCheckbox, setMandatoryCheckbox] = useState<boolean>(false);
9
10
  const [emphasisCheckbox, setEmphasisCheckbox] = useState<boolean>(false);
10
11
 
@@ -17,7 +18,7 @@ export const SingleQuestion = ({ key, provided, snapshot, remove, name, showGrad
17
18
  setEmphasisCheckbox(checked);
18
19
  handleChanges();
19
20
  }
20
-
21
+
21
22
  return (
22
23
  <div
23
24
  key={key}
@@ -110,6 +111,22 @@ export const SingleQuestion = ({ key, provided, snapshot, remove, name, showGrad
110
111
 
111
112
  <span>{t('components.category.emphasisAnswer')}</span>
112
113
  </div>
114
+
115
+ <div className={styles.checkboxContainer}>
116
+ <Form.Item
117
+ {...restField}
118
+ name={[name, 'responseType']}
119
+ rules={[{ required: true, message: t('components.category.errorResponseType')! }]}
120
+ >
121
+ <Select
122
+ options={responseTypeOptions}
123
+ onBlur={handleChanges}
124
+ className={styles.selectResponseType}
125
+ />
126
+ </Form.Item>
127
+
128
+ <span>{t('components.category.responseType')}</span>
129
+ </div>
113
130
  </div>
114
131
  }
115
132
  </Space>
package/src/components/Questions/SingleQuestion/styles.module.scss CHANGED
@@ -69,6 +69,14 @@ $questionAndInformationGap: 20px;
69
69
  gap: 20px;
70
70
  }
71
71
 
72
+ .selectResponseType {
73
+ min-width: 250px;
74
+
75
+ @media(max-width: 768px) {
76
+ min-width: 150px;
77
+ }
78
+ }
79
+
72
80
  .notEditing {
73
81
  display: none;
74
82
  align-items: center;
package/src/components/Questions/index.tsx CHANGED
@@ -11,13 +11,15 @@ export interface QuestionsProps {
11
11
  showGrade?: boolean;
12
12
  showCheckbox?: boolean;
13
13
  handleChanges: any;
14
+ responseTypeOptions: any;
14
15
  }
15
16
 
16
17
  export const Questions = (props: QuestionsProps) => {
17
18
  const {
18
19
  showGrade = true,
19
20
  showCheckbox,
20
- handleChanges
21
+ handleChanges,
22
+ responseTypeOptions
21
23
  } = props;
22
24
 
23
25
  const formContext = useContext(FieldContext);
@@ -57,7 +59,8 @@ export const Questions = (props: QuestionsProps) => {
57
59
  name={name}
58
60
  showGrade={showGrade}
59
61
  showCheckbox={showCheckbox}
60
- handleChanges={handleChanges}
62
+ handleChanges={handleChanges}
63
+ responseTypeOptions={responseTypeOptions}
61
64
  />
62
65
  </>
63
66
  )}
package/src/locales/en.json CHANGED
@@ -46,7 +46,9 @@
46
46
  "errorGrade": "Error/Missing Grade",
47
47
  "newCategory": "New Category",
48
48
  "mandatoryAnswer": "Mandatory answer",
49
- "emphasisAnswer": "Highlight"
49
+ "emphasisAnswer": "Highlight",
50
+ "responseType": "Response Type",
51
+ "errorResponseType": "Response type missing"
50
52
  },
51
53
  "categorySidBar": {
52
54
  "addCategory": "Add Category",
package/src/locales/es.json CHANGED
@@ -46,7 +46,9 @@
46
46
  "errorGrade": "Error/Calificación Faltante",
47
47
  "newCategory": "Nueva Categoría",
48
48
  "mandatoryAnswer": "Respuesta obligatoria",
49
- "emphasisAnswer": "Resaltar"
49
+ "emphasisAnswer": "Resaltar",
50
+ "responseType": "Tipo de respuesta",
51
+ "errorResponseType": "Tipo de respuesta faltante"
50
52
  },
51
53
  "categorySidBar": {
52
54
  "addCategory": "Agregar Categoría",
package/src/locales/pt.json CHANGED
@@ -46,7 +46,9 @@
46
46
  "errorGrade": "Ponderação em falta",
47
47
  "newCategory": "Nova categoria",
48
48
  "mandatoryAnswer": "Resposta obrigatória",
49
- "emphasisAnswer": "Destaque"
49
+ "emphasisAnswer": "Destaque",
50
+ "responseType": "Tipo de resposta",
51
+ "errorResponseType": "Tipo de resposta em falta"
50
52
  },
51
53
  "categorySidBar": {
52
54
  "addCategory": "Adicionar categoria",