Color relief support and hillshading improvements. (#1371)

## Launch Checklist

This adds support for `relief-color` property so that it will create an
elevation expression when the button is pressed.
It also adds support for `colorArray` and `numberArray` types so that
the user would be able to add the relevant information.

Before:
<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/250abd81-6176-4711-a1ee-d33d443932d7"
/>

<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/6a1bb268-66db-42a1-97fc-33e5a40863b6"
/>


After:
<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/8ebaa1ea-4ef9-4aed-abcd-3c8b0057ea76"
/>

<img width="403" height="324" alt="image"
src="https://github.com/user-attachments/assets/e0728c92-85f9-4b86-8635-8877cf257b2f"
/>


 - [x] Briefly describe the changes in this PR.
- [x] Include before/after visuals or gifs if this PR includes visual
changes.
 - [x] Write tests for all new functionality.
 - [x] Add an entry to `CHANGELOG.md` under the `## main` section.

---------

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>

src/components/InputSpec.tsx

@@ -13,12 +13,14 @@ import capitalize from 'lodash.capitalize'
 
 const iconProperties = ['background-pattern', 'fill-pattern', 'line-pattern', 'fill-extrusion-pattern', 'icon-image']
 
+export type FieldSpecType = 'number' | 'enum' | 'resolvedImage' | 'formatted' | 'string' | 'color' | 'boolean' | 'array' | 'numberArray' | 'padding' | 'colorArray' | 'variableAnchorOffsetCollection';
+
 export type InputSpecProps = {
   onChange?(fieldName: string | undefined, value: number | undefined | (string | number | undefined)[]): unknown
   fieldName?: string
   fieldSpec?: {
     default?: unknown
-    type?: 'number' | 'enum' | 'resolvedImage' | 'formatted' | 'string' | 'color' | 'boolean' | 'array'
+    type?: FieldSpecType
     minimum?: number
     maximum?: number
     values?: unknown[]
@@ -114,7 +116,33 @@ export default class InputSpec extends React.Component<InputSpecProps> {
           />
         }
       }
-    default: return null
+    case 'numberArray': return (
+      <InputDynamicArray
+        {...commonProps as InputDynamicArrayProps}
+        fieldSpec={this.props.fieldSpec}
+        type="number"
+        value={(Array.isArray(this.props.value) ? this.props.value : [this.props.value]) as (string | number | undefined)[]}
+      />
+    )
+    case 'colorArray': return (
+      <InputDynamicArray
+        {...commonProps as InputDynamicArrayProps}
+        fieldSpec={this.props.fieldSpec}
+        type="color"
+        value={(Array.isArray(this.props.value) ? this.props.value : [this.props.value]) as (string | number | undefined)[]}
+      />
+    )
+    case 'padding': return (
+      <InputArray
+        {...commonProps as InputArrayProps}
+        type="number"
+        value={(Array.isArray(this.props.value) ? this.props.value : [this.props.value]) as (string | number | undefined)[]}
+        length={4}
+      />
+    )
+    default:
+      console.warn(`No proper field input for ${this.props.fieldName} type: ${this.props.fieldSpec?.type}`);
+      return null
     }
   }