Fix: UI adjustments, replacing private components with public components (#11438)

### What problem does this PR solve?

Fix: UI adjustments, replacing private components with public components

- UI adjustments for public components (input, multiselect,
SliderInputFormField)

- Replacing the private LlmSettingFieldItems component in search with
the public LlmSettingFieldItems component


### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/components/llm-setting-items/slider.tsx

@@ -22,6 +22,7 @@ type SliderInputSwitchFormFieldProps = {
   onChange?: (value: number) => void;
   className?: string;
   checkName: string;
+  numberInputClassName?: string;
 };
 
 export function SliderInputSwitchFormField({
@@ -34,6 +35,7 @@ export function SliderInputSwitchFormField({
   onChange,
   className,
   checkName,
+  numberInputClassName,
 }: SliderInputSwitchFormFieldProps) {
   const form = useFormContext();
   const disabled = !form.watch(checkName);
@@ -81,7 +83,10 @@ export function SliderInputSwitchFormField({
             <FormControl>
               <NumberInput
                 disabled={disabled}
-                className="h-7 w-20"
+                className={cn(
+                  'h-6 w-10 p-1 border border-border-button rounded-sm',
+                  numberInputClassName,
+                )}
                 max={max}
                 min={min}
                 step={step}