chore: cherry-pick button tabindex fixes

#7306

Author: alexcarpenter

packages/ui/src/elements/ClipboardInput.tsx

@@ -30,7 +30,6 @@ export const ClipboardInput = (props: ClipboardInputProps) => {
       <Button
         elementDescriptor={descriptors.formFieldInputCopyToClipboardButton}
         variant='ghost'
-        tabIndex={-1}
         onClick={onCopy}
         sx={{
           position: 'absolute',

packages/ui/src/elements/PasswordInput.tsx

@@ -31,6 +31,7 @@ export const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>((p
     setWarning,
     setError,
     setHasPassedComplexity,
+    tabIndex,
     ...rest
   } = props;
   const inputRef = useRef<HTMLInputElement>(null);
@@ -86,6 +87,7 @@ export const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>((p
     >
       <Input
         {...rest}
+        tabIndex={tabIndex}
         onChange={onChange}
         onBlur={e => {
           rest.onBlur?.(e);
@@ -108,7 +110,7 @@ export const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>((p
         aria-label={`${hidden ? 'Show' : 'Hide'} password`}
         variant='ghost'
         size='xs'
-        tabIndex={-1}
+        tabIndex={tabIndex}
         onClick={() => setHidden(s => !s)}
         sx={theme => ({
           position: 'absolute',