optimized-react-component-library-xyz123 0.1.23 → 0.1.25

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 (3) hide show
  1. package/dist/index.js +43 -69
  2. package/dist/index.mjs +43 -69
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -135,9 +135,6 @@ var MultipleCheckboxes = ({
135
135
  }) => {
136
136
  var _a;
137
137
  const questionId = `question-${question.id}`;
138
- const groupId = `checkbox-group-${question.id}`;
139
- const helpTextId = `help-text-${question.id}`;
140
- const errorId = `error-text-${question.id}`;
141
138
  const [checkedValues, setCheckedValues] = (0, import_react.useState)([]);
142
139
  (0, import_react.useEffect)(() => {
143
140
  var _a2;
@@ -159,65 +156,32 @@ var MultipleCheckboxes = ({
159
156
  const e = { target: { value: updatedValues.toString() } };
160
157
  isTouched(e, question);
161
158
  };
162
- const describedByIds = [
163
- !((question.id === 100 || question.id === 101) && question.hasValidationError) && helpTextId,
164
- question.hasValidationError && errorId
165
- ].filter(Boolean).join(" ");
166
159
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
167
- !showPreview && question.visible && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { id: questionId, className: "pts-root-question pts-multipleCheckboxes-container", children: [
168
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("p", { id: helpTextId, className: "sr-only", children: [
169
- question.aboutText,
170
- ' "Felmeddelande" ',
171
- question.validationDefaultMessesege
160
+ !showPreview && question.visible && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { id: questionId, className: "pts-root-question pts-multipleCheckboxes-container", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("section", { role: "group", "aria-labelledby": `label-${questionId}`, children: [
161
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("h4", { id: `label-${questionId}`, children: [
162
+ question.questionLabel,
163
+ " ",
164
+ question.isQuestionMandatory && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-hidden": true, className: "pts-root-mandatoryAsterisk", children: "*" }),
165
+ " "
172
166
  ] }),
173
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { id: errorId, className: "sr-only", children: question.validationDefaultMessesege }),
174
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
175
- "fieldset",
176
- {
177
- "aria-labelledby": `label-${groupId}`,
178
- "aria-required": question.isQuestionMandatory || void 0,
179
- "aria-invalid": question.hasValidationError,
180
- "aria-describedby": describedByIds || void 0,
181
- children: [
182
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("legend", { id: `label-${groupId}`, children: [
183
- (question.id === 200 || question.id === 205) && question.hasValidationError && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: "sr-only", children: [
184
- question.aboutText,
185
- " Felmeddelande. ",
186
- question.validationDefaultMessesege
187
- ] }),
188
- /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("h4", { children: [
189
- question.questionLabel,
190
- " ",
191
- question.isQuestionMandatory && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-hidden": true, className: "pts-root-mandatoryAsterisk", children: "*" }),
192
- " "
193
- ] })
194
- ] }),
195
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { children: (_a = question.options) == null ? void 0 : _a.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
196
- " ",
197
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
198
- "input",
199
- {
200
- type: "checkbox",
201
- name: `${groupId}-option-${index}`,
202
- id: `${groupId}-option-${index}`,
203
- value: option.label,
204
- checked: checkedValues.includes(option.label),
205
- onChange: (e) => handleInputChange(e, option.label),
206
- className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
207
- "aria-describedby": index === 0 && question.hasValidationError ? `${helpTextId}` : void 0
208
- },
209
- index
210
- ),
211
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("label", { htmlFor: `${groupId}-option-${index}`, children: option.label })
212
- ] }) })) }),
213
- question.hasValidationError && question.questionExtraAttribute && !question.questionExtraAttribute.hideValidationMessage && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "pts-root-error", id: errorId, children: [
214
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
215
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-label": "Felmeddelande.", className: "errorText", children: question.validationDefaultMessesege })
216
- ] })
217
- ]
218
- }
219
- )
220
- ] }),
167
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { children: (_a = question.options) == null ? void 0 : _a.map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
168
+ " ",
169
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
170
+ "input",
171
+ {
172
+ type: "checkbox",
173
+ name: `${question.id}-option-${index}`,
174
+ id: `${question.id}-option-${index}`,
175
+ value: option.label,
176
+ checked: checkedValues.includes(option.label),
177
+ onChange: (e) => handleInputChange(e, option.label),
178
+ className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0
179
+ },
180
+ index
181
+ ),
182
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("label", { htmlFor: `${question.id}-option-${index}`, children: option.label })
183
+ ] }) })) })
184
+ ] }) }),
221
185
  " ",
