starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-26 03:11:12 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Add stuff to app header

Browse Source
This commit is contained in:
Gregory Schier
2023-03-15 16:35:19 -07:00
parent 264e64a996
commit d90a7331c9
6 changed files with 126 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
src-web/components/core/Button.tsx
View File

@@ -1,6 +1,6 @@
import classnames from 'classnames';
import type { HTMLAttributes } from 'react';
import { forwardRef } from 'react';
import { forwardRef, useMemo } from 'react';
import { Link } from 'react-router-dom';
import { Icon } from './Icon';
@@ -39,45 +39,32 @@ export const Button = forwardRef<any, ButtonProps>(function Button(
}: ButtonProps,
ref,
) {
const classes = useMemo(
() =>
classnames(
className,
'outline-none pointer-events-auto',
'border border-transparent focus-visible:border-blue-300',
'rounded-md flex items-center',
colorStyles[color || 'default'],
justify === 'start' && 'justify-start',
justify === 'center' && 'justify-center',
size === 'md' && 'h-9 px-3',
size === 'sm' && 'h-7 px-2.5 text-sm',
),
[color, size, justify, className],
);
if (typeof to === 'string') {
return (
<Link
ref={ref}
to={to}
className={classnames(
className,
'outline-none',
'border border-transparent focus-visible:border-blue-300',
'rounded-md flex items-center',
colorStyles[color || 'default'],
justify === 'start' && 'justify-start',
justify === 'center' && 'justify-center',
size === 'md' && 'h-9 px-3',
size === 'sm' && 'h-7 px-2.5 text-sm',
)}
{...props}
>
<Link ref={ref} to={to} className={classes} {...props}>
{children}
{forDropdown && <Icon icon="triangleDown" className="ml-1 -mr-1" />}
</Link>
);
} else {
return (
<button
ref={ref}
className={classnames(
className,
'outline-none',
'border border-transparent focus-visible:border-blue-300',
'rounded-md flex items-center',
colorStyles[color || 'default'],
justify === 'start' && 'justify-start',
justify === 'center' && 'justify-center',
size === 'md' && 'h-9 px-3',
size === 'sm' && 'h-7 px-2.5 text-sm',
)}
{...props}
>
<button ref={ref} className={classes} {...props}>
{children}
{forDropdown && <Icon icon="triangleDown" className="ml-1 -mr-1" />}
</button>