@smollweide/material-ui-speed-dial/material-ui-speed-dial.js.flow

Components, that implements material design speed dial for material-ui v1

// @flow
/* eslint flowtype/type-id-match: 0*/

export type StylesType = {
	[key: string]: {
		[key: string]: string | number | Object,
	},
};

export type ClassesType = { [key: string]: string };

type ThemeValueType = string | number;

export type ThemeType = {
	[key: string]: ThemeValueType,
	direction: 'rtl' | 'ltr',
	spacing: {
		[key: string]: ThemeValueType,
		unit: number,
	},
	transitions: {
		[key: string]: ThemeValueType,
		easing: {
			sharp: ThemeValueType,
			easeOut: ThemeValueType,
			easeOut: ThemeValueType,
		},
		duration: {
			leavingScreen: ThemeValueType,
			enteringScreen: ThemeValueType,
			shortest: ThemeValueType,
		},
		create: (Array<string> | string, ?Object) => ThemeValueType,
	},
	mixins: {
		toolbar: {
			[key: string]: ThemeValueType,
		},
	},
	zIndex: {
		[key: string]: ThemeValueType,
	},
	palette: {
		primary: {
			[key: string]: ThemeValueType,
		},
		common: {
			[key: string]: ThemeValueType,
		},
		text: {
			[key: string]: ThemeValueType,
		},
		background: {
			[key: string]: ThemeValueType,
		},
		grey: {
			[key: string]: ThemeValueType,
		},
		[key: string]: ThemeValueType,
	},
	breakpoints: {
		up: (value: string) => ThemeValueType,
	},
	typography: {
		[key: string]: {
			[key: string]: ThemeValueType,
		},
		pxToRem: (value: number) => ThemeValueType,
	},
	shadows: {
		[key: string | number]: string,
	},
};

export type PresetRawType = {|
	root: { [key: string]: number | string },
	button: { [key: string]: number | string },
	buttonOuterRim: { [key: string]: number | string },
	list: { [key: string]: number | string },
	item: { [key: string]: number | string },
	firstItem: { [key: string]: number | string },
	avatar: { [key: string]: number | string },
	label: { [key: string]: number | string },
	backdrop: { [key: string]: number | string },
|};

export type PresetType = {|
	root: string,
	button: string,
	buttonOuterRim: string,
	list: string,
	item: string,
	firstItem: string,
	avatar: string,
	label: string,
	backdrop: string,
|};

export type StylesCreatorType = (...args: Array<*>) => StylesType | PresetRawType;
export type StylesCreatorOrObjectType = StylesCreatorType | StylesType;

export type StateEnumType = 'closed' | 'opening' | 'opened' | 'closing';
export type SpeedDialStateType = {|
	state: StateEnumType,
|};

export type RenderPropsType = {|
	state: StateEnumType,
	className: string,
	preset: ClassesType,
	handleClose: () => void,
|};
export type RenderButtonPropsType = {|
	key?: string,
	state: StateEnumType,
	className: string,
	onClick: () => void,
|};
export type RenderButtonIconPropsType = {|
	className: string,
	state: StateEnumType,
|};
export type RenderOpenedButtonPropsType = {|
	key: string,
	className: string,
	onClick: () => void,
	state: StateEnumType,
|};
export type RenderOpenedButtonIconPropsType = {|
	className: string,
	state: StateEnumType,
|};
export type RenderOuterRimButtonPropsType = {|
	className: string,
	state: StateEnumType,
|};
export type RenderOuterRimButtonIconPropsType = {|
	className: string,
	state: StateEnumType,
|};
export type RenderListPropsType = {|
	children: React$Node,
	className: string,
	state: StateEnumType,
|};
export type RenderBackdropPropsType = {|
	className: string,
	state: StateEnumType,
	onClick: (event: SyntheticMouseEvent<HTMLDivElement>) => void,
|};

export type RenderAvatarPropsType = {|
	className: string,
	state: StateEnumType,
|};
export type RenderLabelPropsType = {|
	className: string,
	state: StateEnumType,
|};

export type SpeedDialLabelPropsType = {
	className: string,
	text: string,
	state: StateEnumType,
};

export type SpeedDialBackdropPropsType = {
	className: string,
	state: StateEnumType,
	onClick: (event: SyntheticMouseEvent<HTMLDivElement>) => void,
};

export type SpeedDialItemPropsType = {
	className: string,
	preset: ClassesType,
	state: StateEnumType,
	renderAvatar?: (props: RenderAvatarPropsType) => React$Element<*>,
	children: (props: RenderLabelPropsType) => React$Element<*>,
	onClick?: (event: SyntheticMouseEvent<HTMLDivElement>) => void,
};

