imccyu
cdd4d59ea0
Hand fixes for the findings --fix cannot touch, mirroring the fixes already applied on the fe-docs feature branch (same file, same shape) so its eventual rebase resolves cleanly: - restore the return the no-confusing-void-expression autofix ate in useAbsentSnapshot (typed S | undefined; hook call kept for hook-order stability, undefined returned explicitly); - re-type DOM queries the no-unnecessary-type-assertion autofix broke: getByRole<HTMLButtonElement>(...) generics instead of the removed as-casts (the eslint program and the client tsconfig aggregate disagree about these casts; the generic form satisfies both); - justified eslint-disable for the deliberate legacy paths: keyCode 229 IME-composition detection, execCommand clipboard fallbacks, lib.dom clipboard optionality, and the any-typed Reflect.get/this probes in test fakes; - drop the dead react/no-danger directive (eslint-plugin-react is not loaded, so the rule never applied) keeping its shiki rationale; - delete the tautological 'Z' comparison and the renameTarget null check already implied by renameBlocked; - css-module non-null assertions replaced by type widening (Button className, TAG_CLASS Record) per the established pattern; - misc: max-len comment wraps, void generic drop in the deferred test helper, unused type imports, floating selectWorkspace promises voided, member-delimiter newlines in inline type literals.
32 lines
1.2 KiB
TypeScript
32 lines
1.2 KiB
TypeScript
// Button: token-styled button atom. Variants map to the --dsw-alias-button-*
|
|
// fill families; no framework imports, all behavior via props.
|
|
|
|
import type { ButtonHTMLAttributes, ReactNode } from 'react'
|
|
import clsx from 'clsx'
|
|
import css from './Button.module.css'
|
|
|
|
/** Visual variant, each backed by its --dsw-alias-button-* token family. */
|
|
export type ButtonVariant = 'primary' | 'ghost' | 'outline' | 'toolbar'
|
|
|
|
/**
|
|
* Render a button.
|
|
* @param props.variant - visual family (default 'ghost').
|
|
* @param props.size - 'md' 36px capsule (figma Button) or 'sm' 28px compact.
|
|
* @param props.icon - optional leading 16px icon node.
|
|
* @returns the button element; native button attributes pass through.
|
|
*/
|
|
export function Button({ variant = 'ghost', size = 'md', icon, className, children, ...rest }: {
|
|
variant?: ButtonVariant
|
|
size?: 'md' | 'sm'
|
|
icon?: ReactNode
|
|
className?: string | undefined
|
|
children?: ReactNode
|
|
} & ButtonHTMLAttributes<HTMLButtonElement>) {
|
|
return (
|
|
<button type="button" className={clsx(css.button, css[variant], css[size], className)} {...rest}>
|
|
{icon != null && <span className={css.icon}>{icon}</span>}
|
|
{children}
|
|
</button>
|
|
)
|
|
}
|