222
186
  showPreview && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(PrevieMultipleCheckboxes, { activatedLanguage, question })
223
187
  ] });
@@ -229,13 +193,20 @@ var PrevieMultipleCheckboxes = ({
229
193
  }) => {
230
194
  var _a, _b;
231
195
  const previewId = `preview-${question.id}`;
232
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "pts-question-preview pts-multipleCheckboxes-preview", id: `question-${previewId}`, children: [
233
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { id: previewId, children: (_a = question.previewLabel) != null ? _a : question.questionLabel }),
234
- /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "pts-root-answer", children: question.answer ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { "aria-labelledby": previewId, children: (_b = question.options) == null ? void 0 : _b.filter((option) => {
235
- var _a2;
236
- return (_a2 = question.answer) == null ? void 0 : _a2.includes(option.label);
237
- }).map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("li", { children: option.label }, index)) }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "no-answer-preview-page", children: activatedLanguage === "en" ? "No Answer" : "Inget svar" }) })
238
- ] }) });
196
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
197
+ "div",
198
+ {
199
+ className: "pts-question-preview pts-multipleCheckboxes-preview",
200
+ id: `question-${previewId}`,
201
+ children: [
202
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("h3", { id: previewId, children: (_a = question.previewLabel) != null ? _a : question.questionLabel }),
203
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "pts-root-answer", children: question.answer ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { "aria-labelledby": previewId, children: (_b = question.options) == null ? void 0 : _b.filter((option) => {
204
+ var _a2;
205
+ return (_a2 = question.answer) == null ? void 0 : _a2.includes(option.label);
206
+ }).map((option, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("li", { children: option.label }, index)) }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "no-answer-preview-page", children: activatedLanguage === "en" ? "No Answer" : "Inget svar" }) })
207
+ ]
208
+ }
209
+ ) });
239
210
  };
240
211
 
241
212
  // src/NewInputComponentStandard/TextAreaStandard/TextAreaStandard.tsx
@@ -953,10 +924,13 @@ function groupQuestionsByStepCategoryGroup(questions, steps, validationErrorsLis
953
924
  questionGroups.push({
954
925
  questionGroupId: groupId,
955
926
  questionGroupType: questions2[0].questionGroupType,
956
- questions: questions2
927
+ questions: questions2,
928
+ legend: questions2[0].categoryDescription
957
929
  });
958
930
  }
