mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
tom goriunovandGitHub
f6725649da
* first version of the pack * single entry point * add custom components to the package * move form components to toolkit * add more utils and hooks to the package * minor fixes * add CI workflow * update readme and package.json * fix ts * fix build of env-validator * fix docker build * fix icons size * test fixes * more test fixes
28 lines
905 B
TypeScript
28 lines
905 B
TypeScript
import type { ButtonProps } from '@chakra-ui/react';
|
|
import { Icon, useRecipe } from '@chakra-ui/react';
|
|
import * as React from 'react';
|
|
|
|
import CloseIcon from 'icons/close.svg';
|
|
|
|
import { recipe as closeButtonRecipe } from '../theme/recipes/close-button.recipe';
|
|
import { IconButton } from './icon-button';
|
|
export interface CloseButtonProps extends Omit<ButtonProps, 'variant' | 'size'> {
|
|
variant?: 'plain';
|
|
size?: 'md';
|
|
}
|
|
|
|
export const CloseButton = React.forwardRef<
|
|
HTMLButtonElement,
|
|
CloseButtonProps
|
|
>(function CloseButton(props, ref) {
|
|
const recipe = useRecipe({ recipe: closeButtonRecipe });
|
|
const [ recipeProps, restProps ] = recipe.splitVariantProps(props);
|
|
const styles = recipe(recipeProps);
|
|
|
|
return (
|
|
<IconButton aria-label="Close" ref={ ref } css={ styles } { ...restProps }>
|
|
{ props.children ?? <Icon boxSize={ 5 }><CloseIcon/></Icon> }
|
|
</IconButton>
|
|
);
|
|
});
|