From a2c3c6a121729fcd8e24ad4cef43e3f719082f13 Mon Sep 17 00:00:00 2001
From: Jaco Greeff <jacogr@gmail.com>
Date: Wed, 26 Aug 2020 21:18:15 +0200
Subject: [PATCH] tabIndex on dropdown (#3532)

---
 packages/page-accounts/src/modals/Create.tsx | 2 ++
 packages/react-components/src/Dropdown.tsx   | 4 +++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/page-accounts/src/modals/Create.tsx b/packages/page-accounts/src/modals/Create.tsx
index 785acbdad2..7595013832 100644
--- a/packages/page-accounts/src/modals/Create.tsx
+++ b/packages/page-accounts/src/modals/Create.tsx
@@ -336,6 +336,7 @@ function Create ({ className = '', onClose, onStatusChange, seed: propsSeed, typ
                 label={t<string>('keypair crypto type')}
                 onChange={_onChangePairType}
                 options={uiSettings.availableCryptos}
+                tabIndex={-1}
               />
             </Modal.Column>
             <Modal.Column>
@@ -359,6 +360,7 @@ function Create ({ className = '', onClose, onStatusChange, seed: propsSeed, typ
                       ? t<string>('//hard/soft///password')
                       : t<string>('//hard///password')
                 }
+                tabIndex={-1}
                 value={derivePath}
               />
               {deriveError && (
diff --git a/packages/react-components/src/Dropdown.tsx b/packages/react-components/src/Dropdown.tsx
index 1fa9991b4d..ab82d4e80d 100644
--- a/packages/react-components/src/Dropdown.tsx
+++ b/packages/react-components/src/Dropdown.tsx
@@ -33,6 +33,7 @@ interface Props<Option> {
   placeholder?: string;
   renderLabel?: (item: any) => any;
   searchInput?: { autoFocus: boolean };
+  tabIndex?: number;
   transform?: (value: any) => any;
   value?: any;
   withEllipsis?: boolean;
@@ -43,7 +44,7 @@ export type IDropdown<Option> = React.ComponentType<Props<Option>> & {
   Header: React.ComponentType<{ content: React.ReactNode }>;
 }
 
-function BaseDropdown<Option> ({ allowAdd = false, className = '', defaultValue, dropdownClassName, help, isButton, isDisabled, isError, isFull, isMultiple, label, labelExtra, onAdd, onBlur, onChange, onClose, onSearch, options, placeholder, renderLabel, searchInput, transform, value, withEllipsis, withLabel }: Props<Option>): React.ReactElement<Props<Option>> {
+function BaseDropdown<Option> ({ allowAdd = false, className = '', defaultValue, dropdownClassName, help, isButton, isDisabled, isError, isFull, isMultiple, label, labelExtra, onAdd, onBlur, onChange, onClose, onSearch, options, placeholder, renderLabel, searchInput, tabIndex, transform, value, withEllipsis, withLabel }: Props<Option>): React.ReactElement<Props<Option>> {
   const lastUpdate = useRef<string>('');
   const [stored, setStored] = useState<string | undefined>();
 
@@ -102,6 +103,7 @@ function BaseDropdown<Option> ({ allowAdd = false, className = '', defaultValue,
       search={onSearch || allowAdd}
       searchInput={searchInput}
       selection
+      tabIndex={tabIndex}
       value={stored}
     />
   );