959
- const isVisible = questionGroups.some((group) => group.questions.some((question) => question.visible));
931
+ const isVisible = questionGroups.some(
932
+ (group) => group.questions.some((question) => question.visible)
933
+ );
960
934
  categories.push({
961
935
  category,
962
936
  visible: isVisible,
package/dist/index.mjs CHANGED
@@ -71,9 +71,6 @@ var MultipleCheckboxes = ({
71
71
  }) => {
72
72
  var _a;
73
73
  const questionId = `question-${question.id}`;
74
- const groupId = `checkbox-group-${question.id}`;
75
- const helpTextId = `help-text-${question.id}`;
76
- const errorId = `error-text-${question.id}`;
77
74
  const [checkedValues, setCheckedValues] = useState([]);
78
75
  useEffect(() => {
79
76
  var _a2;
@@ -95,65 +92,32 @@ var MultipleCheckboxes = ({
95
92
  const e = { target: { value: updatedValues.toString() } };
96
93
  isTouched(e, question);
97
94
  };
98
- const describedByIds = [
99
- !((question.id === 100 || question.id === 101) && question.hasValidationError) && helpTextId,
100
- question.hasValidationError && errorId
101
- ].filter(Boolean).join(" ");
102
95
  return /* @__PURE__ */ jsxs2(Fragment2, { children: [
103
- !showPreview && question.visible && /* @__PURE__ */ jsxs2("div", { id: questionId, className: "pts-root-question pts-multipleCheckboxes-container", children: [
104
- /* @__PURE__ */ jsxs2("p", { id: helpTextId, className: "sr-only", children: [
105
- question.aboutText,
106
- ' "Felmeddelande" ',
107
- question.validationDefaultMessesege
96
+ !showPreview && question.visible && /* @__PURE__ */ jsx2("div", { id: questionId, className: "pts-root-question pts-multipleCheckboxes-container", children: /* @__PURE__ */ jsxs2("section", { role: "group", "aria-labelledby": `label-${questionId}`, children: [
97
+ /* @__PURE__ */ jsxs2("h4", { id: `label-${questionId}`, children: [
98
+ question.questionLabel,
99
+ " ",
100
+ question.isQuestionMandatory && /* @__PURE__ */ jsx2("span", { "aria-hidden": true, className: "pts-root-mandatoryAsterisk", children: "*" }),
101
+ " "
108
102
  ] }),
109
- /* @__PURE__ */ jsx2("p", { id: errorId, className: "sr-only", children: question.validationDefaultMessesege }),
110
- /* @__PURE__ */ jsxs2(
111
- "fieldset",
112
- {
113
- "aria-labelledby": `label-${groupId}`,
114
- "aria-required": question.isQuestionMandatory || void 0,
115
- "aria-invalid": question.hasValidationError,
116
- "aria-describedby": describedByIds || void 0,
117
- children: [
118
- /* @__PURE__ */ jsxs2("legend", { id: `label-${groupId}`, children: [
119
- (question.id === 200 || question.id === 205) && question.hasValidationError && /* @__PURE__ */ jsxs2("span", { className: "sr-only", children: [
120
- question.aboutText,
121
- " Felmeddelande. ",
122
- question.validationDefaultMessesege
123
- ] }),
124
- /* @__PURE__ */ jsxs2("h4", { children: [
125
- question.questionLabel,
126
- " ",
127
- question.isQuestionMandatory && /* @__PURE__ */ jsx2("span", { "aria-hidden": true, className: "pts-root-mandatoryAsterisk", children: "*" }),
128
- " "
129
- ] })
130
- ] }),
131
- /* @__PURE__ */ jsx2("ul", { children: (_a = question.options) == null ? void 0 : _a.map((option, index) => /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsxs2(Fragment2, { children: [
132
- " ",
133
- /* @__PURE__ */ jsx2(
134
- "input",
135
- {
136
- type: "checkbox",
137
- name: `${groupId}-option-${index}`,
138
- id: `${groupId}-option-${index}`,
139
- value: option.label,
140
- checked: checkedValues.includes(option.label),
141
- onChange: (e) => handleInputChange(e, option.label),
142
- className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0,
143
- "aria-describedby": index === 0 && question.hasValidationError ? `${helpTextId}` : void 0
144
- },
145
- index
146
- ),
147
- /* @__PURE__ */ jsx2("label", { htmlFor: `${groupId}-option-${index}`, children: option.label })
148
- ] }) })) }),
149
- question.hasValidationError && question.questionExtraAttribute && !question.questionExtraAttribute.hideValidationMessage && /* @__PURE__ */ jsxs2("div", { className: "pts-root-error", id: errorId, children: [
150
- /* @__PURE__ */ jsx2("span", { "aria-hidden": true, className: "errorDot", children: "!" }),
151
- /* @__PURE__ */ jsx2("span", { "aria-label": "Felmeddelande.", className: "errorText", children: question.validationDefaultMessesege })
152
- ] })
153
- ]
154
- }
155
- )
156
- ] }),
103
+ /* @__PURE__ */ jsx2("ul", { children: (_a = question.options) == null ? void 0 : _a.map((option, index) => /* @__PURE__ */ jsx2("li", { children: /* @__PURE__ */ jsxs2(Fragment2, { children: [
104
+ " ",
105
+ /* @__PURE__ */ jsx2(
106
+ "input",
107
+ {
108
+ type: "checkbox",
109
+ name: `${question.id}-option-${index}`,
110
+ id: `${question.id}-option-${index}`,
111
+ value: option.label,
112
+ checked: checkedValues.includes(option.label),
113
+ onChange: (e) => handleInputChange(e, option.label),
114
+ className: question.hasValidationError ? "pts-root-question-input-error-border" : void 0
115
+ },
116
+ index
117
+ ),
118
+ /* @__PURE__ */ jsx2("label", { htmlFor: `${question.id}-option-${index}`, children: option.label })
119
+ ] }) })) })
120
+ ] }) }),
157
121
  " ",
158
122
  showPreview && /* @__PURE__ */ jsx2(PrevieMultipleCheckboxes, { activatedLanguage, question })
159
123
  ] });
@@ -165,13 +129,20 @@ var PrevieMultipleCheckboxes = ({
165
129
  }) => {
166
130
  var _a, _b;
167
131
  const previewId = `preview-${question.id}`;
168
- return /* @__PURE__ */ jsx2(Fragment2, { children: /* @__PURE__ */ jsxs2("div", { className: "pts-question-preview pts-multipleCheckboxes-preview", id: `question-${previewId}`, children: [
169
- /* @__PURE__ */ jsx2("h3", { id: previewId, children: (_a = question.previewLabel) != null ? _a : question.questionLabel }),
170
- /* @__PURE__ */ jsx2("div", { className: "pts-root-answer", children: question.answer ? /* @__PURE__ */ jsx2("ul", { "aria-labelledby": previewId, children: (_b = question.options) == null ? void 0 : _b.filter((option) => {
171
- var _a2;
172
- return (_a2 = question.answer) == null ? void 0 : _a2.includes(option.label);
173
- }).map((option, index) => /* @__PURE__ */ jsx2("li", { children: option.label }, index)) }) : /* @__PURE__ */ jsx2("span", { className: "no-answer-preview-page", children: activatedLanguage === "en" ? "No Answer" : "Inget svar" }) })
174
- ] }) });
132
+ return /* @__PURE__ */ jsx2(Fragment2, { children: /* @__PURE__ */ jsxs2(
133
+ "div",
134
+ {
135
+ className: "pts-question-preview pts-multipleCheckboxes-preview",
136
+ id: `question-${previewId}`,
137
+ children: [
138
+ /* @__PURE__ */ jsx2("h3", { id: previewId, children: (_a = question.previewLabel) != null ? _a : question.questionLabel }),
139
+ /* @__PURE__ */ jsx2("div", { className: "pts-root-answer", children: question.answer ? /* @__PURE__ */ jsx2("ul", { "aria-labelledby": previewId, children: (_b = question.options) == null ? void 0 : _b.filter((option) => {
140
+ var _a2;
141
+ return (_a2 = question.answer) == null ? void 0 : _a2.includes(option.label);
142
+ }).map((option, index) => /* @__PURE__ */ jsx2("li", { children: option.label }, index)) }) : /* @__PURE__ */ jsx2("span", { className: "no-answer-preview-page", children: activatedLanguage === "en" ? "No Answer" : "Inget svar" }) })
143
+ ]
144
+ }
145
+ ) });
175
146
  };
176
147
 
177
148
  // src/NewInputComponentStandard/TextAreaStandard/TextAreaStandard.tsx
@@ -889,10 +860,13 @@ function groupQuestionsByStepCategoryGroup(questions, steps, validationErrorsLis
889
860
  questionGroups.push({
890
861
  questionGroupId: groupId,
891
862
  questionGroupType: questions2[0].questionGroupType,
892
- questions: questions2
863
+ questions: questions2,
864
+ legend: questions2[0].categoryDescription
893
865
  });
894
866
  }
895
- const isVisible = questionGroups.some((group) => group.questions.some((question) => question.visible));
867
+ const isVisible = questionGroups.some(
868
+ (group) => group.questions.some((question) => question.visible)
869
+ );
896
870
  categories.push({
897
871
  category,
898
872
  visible: isVisible,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "optimized-react-component-library-xyz123",
3
- "version": "0.1.23",
3
+ "version": "0.1.25",
4
4
  "description": "A modern React component library using TypeScript with React 19 support.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",