improvement(ui): standardize modal default actions

Author: waleedlatif1

.claude/rules/emcn-components.md

@@ -33,6 +33,16 @@ The menu surface intentionally diverges from the pill: `dropdown-menu.tsx` items
 - **`ChipTimePicker`** — minute-granular time sibling of `ChipDatePicker`, a `ChipInput` that leniently parses typed input (`9:47`, `947`, `2:05pm`, `14:30`), commits on Enter/blur, and re-renders the canonical `9:47 AM` label.
 - **`DropdownMenu`** — the canonical context/action menu (Radix-backed). Not a chip, but the standard menu for command/action lists; reach for it instead of a hand-rolled popover. Its surface intentionally diverges from the chip pill (`text-small`, `gap-2`) — keep them distinct. For a pill that opens a value picker, use `ChipDropdown`/`ChipSelect` instead.
 
+## Modal keyboard defaults
+
+Declare keyboard intent on the action-owning primitive; never add document-level or per-callsite Enter listeners.
+
+- `ChipModalFooter` defaults to `defaultAction='primary'`. A plain Enter in a canonical single-line field or a custom plain input invokes the enabled primary action. Use `'none'` when submission must require an explicit click, such as an irreversible destructive action or an editor whose nested control owns Enter. Use `'dismiss'` only when dismissal is genuinely the modal's default decision.
+- `ChipConfirmModal` fails safe with `defaultAction='dismiss'`. Opt into `'confirm'` only for an audited, reversible or non-destructive decision. Use `'none'` for typed confirmations and severe account, ownership, or access changes. Button color never determines keyboard behavior.
+- Textareas, native forms, buttons, links, comboboxes, menus, listboxes, tag/email inputs, IME composition, modified Enter, and disabled or pending actions retain their native behavior. A native form remains the sole submission path so browser validation is not bypassed.
+- A custom field containing a search, token editor, or another input that owns Enter must set `submitOnEnter={false}` on `ChipModalField`. Do not attach a duplicate `onKeyDown` handler merely to call the footer action.
+- Initial focus goes to the first visible editable text control. With no text control, the declared real button receives focus; `'none'` focuses the dialog surface. A safe dismiss default never turns Enter in a text field into data loss—the field simply does not publish a submit action.
+
 ## Authoring principles
 
 - **One source of truth for shared chrome.** Compose from `chip-chrome.ts` / `chipVariants`; never duplicate the chrome string.

apps/sim/app/(auth)/login/login-form.tsx

