mirror of
https://github.com/YspCoder/clawgo.git
synced 2026-05-04 04:27:29 +08:00
refine oauth model selection and provider inputs
This commit is contained in:
@@ -2,7 +2,7 @@ import React from 'react';
|
||||
import { AnimatePresence, motion } from 'motion/react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Button } from './Button';
|
||||
import { TextField } from './FormControls';
|
||||
import { TextField, TextareaField } from './FormControls';
|
||||
|
||||
type DialogOptions = {
|
||||
title?: string;
|
||||
@@ -13,6 +13,9 @@ type DialogOptions = {
|
||||
initialValue?: string;
|
||||
inputLabel?: string;
|
||||
inputPlaceholder?: string;
|
||||
monospace?: boolean;
|
||||
multiline?: boolean;
|
||||
wide?: boolean;
|
||||
};
|
||||
|
||||
export const GlobalDialog: React.FC<{
|
||||
@@ -36,28 +39,40 @@ export const GlobalDialog: React.FC<{
|
||||
{open && (
|
||||
<motion.div className="ui-overlay-strong fixed inset-0 z-[130] backdrop-blur-sm flex items-center justify-center p-4"
|
||||
initial={{ opacity: 0 }} animate={{ opacity: 1 }} exit={{ opacity: 0 }}>
|
||||
<motion.div className="brand-card w-full max-w-md border border-zinc-700 shadow-2xl"
|
||||
<motion.div className={`brand-card w-full border border-zinc-700 shadow-2xl ${options.wide ? 'max-w-2xl' : 'max-w-md'}`}
|
||||
initial={{ scale: 0.95, y: 8 }} animate={{ scale: 1, y: 0 }} exit={{ scale: 0.95, y: 8 }}>
|
||||
<div className="px-5 py-4 border-b border-zinc-800 relative z-[1]">
|
||||
<h3 className="text-sm font-semibold text-zinc-100">{options.title || (kind === 'confirm' ? t('dialogPleaseConfirm') : kind === 'prompt' ? t('dialogInputTitle') : t('dialogNotice'))}</h3>
|
||||
</div>
|
||||
<div className="px-5 py-4 space-y-3 relative z-[1]">
|
||||
<div className="text-sm text-zinc-300 whitespace-pre-wrap">{options.message}</div>
|
||||
<div className="text-sm text-zinc-300 whitespace-pre-wrap break-all">{options.message}</div>
|
||||
{kind === 'prompt' && (
|
||||
<div className="space-y-2">
|
||||
{options.inputLabel && <label className="text-xs text-zinc-400">{options.inputLabel}</label>}
|
||||
<TextField
|
||||
autoFocus
|
||||
value={value}
|
||||
onChange={(e) => setValue(e.target.value)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter') {
|
||||
onConfirm(value);
|
||||
}
|
||||
}}
|
||||
placeholder={options.inputPlaceholder || t('dialogInputPlaceholder')}
|
||||
className="w-full text-zinc-100"
|
||||
/>
|
||||
{options.multiline ? (
|
||||
<TextareaField
|
||||
autoFocus
|
||||
value={value}
|
||||
onChange={(e) => setValue(e.target.value)}
|
||||
placeholder={options.inputPlaceholder || t('dialogInputPlaceholder')}
|
||||
monospace={options.monospace}
|
||||
className="min-h-[96px] w-full text-zinc-100"
|
||||
/>
|
||||
) : (
|
||||
<TextField
|
||||
autoFocus
|
||||
value={value}
|
||||
onChange={(e) => setValue(e.target.value)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter') {
|
||||
onConfirm(value);
|
||||
}
|
||||
}}
|
||||
placeholder={options.inputPlaceholder || t('dialogInputPlaceholder')}
|
||||
monospace={options.monospace}
|
||||
className="w-full text-zinc-100"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user