# EditSettingValue

A component responsible for rendering the correct input field when a setting is in edit mode within the `SettingField` component. It selects and configures the appropriate `react-final-form` `<Field>`-wrapped input component (`@folio/stripes/components` `TextField`, `Select`, or a custom `RefdataButtons` component) based on the `settingType` specified in the setting's configuration (`currentSetting` prop).

This component is designed to be rendered by `SettingField` when the `editing` prop is true. It receives form control props (`input`) from the parent `react-final-form` `<Field>` and contextual data (`refdata`, `templates`) needed for specific input types like dropdowns or radio buttons. It ensures that the edited value is correctly bound to the `.value` property of the setting object within the form state.

## Basic Usage

`EditSettingValue` is used internally by the `SettingField` component when its `editing` prop is true. It's not typically instantiated directly in application code but rather chosen dynamically by `SettingField`.

```jsx
// EditSettingValue is used internally by the SettingField component
// when its 'editing' prop is true.

// Simplified structure within SettingField's render method:
import EditSettingValue from './EditSettingValue'; // Adjust path
import RenderSettingValue from './RenderSettingValue'; // For comparison

const SettingField = ({ editing, input, meta, currentSetting, refdata, templates, ...rest }) => {
  // ... other logic like fetching refdata/templates ...

  let RenderFunction;
  if (editing === false) {
    // When not editing, SettingField uses RenderSettingValue
    RenderFunction = RenderSettingValue;
  } else {
    // When editing is true, SettingField switches to EditSettingValue:
    RenderFunction = EditSettingValue;
  }

  return (
    <Card /* Card setup */ >
      {/* RenderFunction will be EditSettingValue when editing is true */}
      <RenderFunction
        currentSetting={currentSetting}
        input={input} // Passed from the parent <Field>
        meta={meta} // Also passed from the parent <Field>
        refdata={refdata} // Fetched refdata if settingType is 'Refdata'
        templates={templates} // Fetched templates if settingType is 'Template'
        {...rest} // Other relevant props like intlKey, intlNS, labelOverrides etc.
      />
    </Card>
  );
};
```

The specific input rendered depends on `currentSetting.settingType`:
* **'Refdata'**: Renders `<Select>` or `<RefdataButtons>` based on the number of options in the `refdata` prop.
* **'Password'**: Renders `<TextField type="password">`.
* **'Template'**: Renders `<Select>` populated from the `templates` prop.
* **Default/Other**: Renders a standard `<TextField>`.

## Props

| Name             | Type     | Description                                                                                                                                                                                                                                                                    | default     | required                            |
|------------------|----------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-------------|-------------------------------------|
| `currentSetting` | `object` | The configuration object for the setting being edited. Its `settingType` property dictates which input component is rendered, and `key` is used for generating labels.                                                                                                         | `undefined` | ✓                                   |
| `input`          | `object` | Provided by the parent `react-final-form` `<Field>`. Contains the field's `name`, `value`, `onChange`, `onBlur`, etc., connecting the rendered input to the form state. The component uses `input.name` to construct the name for the nested field (e.g., `parentName.value`). | `undefined` | ✓                                   |
| `intlKey`        | `string` | Base key for internationalization passed to the `useKintIntl` hook, used for generating the `aria-label`.                                                                                                                                                                      | `undefined` | ✕                                   |
| `intlNS`         | `string` | Namespace for internationalization passed to the `useKintIntl` hook, used for generating the `aria-label`.                                                                                                                                                                     | `undefined` | ✕                                   |
| `labelOverrides` | `object` | An object potentially containing overrides for specific internationalization message IDs used in this component (e.g., `valueFor`).                                                                                                                                            | `{}`        | ✕                                   |
| `refdata`        | `array`  | An array of reference data objects (typically `{ id, value, label }`). Expected to be provided if `currentSetting.settingType` is 'Refdata'. Used to populate the `Select` or `RefdataButtons` component.                                                                      | `undefined` | Conditional (✓ for 'Refdata' type)  |
| `templates`      | `array`  | An array of template objects (expected shape `{ id, name }`). Expected to be provided if `currentSetting.settingType` is 'Template'. Used to populate the `Select` component.                                                                                                  | `undefined` | Conditional (✓ for 'Template' type) |