feat: refactor ProviderForm component with new subcomponents (#13)

* feat: refactor ProviderForm component with new subcomponents

- Introduced PresetSelector, ApiKeyInput, ClaudeConfigEditor, and CodexConfigEditor for improved modularity and readability.
- Simplified preset selection logic for both Claude and Codex configurations.
- Enhanced API Key input handling with dedicated components for better user experience.
- Removed redundant code and improved state management in the ProviderForm component.

* feat: add Kimi model selection to ProviderForm component

- Introduced KimiModelSelector for enhanced model configuration options.
- Implemented state management for Kimi model selection, including initialization and updates based on preset selection.
- Improved user experience by conditionally displaying the Kimi model selector based on the selected preset.
- Refactored related logic to ensure proper handling of Kimi-specific settings in the ProviderForm.

* feat: enhance API Key input and model selection in ProviderForm

- Added toggle functionality to show/hide API Key in ApiKeyInput component for improved user experience.
- Updated placeholder text in ProviderForm to provide clearer instructions based on the selected preset.
- Enhanced KimiModelSelector to display a more informative message when API Key is not provided.
- Refactored provider presets to remove hardcoded API Key values for better security practices.

* fix(kimi): optimize debounce implementation in model selector

- Fix initial state: use empty string instead of apiKey.trim()
- Refactor fetchModels to fetchModelsWithKey with explicit key parameter
- Ensure consistent behavior between auto-fetch and manual refresh
- Eliminate mental overhead from optional parameter fallback logic

* fix(api-key): remove custom masking logic, use native password input

- Remove getDisplayValue function with custom star masking
- Use native browser password input behavior for better UX consistency
- Simplify component logic while maintaining show/hide toggle functionality

* chore: format code with prettier

- Apply consistent code formatting across all TypeScript files
- Fix indentation and spacing according to project style guide

---------

Co-authored-by: Jason <farion1231@gmail.com>

src/components/ProviderForm/ClaudeConfigEditor.tsx

@@ -0,0 +1,54 @@
+import React from "react";
+import JsonEditor from "../JsonEditor";
+
+interface ClaudeConfigEditorProps {
+  value: string;
+  onChange: (value: string) => void;
+  disableCoAuthored: boolean;
+  onCoAuthoredToggle: (checked: boolean) => void;
+}
+
+const ClaudeConfigEditor: React.FC<ClaudeConfigEditorProps> = ({
+  value,
+  onChange,
+  disableCoAuthored,
+  onCoAuthoredToggle,
+}) => {
+  return (
+    <div className="space-y-2">
+      <div className="flex items-center justify-between">
+        <label
+          htmlFor="settingsConfig"
+          className="block text-sm font-medium text-[var(--color-text-primary)]"
+        >
+          Claude Code 配置 (JSON) *
+        </label>
+        <label className="inline-flex items-center gap-2 text-sm text-[var(--color-text-secondary)] cursor-pointer">
+          <input
+            type="checkbox"
+            checked={disableCoAuthored}
+            onChange={(e) => onCoAuthoredToggle(e.target.checked)}
+            className="w-4 h-4 text-[var(--color-primary)] bg-white border-[var(--color-border)] rounded focus:ring-[var(--color-primary)] focus:ring-2"
+          />
+          禁止 Claude Code 签名
+        </label>
+      </div>
+      <JsonEditor
+        value={value}
+        onChange={onChange}
+        placeholder={`{
+  "env": {
+    "ANTHROPIC_BASE_URL": "https://api.anthropic.com",
+    "ANTHROPIC_AUTH_TOKEN": "sk-your-api-key-here"
+  }
+}`}
+        rows={12}
+      />
+      <p className="text-xs text-[var(--color-text-secondary)]">
+        完整的 Claude Code settings.json 配置内容
+      </p>
+    </div>
+  );
+};
+
+export default ClaudeConfigEditor;