SignInWithProvider

atom @rw3iss/auth-client/preact/atoms/SignInWithProvider framework-adapters/preact/components/atoms/SignInWithProvider.tsx ↗

Which label fits width px. Pure, and exported so the thresholds are testable without a DOM — the ResizeObserver path is just this plus a setState.

Usage

import { SignInWithProvider } from '@rw3iss/auth-client/preact/atoms';

<SignInWithProvider />

Props

Name	Type	Description
provider	ProviderIdentity | null	Host-supplied identity — skips the fetch entirely.
client	AuthClient	Bypass context lookup of the AuthClient.
variant	'color' | 'outline' | 'dark'	`color` uses the provider’s own brand colors when it published them; `outline` is neutral; `dark` matches the SSO dark buttons. Default `color` (falls back to outline styling with no colors).
size	'sm' | 'md' | 'lg'
iconOnly	boolean	Force icon-only (still fully labelled for screen readers).
shortName	boolean	Force the abbreviated name, whatever the available width.
label	string	Replace the full label text. The accessible name follows it.
href	string	Render an instead of a (e.g. the authorize URL).
target	string	Anchor target. `_blank` gets rel=“noopener noreferrer” added.
onClick	(event: MouseEvent) => void
disabled	boolean
loading	boolean	Renders a busy state (aria-busy + disabled) during a redirect.
requireMethod	ProviderAuthMethod | ProviderAuthMethod[] | false	Method(s) the deployment must support, or `false` to never gate. Default `[‘oidc’, ‘fedcm’]`.
responsive	boolean	Set false to always render the full label. Default true.
className	string	Custom widths (px) for the label swaps. Passing these switches to the measured path, since CSS can’t read a runtime value.