diff --git a/components/elements/fields/pickListField.js b/components/elements/fields/pickListField.js
new file mode 100644
index 00000000..9e9374ff
--- /dev/null
+++ b/components/elements/fields/pickListField.js
@@ -0,0 +1,29 @@
+import React from "react";
+import useTranslation from "next-translate/useTranslation";
+import { Field } from "redux-form";
+import { RenderPickList } from "./renderPickList";
+
+export function PickList(props) {
+ const { datafieldname } = props;
+ let { t } = useTranslation();
+
+ const required = (value) => {
+ return value || value == 0
+ ? undefined
+ : t("newappeal:is-required-label");
+ };
+
+ return (
+
+ );
+}
diff --git a/components/elements/index.js b/components/elements/index.js
index 3134fee3..cdc5f20d 100644
--- a/components/elements/index.js
+++ b/components/elements/index.js
@@ -23,11 +23,12 @@ import { RenderDatePicker } from "./fields/renderDatePicker";
import { RenderYesNo } from "./fields/renderYesNo";
import { RenderRadio } from "./fields/renderRadio";
import { RenderCheckBox } from "./fields/renderCheckBox";
-import { RenderPickList } from "./fields/renderPickList";
+import { PickList } from "./fields/pickListField";
import { RenderDecimalField } from "./fields/renderDecimalField";
import { RenderFileUpload } from "./fields/renderFileUpload";
export { RenderSubFields } from "./fields/renderSubFields";
export { FieldArrayForm } from "./fields/fieldArrayForm";
+export { PickList };
const getValidationMessages = (t) => ({
requiredMessage: t("newappeal:is-required-label"),
@@ -821,29 +822,6 @@ export function CheckBoxfield(props) {
);
}
-export function PickList(props) {
- const { name, label, datafieldname, hint } = props;
- let { t } = useTranslation();
- const required = (value) => {
- return value || value == 0
- ? undefined
- : t("newappeal:is-required-label");
- };
- return (
-
- );
-}
-
export function NumericField(props) {
const {
name,
diff --git a/memory-bank/change-log.md b/memory-bank/change-log.md
index d0f4f422..f23e2728 100644
--- a/memory-bank/change-log.md
+++ b/memory-bank/change-log.md
@@ -3585,3 +3585,30 @@ Validation:
Follow-ups:
- Continue bounded no-behavior-change slices by removing dead locals/comments and extracting one additional low-risk field wrapper at a time.
+
+---
+
+### CL-101: 22500 `PickList` wrapper extraction from `components/elements/index.js`
+
+date: 2026-04-08
+author: Cline
+scope: `components/elements/index.js`, `components/elements/fields/pickListField.js`
+type: change
+rationale: Execute one bounded Phase 2 renderer/wrapper extraction slice by moving the `PickList` wrapper out of the elements monolith into a dedicated field module.
+impact: No intended behavior change; preserves existing EN/CY translation behavior and validation wiring while reducing `index.js` size/coupling.
+status: completed
+
+Summary:
+
+- Added `components/elements/fields/pickListField.js` and moved the existing `PickList` wrapper implementation.
+- Updated `components/elements/index.js` to import/export `PickList` from the new field module.
+- Removed inline `PickList` wrapper implementation from `index.js`.
+- Removed now-unused `RenderPickList` import from `index.js` after extraction.
+
+Validation:
+
+- `npx eslint components/elements/index.js components/elements/fields/pickListField.js` -> pass
+
+Follow-ups:
+
+- Continue bounded no-behavior-change slices by extracting one additional low-risk wrapper (e.g., `CheckBoxfield`) or removing dead locals/debug logging in place.