unom/ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: apply current biome formatting across untouched files

Browse Source 
Pure formatting churn (tabs, import order, line wrapping) produced by
`bunx biome check --write` under the currently-pinned biome version.
No behavior changes.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
enricobuehler
2026-07-20 18:34:11 +02:00
co-authored by Claude Fable 5
parent 148618639d
commit 84f66e9fae
16 changed files with 165 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/animate-number.tsx
+1 -2
View File
@@ -284,8 +284,7 @@ export const AnimateNumber: FC<AnimateNumberProps> = ({
// Compare to previous render's value to derive scroll direction. Updated
// in an effect so Strict Mode's double-render doesn't desync the ref.
const prevValueRef = useRef(children);
const direction: Direction =
children >= prevValueRef.current ? "up" : "down";
const direction: Direction = children >= prevValueRef.current ? "up" : "down";
useEffect(() => {
prevValueRef.current = children;
}, [children]);
src/animation/provider.tsx
+2 -10
View File
@@ -1,10 +1,5 @@
"use client";
import {
createContext,
type ReactNode,
useContext,
useMemo,
} from "react";
import { createContext, type ReactNode, useContext, useMemo } from "react";
import { defaultAnimationTheme } from "./defaults";
import { mergeTheme } from "./merge";
import type { AnimationTheme, PartialAnimationTheme } from "./types";
@@ -16,10 +11,7 @@ export type AnimationProviderProps = {
children: ReactNode;
};
export function AnimationProvider({
theme,
children,
}: AnimationProviderProps) {
export function AnimationProvider({ theme, children }: AnimationProviderProps) {
const parent = useContext(AnimationContext);
const merged = useMemo(() => mergeTheme(parent, theme), [parent, theme]);
return (
src/animation/use-responsive-hover.ts
+1 -5
View File
@@ -11,11 +11,7 @@ export function useResponsiveHover<T extends HTMLElement = HTMLElement>(
useLayoutEffect(() => {
const node = ref.current;
if (!config || !node || typeof ResizeObserver === "undefined") return;
const {
minScale = 1.01,
maxScale = 1.05,
referenceWidth = 80,
} = config;
const { minScale = 1.01, maxScale = 1.05, referenceWidth = 80 } = config;
const maxDelta = maxScale - 1;
const minDelta = minScale - 1;
src/button.stories.tsx
+8 -1
View File
@@ -8,7 +8,14 @@ const meta: Meta<typeof Button> = {
argTypes: {
variant: {
control: "select",
options: ["default", "destructive", "outline", "secondary", "ghost", "link"],
options: [
"default",
"destructive",
"outline",
"secondary",
"ghost",
"link",
],
},
size: {
control: "select",
src/form/checkbox.tsx
+1 -1
View File
@@ -2,8 +2,8 @@
import { motion } from "motion/react";
import { Checkbox as CheckboxPrimitive } from "radix-ui";
import { forwardRef } from "react";
import type * as React from "react";
import { forwardRef } from "react";
import { useAnimation } from "@/animation/provider";
import { useControllableState } from "@/hooks/useControllableState";
import { cn } from "@/lib/utils";
src/form/select.tsx
+8 -2
View File
@@ -56,7 +56,10 @@ function SelectTrigger({
data-material={mat.enabled ? "neutral" : undefined}
style={
mat.enabled
? ({ "--mat-base": "var(--neutral)", ...style } as React.CSSProperties)
? ({
"--mat-base": "var(--neutral)",
...style,
} as React.CSSProperties)
: style
}
className={cn(
@@ -96,7 +99,10 @@ function SelectContent({
data-material={mat.enabled ? "neutral" : undefined}
style={
mat.enabled
? ({ "--mat-base": "var(--neutral)", ...style } as React.CSSProperties)
? ({
"--mat-base": "var(--neutral)",
...style,
} as React.CSSProperties)
: style
}
className={cn(
src/material/use-specular.ts
+8 -2
View File
@@ -34,8 +34,14 @@ export function useSpecular(enabled = true) {
onPointerMove: (e: PointerEvent<HTMLElement>) => {
const el = e.currentTarget;
const r = el.getBoundingClientRect();
el.style.setProperty("--mx", `${((e.clientX - r.left) / r.width) * 100}%`);
el.style.setProperty("--my", `${((e.clientY - r.top) / r.height) * 100}%`);
el.style.setProperty(
"--mx",
`${((e.clientX - r.left) / r.width) * 100}%`,
);
el.style.setProperty(
"--my",
`${((e.clientY - r.top) / r.height) * 100}%`,
);
},
onPointerLeave: (e: PointerEvent<HTMLElement>) => {
const el = e.currentTarget;
src/sound/default-theme.ts
+67
View File
@@ -0,0 +1,67 @@
import type { SoundDef, SoundTheme } from "./types";
const buttonsSrc = new URL(
"../assets/sounds/762132__ienba__ui-buttons.wav",
import.meta.url,
).href;
const uiSetSrc = new URL(
"../assets/sounds/842498__newlocknew__uimvmt_game-user-interface-sound-set.mp3",
import.meta.url,
).href;
const buttonsSpriteMap = {
click1: [0, 1000],
click2: [2750, 1000],
click3: [5200, 1000],
click4: [7700, 1000],
} satisfies Record<string, [number, number]>;
const uiSetSpriteMap = {
smooth1: [0, 1200],
smooth2: [7800, 1400],
lobbyCreated: [53800, 3500],
gameStart: [62000, 4000],
} satisfies Record<string, [number, number]>;
const fromButtons = (
sprite: keyof typeof buttonsSpriteMap,
extra?: Partial<SoundDef>,
): SoundDef => ({
src: buttonsSrc,
sprite,
spriteMap: buttonsSpriteMap,
...extra,
});
const fromUiSet = (
sprite: keyof typeof uiSetSpriteMap,
extra?: Partial<SoundDef>,
): SoundDef => ({
src: uiSetSrc,
sprite,
spriteMap: uiSetSpriteMap,
...extra,
});
export const defaultSoundTheme: SoundTheme = {
volume: 1,
muted: false,
custom: {},
tokens: {
click: fromButtons("click1", { pool: 4, interrupt: true }),
hover: fromButtons("click2", { pool: 4, interrupt: true, volume: 0.6 }),
toggle: fromButtons("click2", { pool: 2 }),
focus: fromButtons("click2", { pool: 1, volume: 0.5 }),
selectOpen: fromButtons("click3"),
selectClose: fromButtons("click4"),
lobbyCreated: fromUiSet("lobbyCreated"),
gameStart: fromUiSet("gameStart"),
gameWon: fromUiSet("gameStart"),
roundSuccess: fromUiSet("smooth1"),
userJoined: fromUiSet("smooth1", { volume: 0.7 }),
userLeft: fromUiSet("smooth2", { volume: 0.7 }),
error: fromButtons("click4", { volume: 0.8 }),
submit: fromButtons("click3"),
vote: fromButtons("click2"),
},
};
src/sound/player.ts
+1 -3
View File
@@ -24,9 +24,7 @@ export function getHowl(def: SoundDef): Promise<HowlType> {
({ Howl }) =>
new Howl({
src: typeof def.src === "string" ? [def.src] : def.src,
sprite: def.spriteMap as
| Record<string, [number, number]>
| undefined,
sprite: def.spriteMap as Record<string, [number, number]> | undefined,
preload: true,
pool: def.pool ?? 1,
}),
src/styles/globals.css
+19 -19
View File
@@ -7,28 +7,28 @@
@source "./**/*.{js,mjs}";
:root {
--main: oklch(0.26% 0 0);
--accent: oklch(0.73 0.2 350.45);
--primary: oklch(0.56 0.17 253.49);
--brand: oklch(0.56 0.17 253.49);
--neutral: oklch(0.9 0.07 346.02);
--neutral-accent: oklch(0.92% 0.13 152.01);
--neutral-highlight: oklch(0.7448% 0.1823 50.477);
--highlight: oklch(0.7 0.23 352.23);
--success: oklch(91.1% 0.1605 148.89);
--error: oklch(65.7% 0.22923 26.238);
--main: oklch(0.26% 0 0);
--accent: oklch(0.73 0.2 350.45);
--primary: oklch(0.56 0.17 253.49);
--brand: oklch(0.56 0.17 253.49);
--neutral: oklch(0.9 0.07 346.02);
--neutral-accent: oklch(0.92% 0.13 152.01);
--neutral-highlight: oklch(0.7448% 0.1823 50.477);
--highlight: oklch(0.7 0.23 352.23);
--success: oklch(91.1% 0.1605 148.89);
--error: oklch(65.7% 0.22923 26.238);
--font-display: "Integral CF", ui-sans-serif, system-ui, sans-serif;
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-mono:
Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace;
--font-display: "Integral CF", ui-sans-serif, system-ui, sans-serif;
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-mono:
Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace;
--radius: 0.625rem;
/* Floor for the nested-card border radius — see card.tsx. Each
--radius: 0.625rem;
/* Floor for the nested-card border radius — see card.tsx. Each
theme can tune this independently of the base `--radius` to
keep deeply-nested cards visibly rounded. */
--radius-card-min: var(--radius);
--radius-card-min: var(--radius);
}
@theme inline static {
@@ -231,4 +231,4 @@
@apply mb-4 mt-6;
}
}
}
}
src/styles/page-transition.css
+14 -14
View File
@@ -1,18 +1,18 @@
@keyframes pageEnter {
from {
transform: translateY(40px);
opacity: 0;
}
to {
opacity: 1;
transform: translateY(0);
}
from {
transform: translateY(40px);
opacity: 0;
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes pageLeave {
from {
opacity: 1;
}
to {
opacity: 0;
}
from {
opacity: 1;
}
to {
opacity: 0;
}
}
src/styles/theme.css
+3 -2
View File
@@ -28,8 +28,9 @@
--font-display: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
"Courier New", monospace;
--font-mono:
ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New",
monospace;
--radius: 0.625rem;
/* Floor for the nested-card border radius — see card.tsx. Each
src/styles/timing-functions.css
+21 -21
View File
@@ -1,23 +1,23 @@
@theme {
--ease-in-sine: cubic-bezier(0.47, 0, 0.745, 0.715);
--ease-out-sine: cubic-bezier(0.39, 0.575, 0.565, 1);
--ease-in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
--ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
--ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
--ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
--ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
--ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
--ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
--ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
--ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
--ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
--ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
--ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
--ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
--ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
--ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
--ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
--ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
--ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
--ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
--ease-in-sine: cubic-bezier(0.47, 0, 0.745, 0.715);
--ease-out-sine: cubic-bezier(0.39, 0.575, 0.565, 1);
--ease-in-out-sine: cubic-bezier(0.445, 0.05, 0.55, 0.95);
--ease-in-quad: cubic-bezier(0.55, 0.085, 0.68, 0.53);
--ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);
--ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
--ease-in-cubic: cubic-bezier(0.55, 0.055, 0.675, 0.19);
--ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
--ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1);
--ease-in-quart: cubic-bezier(0.895, 0.03, 0.685, 0.22);
--ease-out-quart: cubic-bezier(0.165, 0.84, 0.44, 1);
--ease-in-out-quart: cubic-bezier(0.77, 0, 0.175, 1);
--ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
--ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
--ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
--ease-in-expo: cubic-bezier(0.95, 0.05, 0.795, 0.035);
--ease-out-expo: cubic-bezier(0.19, 1, 0.22, 1);
--ease-in-out-expo: cubic-bezier(1, 0, 0, 1);
--ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.335);
--ease-out-circ: cubic-bezier(0.075, 0.82, 0.165, 1);
--ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.15, 0.86);
}
src/toast.stories.tsx
+2 -3
View File
@@ -1,6 +1,6 @@
import type { Meta, StoryObj } from "@storybook/react-vite";
import { Button } from "./button";
import { toast, Toaster } from "./toast";
import { Toaster, toast } from "./toast";
const meta: Meta<typeof Toaster> = {
title: "toast/Toast",
@@ -87,8 +87,7 @@ export const Promise: Story = {
),
{
loading: "Uploading...",
success: (data) =>
`${(data as { name: string }).name} uploaded`,
success: (data) => `${(data as { name: string }).name} uploaded`,
error: "Upload failed",
},
)
src/toast.tsx
+8 -4
View File
@@ -71,14 +71,17 @@ function invoke(method: string | null, args: unknown[]): void {
if (!p) return;
void p.then((m) => {
const target =
method === null ? m.toast : (m.toast as unknown as Record<string, unknown>)[method];
method === null
? m.toast
: (m.toast as unknown as Record<string, unknown>)[method];
if (typeof target === "function") {
(target as (...a: unknown[]) => unknown)(...args);
}
});
}
const toastImpl = ((...args: unknown[]) => invoke(null, args)) as unknown as ToastFn;
const toastImpl = ((...args: unknown[]) =>
invoke(null, args)) as unknown as ToastFn;
for (const method of [
"success",
"error",
@@ -90,8 +93,9 @@ for (const method of [
"custom",
"promise",
] as const) {
(toastImpl as unknown as Record<string, unknown>)[method] = (...args: unknown[]) =>
invoke(method, args);
(toastImpl as unknown as Record<string, unknown>)[method] = (
...args: unknown[]
) => invoke(method, args);
}
const toast = toastImpl;
tsdown.config.ts
+1 -4
View File
@@ -2,10 +2,7 @@ import { defineConfig } from "tsdown";
export default defineConfig({
fixedExtension: false,
entry: [
"./src/**/*.(ts|tsx)",
"!./src/**/*.stories.(ts|tsx)",
],
entry: ["./src/**/*.(ts|tsx)", "!./src/**/*.stories.(ts|tsx)"],
format: "esm",
copy: [
{