export type SpeedDialPropsType = {
	children: (props: RenderPropsType) => React$Node,
	renderButton: (props: RenderButtonPropsType, propsIcon: RenderButtonIconPropsType) => React$Element<*>,
	renderOpenedButton?: (
		props: RenderOpenedButtonPropsType,
		propsIcon: RenderOpenedButtonIconPropsType
	) => React$Element<*>,
	renderOuterRimButton?: (
		props: RenderOuterRimButtonPropsType,
		propsIcon: RenderOuterRimButtonIconPropsType
	) => React$Element<*>,
	renderList: (props: RenderListPropsType) => React$Element<*>,
	renderBackdrop?: (props: RenderBackdropPropsType) => React$Element<*>,
	preset: ClassesType,
	isOpen?: boolean,
	className?: string,
	animationDelay?: number,
};

// mjs types
declare module '@smollweide/material-ui-speed-dial/dist/mjs/components/SpeedDial/SpeedDial' {
	declare export default class SpeedDial extends React$Component<SpeedDialPropsType, SpeedDialStateType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/mjs/components/SpeedDialItem/SpeedDialItem' {
	declare export default class SpeedDialItem extends React$Component<SpeedDialItemPropsType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/mjs/components/SpeedDialBackdrop/SpeedDialBackdrop' {
	declare export default class SpeedDialBackdrop extends React$Component<SpeedDialBackdropPropsType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/mjs/components/SpeedDialLabel/SpeedDialLabel' {
	declare export default class SpeedDialLabel extends React$Component<SpeedDialLabelPropsType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/mjs/utils/combineStyles' {
	declare export default function combineStyles(
		...stylesCreators: Array<StylesCreatorOrObjectType>
	): (...args: Array<*>) => StylesType;
}

// js types
declare module '@smollweide/material-ui-speed-dial/dist/components/SpeedDial/SpeedDial' {
	declare export default class SpeedDial extends React$Component<SpeedDialPropsType, SpeedDialStateType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/components/SpeedDialItem/SpeedDialItem' {
	declare export default class SpeedDialItem extends React$Component<SpeedDialItemPropsType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/components/SpeedDialBackdrop/SpeedDialBackdrop' {
	declare export default class SpeedDialBackdrop extends React$Component<SpeedDialBackdropPropsType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/components/SpeedDialLabel/SpeedDialLabel' {
	declare export default class SpeedDialLabel extends React$Component<SpeedDialLabelPropsType> {}
}
declare module '@smollweide/material-ui-speed-dial/dist/utils/combineStyles' {
	declare export default function combineStyles(
		...stylesCreators: Array<StylesCreatorOrObjectType>
	): (...args: Array<*>) => StylesType;
}

declare module '@smollweide/material-ui-speed-dial' {
	declare export type $StylesType = StylesType;
	declare export type $StylesCreatorType = StylesCreatorType;
	declare export type $StylesCreatorOrObjectType = StylesCreatorOrObjectType;
	declare export type $ClassesType = ClassesType;
	declare export type $ThemeType = ThemeType;
	declare export type $PresetRawType = PresetRawType;
	declare export type $PresetType = PresetType;
	declare export type $StateEnumType = StateEnumType;
	declare export type $SpeedDialStateType = SpeedDialStateType;
	declare export type $RenderPropsType = RenderPropsType;
	declare export type $RenderButtonPropsType = RenderButtonPropsType;
	declare export type $RenderButtonIconPropsType = RenderButtonIconPropsType;
	declare export type $RenderOpenedButtonPropsType = RenderOpenedButtonPropsType;
	declare export type $RenderOpenedButtonIconPropsType = RenderOpenedButtonIconPropsType;
	declare export type $RenderOuterRimButtonPropsType = RenderOuterRimButtonPropsType;
	declare export type $RenderOuterRimButtonIconPropsType = RenderOuterRimButtonIconPropsType;
	declare export type $RenderListPropsType = RenderListPropsType;
	declare export type $RenderBackdropPropsType = RenderBackdropPropsType;
	declare export type $RenderAvatarPropsType = RenderAvatarPropsType;
	declare export type $RenderLabelPropsType = RenderLabelPropsType;
	declare export type $SpeedDialLabelPropsType = SpeedDialLabelPropsType;
	declare export type $SpeedDialBackdropPropsType = SpeedDialBackdropPropsType;
	declare export type $SpeedDialItemPropsType = SpeedDialItemPropsType;
	declare export type $SpeedDialPropsType = SpeedDialPropsType;

	declare export default class SpeedDial extends React$Component<$SpeedDialPropsType, $SpeedDialStateType> {}
	declare export class SpeedDialItem extends React$Component<$SpeedDialItemPropsType> {}
	declare export class SpeedDialBackdrop extends React$Component<$SpeedDialBackdropPropsType> {}
	declare export class SpeedDialLabel extends React$Component<$SpeedDialLabelPropsType> {}
}