diff --git a/types/reach__menu-button/index.d.ts b/types/reach__menu-button/index.d.ts new file mode 100644 index 0000000000..2a6d96ce2e --- /dev/null +++ b/types/reach__menu-button/index.d.ts @@ -0,0 +1,85 @@ +// Type definitions for @reach/menu-button 0.1 +// Project: https://github.com/reach/reach-ui +// Definitions by: Harry Hedger +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.8 + +import * as React from 'react'; + +export interface ButtonRect { + height: number; + width: number; + left: number; + top: number; +} + +export interface State { + isOpen: boolean; + closingWithClick: boolean; + selectionIndex: number; + buttonRect: undefined | ButtonRect; + buttonId: string; +} + +export interface MenuProps { + children?: React.ReactNode; +} + +export const Menu: React.FC; + +export type MenuButtonProps = { + onClick?: (e: React.MouseEvent) => void; + onKeyDown?: (e: React.KeyboardEvent) => void; + children?: React.ReactNode; +} & React.HTMLProps; + +export const MenuButton: React.FC; + +export type MenuListProps = JSX.IntrinsicElements["div"] & { + children?: React.ReactNode; +}; + +export const MenuList: React.FC; + +export type ResolvedMenuLinkProps = T extends keyof JSX.IntrinsicElements + ? JSX.IntrinsicElements[T] + : T; + +export type ResolvedMenuLinkComponent = T extends keyof JSX.IntrinsicElements + ? T + : React.ComponentType; + +export type MenuLinkProps< + T extends SupportedMenuLinkComponent +> = ResolvedMenuLinkProps & { + as?: string; + to?: string; + onKeyDown?: (e: React.KeyboardEvent) => void; + onClick?: (e: React.MouseEvent) => void; + component?: ResolvedMenuLinkComponent; + index?: number; + style?: React.CSSProperties; + setState?: (s: State) => Partial; + state?: State; + _ref?: (node: HTMLElement) => void; +}; + +export type SupportedMenuLinkComponent = object | keyof JSX.IntrinsicElements; + +export function MenuLink( + props: MenuLinkProps +): React.ReactElement>; + +export type MenuItemProps = { + onSelect?: () => void; + onClick?: (e: React.MouseEvent) => void; + onKeyDown?: (e: React.KeyboardEvent) => void; + onMouseMove?: (e: React.MouseEvent) => void; + role?: string; + state?: State; + setState?: (s: State) => Partial; + index?: number; + _ref?: (node: HTMLElement) => void; +} & React.HTMLProps; + +export const MenuItem: React.FC; diff --git a/types/reach__menu-button/reach__menu-button-tests.tsx b/types/reach__menu-button/reach__menu-button-tests.tsx new file mode 100644 index 0000000000..5abf0e4132 --- /dev/null +++ b/types/reach__menu-button/reach__menu-button-tests.tsx @@ -0,0 +1,29 @@ +import { Menu, MenuButton, MenuList, MenuItem, MenuLink } from '@reach/menu-button'; + +import * as React from 'react'; +import { render } from 'react-dom'; + +const Example = () => ( + + + Actions + + + alert('Download')}>Download + alert('Copy')}>Create a Copy + alert('Mark as Draft')}>Mark as Draft + alert('Delete')}>Delete + + Attend a Workshop + + + +); + +render(, document.getElementById('app')); + +render(, document.getElementById('app')); +render(, document.getElementById('app')); +render(, document.getElementById('app')); +render(, document.getElementById('app')); +render(, document.getElementById('app')); diff --git a/types/reach__menu-button/tsconfig.json b/types/reach__menu-button/tsconfig.json new file mode 100644 index 0000000000..6da68c7b08 --- /dev/null +++ b/types/reach__menu-button/tsconfig.json @@ -0,0 +1,28 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6", + "dom" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "paths": { + "@reach/menu-button": ["reach__menu-button"] + }, + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true, + "jsx": "react" + }, + "files": [ + "index.d.ts", + "reach__menu-button-tests.tsx" + ] +} diff --git a/types/reach__menu-button/tslint.json b/types/reach__menu-button/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/reach__menu-button/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }