muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00
Code Packages Activity Actions

added flow display controls overlay

Browse source
This commit is contained in:
Fedor Katurov 2021-10-13 16:14:37 +07:00
parent c8204a41a2
commit 5fef4bc804
14 changed files with 327 additions and 116 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/input/Toggle/index.tsx
View file

@ -1,16 +1,17 @@
import React, { FC, useCallback } from 'react';
import styles from './styles.module.scss';
import classNames from 'classnames';
import { ButtonProps, DivProps } from '~/utils/types';
type ToggleColor = 'primary' | 'secondary' | 'lab' | 'danger';
type ToggleColor = 'primary' | 'secondary' | 'lab' | 'danger' | 'white';
interface IProps {
type IProps = Omit<ButtonProps, 'value' | 'color'> & {
value?: boolean;
handler?: (val: boolean) => void;
color?: ToggleColor;
}
};
const Toggle: FC<IProps> = ({ value, handler, color = 'primary' }) => {
const Toggle: FC<IProps> = ({ value, handler, color = 'primary', ...rest }) => {
const onClick = useCallback(() => {
if (!handler) {
return;
@ -21,8 +22,14 @@ const Toggle: FC<IProps> = ({ value, handler, color = 'primary' }) => {
return (
<button
{...rest}
type="button"
className={classNames(styles.toggle, { [styles.active]: value }, styles[color])}
className={classNames(
styles.toggle,
{ [styles.active]: value },
styles[color],
rest.className
)}
onClick={onClick}
/>
);