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

Custom HTTP method names

Browse Source
This commit is contained in:
Gregory Schier
2024-01-17 14:52:19 -08:00
parent 466d412e65
commit 321c3862fe
8 changed files with 128 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

105
src-web/components/core/Icon.tsx
View File

@@ -1,63 +1,64 @@
import * as lucide from 'lucide-react';
import classNames from 'classnames';
import type {HTMLAttributes} from 'react';
import {memo} from 'react';
import type { HTMLAttributes } from 'react';
import { memo } from 'react';
const icons = {
archive: lucide.ArchiveIcon,
box: lucide.BoxIcon,
chat: lucide.MessageSquare,
check: lucide.CheckIcon,
chevronDown: lucide.ChevronDownIcon,
chevronRight: lucide.ChevronRightIcon,
code: lucide.CodeIcon,
copy: lucide.CopyIcon,
download: lucide.DownloadIcon,
externalLink: lucide.ExternalLinkIcon,
eye: lucide.EyeIcon,
eyeClosed: lucide.EyeOffIcon,
filter: lucide.FilterIcon,
flask: lucide.FlaskConicalIcon,
gripVertical: lucide.GripVerticalIcon,
keyboard: lucide.KeyboardIcon,
leftPanelHidden: lucide.PanelLeftOpenIcon,
leftPanelVisible: lucide.PanelLeftCloseIcon,
magicWand: lucide.Wand2Icon,
moreVertical: lucide.MoreVerticalIcon,
pencil: lucide.PencilIcon,
plus: lucide.PlusIcon,
plusCircle: lucide.PlusCircleIcon,
question: lucide.ShieldQuestionIcon,
sendHorizontal: lucide.SendHorizonalIcon,
settings2: lucide.Settings2Icon,
settings: lucide.SettingsIcon,
trash: lucide.TrashIcon,
update: lucide.RefreshCcwIcon,
upload: lucide.UploadIcon,
x: lucide.XIcon,
archive: lucide.ArchiveIcon,
box: lucide.BoxIcon,
chat: lucide.MessageSquare,
check: lucide.CheckIcon,
chevronDown: lucide.ChevronDownIcon,
chevronRight: lucide.ChevronRightIcon,
code: lucide.CodeIcon,
copy: lucide.CopyIcon,
download: lucide.DownloadIcon,
externalLink: lucide.ExternalLinkIcon,
eye: lucide.EyeIcon,
eyeClosed: lucide.EyeOffIcon,
filter: lucide.FilterIcon,
flask: lucide.FlaskConicalIcon,
gripVertical: lucide.GripVerticalIcon,
keyboard: lucide.KeyboardIcon,
leftPanelHidden: lucide.PanelLeftOpenIcon,
leftPanelVisible: lucide.PanelLeftCloseIcon,
magicWand: lucide.Wand2Icon,
moreVertical: lucide.MoreVerticalIcon,
pencil: lucide.PencilIcon,
plus: lucide.PlusIcon,
plusCircle: lucide.PlusCircleIcon,
question: lucide.ShieldQuestionIcon,
sendHorizontal: lucide.SendHorizonalIcon,
settings2: lucide.Settings2Icon,
settings: lucide.SettingsIcon,
sparkles: lucide.SparklesIcon,
trash: lucide.TrashIcon,
update: lucide.RefreshCcwIcon,
upload: lucide.UploadIcon,
x: lucide.XIcon,
empty: (props: HTMLAttributes<HTMLSpanElement>) => <span {...props} />,
empty: (props: HTMLAttributes<HTMLSpanElement>) => <span {...props} />,
};
export interface IconProps {
icon: keyof typeof icons;
className?: string;
size?: 'xs' | 'sm' | 'md';
spin?: boolean;
icon: keyof typeof icons;
className?: string;
size?: 'xs' | 'sm' | 'md';
spin?: boolean;
}
export const Icon = memo(function Icon({icon, spin, size = 'md', className}: IconProps) {
const Component = icons[icon] ?? icons.question;
return (
<Component
className={classNames(
className,
'text-inherit',
size === 'md' && 'h-4 w-4',
size === 'sm' && 'h-3.5 w-3.5',
size === 'xs' && 'h-3 w-3',
spin && 'animate-spin',
)}
/>
);
export const Icon = memo(function Icon({ icon, spin, size = 'md', className }: IconProps) {
const Component = icons[icon] ?? icons.question;
return (
<Component
className={classNames(
className,
'text-inherit',
size === 'md' && 'h-4 w-4',
size === 'sm' && 'h-3.5 w-3.5',
size === 'xs' && 'h-3 w-3',
spin && 'animate-spin',
)}
/>
);
});

10
src-web/components/core/RadioDropdown.tsx
View File

@@ -16,18 +16,20 @@ export interface RadioDropdownProps<T = string | null> {
value: T;
onChange: (value: T) => void;
items: RadioDropdownItem<T>[];
extraItems?: DropdownProps['items'];
children: DropdownProps['children'];
}
export function RadioDropdown<T = string | null>({
value,
items,
extraItems,
onChange,
children,
}: RadioDropdownProps<T>) {
const dropdownItems = useMemo(
() =>
items.map((item) => {
() => [
...items.map((item) => {
if (item.type === 'separator') {
return item;
} else {
@@ -40,7 +42,9 @@ export function RadioDropdown<T = string | null>({
};
}
}),
[items, value, onChange],
...(extraItems ?? []),
],
[items, extraItems, value, onChange],
);
return <Dropdown items={dropdownItems}>{children}</Dropdown>;