simeonradivoev/gameflow-deck
simeonradivoev/gameflow-deck
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: implemented a basic store and emulatorjs

Browse source
This commit is contained in:
Simeon Radivoev 2026-03-14 02:15:57 +02:00
parent 2f32cbc730
commit 7286541822
Signed by: simeonradivoev
GPG key ID: 7611A451D2A5D37A
121 changed files with 5900 additions and 1092 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/mainview/components/options/Button.tsx
View file

@ -7,12 +7,26 @@ import
import classNames from "classnames";
import { GamePadButtonCode, Shortcut, useShortcuts } from "@/mainview/scripts/shortcuts";
export type ButtonStyle = 'base' | 'accent' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error';
const styles = {
base: 'bg-base-200 text-base-content active:bg-base-300! active:text-base-content! active:ring-offset-base-content',
accent: "bg-accent text-accent-content active:bg-base-content! active:text-base-content active:ring-offset-accent",
primary: "bg-primary text-primary-content active:bg-base-content! active:text-base-content! active:ring-offset-primary",
secondary: "bg-secondary text-secondary-content active:bg-base-content! active:text-base-content! active:ring-offset-secondary",
info: "bg-info text-info-content active:bg-base-content! active:text-base-content! active:ring-offset-info",
success: "bg-success text-success-content active:bg-base-content! active:text-base-content! active:ring-offset-success",
warning: "bg-warning text-warning-content active:bg-base-content! active:text-base-content! active:ring-offset-warning",
error: "bg-error text-error-content active:bg-base-content! active:text-base-content! active:ring-offset-error",
};
export function Button (data: {
id: string,
children?: any,
className?: string,
disabled?: boolean,
type?: "reset" | "button" | "submit";
style?: ButtonStyle,
shortcutLabel?: string;
focusClassName?: string;
} & InteractParams & FocusParams)
@ -20,7 +34,7 @@ export function Button (data: {
const { ref, focused, focusKey } = useFocusable({
focusKey: data.id,
onEnterPress: data.onAction,
onFocus: data.onFocus,
onFocus: (_l, _p, details) => data.onFocus?.(focusKey, ref.current, details),
focusable: !data.disabled
});
@ -31,9 +45,10 @@ export function Button (data: {
return <button
ref={ref}
onClick={data.onAction}
onClick={e => data.onAction?.(e.nativeEvent)}
disabled={data.disabled}
className={twMerge("btn rounded-full focus:bg-base-content focus:text-base-300 md:text-lg",
className={twMerge("flex items-center justify-center px-4 py-2 disabled:bg-base-200/40 disabled:text-base-content/40 cursor-pointer rounded-3xl md:text-lg not-control-mouse:focused:drop-shadow-lg border border-base-content/5 not-control-mouse:focused:bg-base-content not-control-mouse:focused:text-base-100 control-mouse:hover:bg-base-content control-mouse:hover:text-base-100 active:transition-none active:ring-offset-4",
styles[data.style ?? 'base'],
focused ? data.focusClassName : undefined,
classNames({
"btn-accent": focused,