diff --git a/packages/docsearch-react/src/DocSearchButton.tsx b/packages/docsearch-react/src/DocSearchButton.tsx index a4387fd41..31bb5d6e8 100644 --- a/packages/docsearch-react/src/DocSearchButton.tsx +++ b/packages/docsearch-react/src/DocSearchButton.tsx @@ -3,10 +3,12 @@ import React, { useEffect, useState } from 'react'; import { ControlKeyIcon } from './icons/ControlKeyIcon'; import { SearchIcon } from './icons/SearchIcon'; -export type DocSearchButtonProps = React.DetailedHTMLProps< - React.ButtonHTMLAttributes, - HTMLButtonElement ->; +type Translations = Partial<{ + buttonText: string; + buttonAriaLabel: string; +}> + +export type DocSearchButtonProps = React.ComponentProps<'button'> & {translations?: Translations} const ACTION_KEY_DEFAULT = 'Ctrl' as const; const ACTION_KEY_APPLE = '⌘' as const; @@ -18,7 +20,12 @@ function isAppleDevice() { export const DocSearchButton = React.forwardRef< HTMLButtonElement, DocSearchButtonProps ->((props, ref) => { +>(({translations = {}, ...props}, ref) => { + const { + buttonText = "Search", + buttonAriaLabel = "Search" + } = translations; + const [key, setKey] = useState< typeof ACTION_KEY_APPLE | typeof ACTION_KEY_DEFAULT | null >(null); @@ -33,13 +40,13 @@ export const DocSearchButton = React.forwardRef<