@@ -464,9 +464,6 @@ export default function LoginPage({
             title='Email'
             value={forgotPasswordEmail}
             onChange={(value) => setForgotPasswordEmail(value)}
-            onSubmit={() => {
-              if (!isSubmittingReset) void handleForgotPassword()
-            }}
             required
             placeholder='you@example.com'
           />

apps/sim/app/(landing)/components/auth-modal/auth-modal.tsx

@@ -48,6 +48,13 @@ const FALLBACK_STATUS: ProviderStatus = {
 const SOCIAL_BTN =
   'relative flex h-[32px] w-full items-center justify-center rounded-[5px] border border-[var(--border-1)] text-[13.5px] text-[var(--text-primary)] transition-colors hover:bg-[var(--surface-hover)] disabled:cursor-not-allowed disabled:opacity-50'
 
+/** Auth providers are peer choices, so opening the dialog must not arm one or dismissal. */
+function focusAuthDialog(event: Event): void {
+  event.preventDefault()
+  const content = event.currentTarget as HTMLElement | null
+  content?.focus()
+}
+
 function fetchProviderStatus(): Promise<ProviderStatus> {
   if (fetchPromise) return fetchPromise
   fetchPromise = requestJson(getAuthProvidersContract, {})
@@ -155,7 +162,11 @@ export function AuthModal({ children, defaultView = 'login', source }: AuthModal
   return (
     <Modal open={open} onOpenChange={handleOpenChange}>
       <ModalTrigger asChild>{children}</ModalTrigger>
-      <ModalContent size='sm' className='dark bg-[var(--bg)] text-[var(--text-primary)]'>
+      <ModalContent
+        size='sm'
+        className='dark bg-[var(--bg)] text-[var(--text-primary)]'
+        onOpenAutoFocus={focusAuthDialog}
+      >
         <ModalTitle className='sr-only'>
           {effectiveView === 'login' ? 'Log in' : 'Create account'}
         </ModalTitle>

apps/sim/app/workspace/[workspaceId]/files/components/delete-confirm-modal/delete-confirm-modal.tsx

@@ -39,6 +39,7 @@ export const DeleteConfirmModal = memo(function DeleteConfirmModal({
       onOpenChange={onOpenChange}
       srTitle={title}
       title={title}
+      defaultAction={totalCount === 1 && !hasFolders ? 'confirm' : 'dismiss'}
       text={[
         'Are you sure you want to delete ',
         fileName

apps/sim/app/workspace/[workspaceId]/files/components/share-modal/share-modal.tsx

@@ -252,6 +252,7 @@ export function ShareModal({
         </ChipModalBody>
         <ChipModalFooter
           onCancel={handleClose}
+          defaultAction={isUnshareAction ? 'none' : 'primary'}
           secondaryActions={
             saved?.isActive && saved.url
               ? [

apps/sim/app/workspace/[workspaceId]/files/files.tsx

@@ -2297,6 +2297,7 @@ export function Files() {
         open={Boolean(extractTarget)}
         onOpenChange={(open) => !open && setExtractTargetId(null)}
         title='Unzip archive?'
+        defaultAction='confirm'
         text={[
           'This will unzip ',
           { text: extractTarget?.name ?? 'this archive', bold: true },

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/components/document-tags-modal/document-tags-modal.tsx

@@ -381,7 +381,7 @@ export function DocumentTagsModal({
       <ChipModalHeader onClose={() => handleClose(false)}>Document Tags</ChipModalHeader>
 
       <ChipModalBody>
-        <ChipModalField type='custom' title='Tags'>
+        <ChipModalField type='custom' title='Tags' submitOnEnter={false}>
           <div className='space-y-2'>
             {documentTags.map((tag, index) => (
               <div key={tag.displayName} className='space-y-2'>
@@ -737,6 +737,7 @@ export function DocumentTagsModal({
 
       <ChipModalFooter
         onCancel={() => handleClose(false)}
+        defaultAction='none'
         primaryAction={{ label: 'Close', onClick: () => handleClose(false) }}
       />
     </ChipModal>

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx

@@ -1372,6 +1372,7 @@ export function KnowledgeBase({
         onOpenChange={setShowDeleteDialog}
         srTitle='Delete Knowledge Base'
         title='Delete Knowledge Base'
+        defaultAction='confirm'
         text={[
           'Are you sure you want to delete ',
           { text: knowledgeBaseName, bold: true },

apps/sim/app/workspace/[workspaceId]/knowledge/[id]/components/base-tags-modal/base-tags-modal.tsx

@@ -248,6 +248,7 @@ export function BaseTagsModal({ open, onOpenChange, knowledgeBaseId }: BaseTagsM
         <ChipModalBody>
           <ChipModalField
             type='custom'
+            submitOnEnter={false}
             title={
               <>
                 Tags:{' '}
@@ -389,6 +390,7 @@ export function BaseTagsModal({ open, onOpenChange, knowledgeBaseId }: BaseTagsM
 
         <ChipModalFooter
           onCancel={() => handleClose(false)}
+          defaultAction='none'
           primaryAction={{ label: 'Close', onClick: () => handleClose(false) }}
         />
       </ChipModal>

apps/sim/app/workspace/[workspaceId]/knowledge/components/delete-knowledge-base-modal/delete-knowledge-base-modal.tsx

@@ -43,6 +43,7 @@ export const DeleteKnowledgeBaseModal = memo(function DeleteKnowledgeBaseModal({
       onOpenChange={onClose}
       srTitle='Delete Knowledge Base'
       title='Delete Knowledge Base'
+      defaultAction='confirm'
       text={
         knowledgeBaseName
           ? [