npm - @alfadocs/ui-kit-debug - Versions diffs - 0.37.0 → 0.39.0 - Mend

@alfadocs/ui-kit-debug 0.37.0 → 0.39.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (497) hide show

package/dist/_chunks/signature-capture-BRzCklg4.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"signature-capture-BRzCklg4.js","sources":["../../src/components/signature-capture/signature-capture.agent.ts","../../src/components/signature-capture/signature-capture.tsx"],"sourcesContent":["import type { AgentAdapter } from '../../agent/types';\nimport type { SignatureCaptureHandle } from './signature-capture';\n\nexport const signatureCaptureAgent: AgentAdapter<SignatureCaptureHandle> = {\n id: 'signature-capture',\n capabilities: ['edit_inline', 'submit'],\n state: {\n isEmpty: {\n type: 'boolean',\n description: 'True when no signature has been drawn or typed.',\n read: (handle) => handle.isEmpty(),\n },\n },\n actions: {\n clear: {\n safety: 'destructive',\n description: 'Erase the current signature. Loses unsaved input.',\n invoke: (handle) => {\n handle.clear();\n },\n },\n undo: {\n safety: 'write',\n description: 'Undo the last stroke.',\n invoke: (handle) => {\n handle.undo();\n },\n },\n confirm: {\n safety: 'write',\n description: 'Commit the signature and return its serialised payload.',\n invoke: (handle) => handle.confirm(),\n },\n },\n domHooks: {\n root: { attr: 'data-component', value: 'signature-capture' },\n instanceId: {\n attr: 'data-component-id',\n sourceProp: 'id',\n description: 'Sourced from the id prop.',\n },\n },\n};\n","/* ------------------------------------------------------------------ */\n/* SignatureCapture — thin React wrapper over signature_pad. */\n/* */\n/* - Library: `signature_pad` (08-third-party §Signature Pad). We */\n/* instantiate one pad per mounted canvas and expose imperative */\n/* clear / undo / isEmpty / confirm verbs to the consumer. */\n/* - Colors: `penColor` / `backgroundColor` default to */\n/* `--foreground` / `--background` via `getComputedStyle()`. Theme */\n/* switches are observed via a MutationObserver on `<html class>` */\n/* so the ink recolours when the theme flips. */\n/* - DPR scaling: canvas attribute `width/height = cssSize * DPR`; the */\n/* 2D context is scaled by the same factor. A `ResizeObserver` */\n/* replays strokes via `fromData()` on re-scale so nothing is lost. */\n/* - Typed fallback: keyboard-only path renders a text input styled in */\n/* italic `var(--font-sans)` (per 23-constraints §10 — serif is */\n/* marketing only). On confirm we render the string to an offscreen */\n/* canvas for the PNG/SVG export. */\n/* - Confirm payload: `{ png, svg, widthMm, heightMm, capturedAt, */\n/* sha256, strokes? }`. `sha256` is the SubtleCrypto digest of the */\n/* PNG bytes — tamper-evident for audit trails. */\n/* - Security: no `fetch` / `XMLHttpRequest` / `localStorage` / */\n/* `sessionStorage` in this file — the consumer owns persistence. */\n/* */\n/* TODO: */\n/* - 3× DPI re-render for print: currently `toDataURL('image/png')` */\n/* exports the live canvas (already at DPR). A proper 300-DPI */\n/* pipeline would create an offscreen canvas at `cssSize × 3` and */\n/* replay strokes via `fromData()` — deferred pending the print */\n/* bridge landing. */\n/* - Typed-fallback canvas font can't read CSS variables directly */\n/* (Canvas2D resolves fonts at paint time and won't expand */\n/* `var(--font-size-2xl)`); we use a fixed `32px italic` + the */\n/* user's font stack, which is visually close but not */\n/* theme-reactive. Will migrate once the typography tokens expose */\n/* a resolved `font` shorthand. */\n/* ------------------------------------------------------------------ */\n\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n type CSSProperties,\n} from 'react';\nimport SignaturePad from 'signature_pad';\nimport type { PointGroup } from 'signature_pad';\nimport { cva } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { useAgentRegistration } from '../../agent/registry';\nimport { signatureCaptureAgent } from './signature-capture.agent';\n\n/* ------------------------------------------------------------------ */\n/* Public types */\n/* ------------------------------------------------------------------ */\n\nexport interface SignatureConfirmPayload {\n /** Data URL of the captured signature rendered as PNG. */\n png: string;\n /** SVG string trimmed to the stroke bounding box. */\n svg: string;\n /** Physical width in millimetres, derived from CSS px. */\n widthMm: number;\n /** Physical height in millimetres, derived from CSS px. */\n heightMm: number;\n /** ISO-8601 UTC timestamp for when `confirm()` resolved. */\n capturedAt: string;\n /** Hex-encoded SHA-256 digest of the PNG bytes. */\n sha256: string;\n /** Raw stroke data from `signature_pad.toData()` — optional for replays. */\n strokes?: PointGroup[];\n}\n\nexport interface SignatureCaptureProps {\n /** Opaque instance id — emitted as `data-component-id` for the agent registry. */\n id?: string;\n /** Called with the export payload when the user confirms the signature. */\n onConfirm?: (payload: SignatureConfirmPayload) => void;\n /** Called after the pad is cleared (explicit user action). */\n onClear?: () => void;\n /** Called when the user starts drawing a new stroke. */\n onStart?: () => void;\n /** CSS width of the pad. Default 400. */\n width?: number | string;\n /** CSS height of the pad. Default 200. */\n height?: number | string;\n /** Pen colour override — defaults to `var(--foreground)`. */\n penColor?: string;\n /** Background override — defaults to `var(--background)`. */\n backgroundColor?: string;\n /** Show the typed-name fallback toggle. Default `true`. */\n allowTypedFallback?: boolean;\n /** Disable the entire component. */\n disabled?: boolean;\n /** Accessible label for the pad region. */\n ariaLabel?: string;\n /** Extra class names on the wrapper. */\n className?: string;\n}\n\nexport interface SignatureCaptureHandle {\n clear: () => void;\n undo: () => void;\n isEmpty: () => boolean;\n confirm: () => Promise<SignatureConfirmPayload | null>;\n}\n\n/* ------------------------------------------------------------------ */\n/* CVA */\n/* ------------------------------------------------------------------ */\n\nconst wrapperVariants = cva(\n [\n 'ds:signature-capture-alfadocs ds:flex ds:flex-col',\n 'ds:gap-[var(--spacing-sm)]',\n 'ds:bg-[var(--background)] ds:text-[var(--foreground)]',\n 'ds:rounded-[var(--radius-md)] ds:border ds:border-[color:var(--card-border)]',\n 'ds:shadow-[var(--shadow-card)]',\n 'ds:[.theme-accessible_&]:border-2',\n 'ds:p-[var(--spacing-sm)]',\n 'ds:aria-disabled:opacity-[var(--opacity-50)] ds:aria-disabled:cursor-not-allowed',\n ].join(' '),\n);\n\nconst padFrameVariants = cva(\n [\n 'ds:relative ds:block',\n 'ds:inline-size-[var(--signature-width)]',\n 'ds:block-size-[var(--signature-height)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:border ds:border-[color:var(--border)]',\n 'ds:bg-[var(--background)]',\n 'ds:overflow-hidden',\n 'ds:touch-none',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)]',\n 'ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[var(--ring)]',\n 'ds:forced-colors:focus-visible:outline-[CanvasText]',\n ].join(' '),\n);\n\nconst canvasVariants = cva(\n [\n 'ds:block',\n 'ds:inline-size-full',\n 'ds:block-size-full',\n 'ds:touch-none',\n 'ds:select-none',\n ].join(' '),\n);\n\nconst toolbarVariants = cva(\n ['ds:flex ds:items-center ds:flex-wrap ds:gap-[var(--spacing-xs)]'].join(' '),\n);\n\nconst actionButtonVariants = cva(\n [\n 'ds:inline-flex ds:items-center ds:justify-center',\n 'ds:min-block-size-[var(--min-target-size)]',\n 'ds:min-inline-size-[var(--min-target-size)]',\n 'ds:gap-[var(--spacing-xs)]',\n 'ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:border ds:border-[color:var(--border)]',\n 'ds:bg-transparent ds:text-[var(--foreground)]',\n 'ds:text-[length:var(--font-size-sm)] ds:font-medium',\n 'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n 'ds:hover:bg-[var(--muted)]',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)]',\n 'ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[var(--ring)]',\n 'ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:forced-colors:focus-visible:outline-[CanvasText]',\n 'ds:aria-disabled:opacity-[var(--opacity-50)] ds:aria-disabled:cursor-not-allowed',\n ].join(' '),\n);\n\nconst confirmButtonVariants = cva(\n [\n 'ds:inline-flex ds:items-center ds:justify-center',\n 'ds:min-block-size-[var(--min-target-size)]',\n 'ds:min-inline-size-[var(--min-target-size)]',\n 'ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:bg-[var(--primary)] ds:text-[var(--primary-foreground)]',\n 'ds:text-[length:var(--font-size-sm)] ds:font-medium',\n 'ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none',\n 'ds:hover:bg-[var(--primary-hover)]',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)]',\n 'ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[var(--ring)]',\n 'ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n 'ds:forced-colors:focus-visible:outline-[CanvasText]',\n 'ds:aria-disabled:opacity-[var(--opacity-50)] ds:aria-disabled:cursor-not-allowed',\n ].join(' '),\n);\n\nconst typedInputVariants = cva(\n [\n 'ds:block ds:inline-size-full',\n 'ds:min-block-size-[var(--min-target-size)]',\n 'ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:border ds:border-[color:var(--border)]',\n 'ds:bg-[var(--background)] ds:text-[var(--foreground)]',\n 'ds:font-[family-name:var(--font-sans)]',\n 'ds:italic',\n 'ds:tracking-[0.1em]',\n 'ds:text-[length:var(--font-size-lg)]',\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)]',\n 'ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[var(--ring)]',\n 'ds:forced-colors:focus-visible:outline-[CanvasText]',\n ].join(' '),\n);\n\nconst typedPreviewVariants = cva(\n [\n 'ds:flex ds:items-center ds:justify-center',\n 'ds:inline-size-[var(--signature-width)]',\n 'ds:block-size-[var(--signature-height)]',\n 'ds:rounded-[var(--radius-sm)]',\n 'ds:border ds:border-[color:var(--card-border)]',\n 'ds:[.theme-accessible_&]:border-2',\n 'ds:bg-[var(--background)] ds:text-[var(--foreground)]',\n 'ds:font-[family-name:var(--font-sans)]',\n 'ds:italic',\n 'ds:tracking-[0.1em]',\n 'ds:text-[length:var(--font-size-2xl)]',\n 'ds:p-[var(--spacing-md)]',\n ].join(' '),\n);\n\n/* ------------------------------------------------------------------ */\n/* Helpers */\n/* ------------------------------------------------------------------ */\n\ntype SignatureState = 'empty' | 'drawing' | 'captured' | 'cleared';\n\n/**\n * Resolve a CSS custom property against `document.documentElement`. We\n * can't pass `var(--foreground)` to signature_pad directly — the lib\n * stamps the string straight into `ctx.strokeStyle`, which only accepts\n * concrete colour values. Looking the variable up at runtime keeps the\n * component in tokens-only compliance.\n */\nfunction resolveCssVar(name: string): string {\n if (typeof document === 'undefined') return '';\n const value = getComputedStyle(document.documentElement)\n .getPropertyValue(name)\n .trim();\n return value;\n}\n\nfunction toCssSize(v: number | string | undefined, fallback: string): string {\n if (typeof v === 'number') return `${v}px`;\n if (typeof v === 'string' && v.length > 0) return v;\n return fallback;\n}\n\n/**\n * Parse a pixel value, returning `null` for non-pixel strings (e.g.\n * \"100%\", \"50vw\") so the caller can fall back to the measured rect.\n * parseFloat(\"100%\") would silently return 100 — a 100mm-wide export\n * masquerading as 26mm. Allow only digits, dot, minus, whitespace, \"px\".\n */\nfunction parsePxValue(v: string): number | null {\n if (typeof v === 'string' && /[^0-9.\\s\\-px]/i.test(v)) return null;\n const n = parseFloat(v);\n if (!Number.isFinite(n)) return null;\n return n;\n}\n\n/** Hex-encode a Uint8Array. */\nfunction toHex(bytes: Uint8Array): string {\n let out = '';\n for (let i = 0; i < bytes.length; i += 1) {\n const b = bytes[i];\n out += b.toString(16).padStart(2, '0');\n }\n return out;\n}\n\n/** Decode a base64 string into bytes without `atob` polyfills. */\nfunction base64ToBytes(b64: string): Uint8Array {\n if (typeof atob === 'function') {\n const bin = atob(b64);\n const bytes = new Uint8Array(bin.length);\n for (let i = 0; i < bin.length; i += 1) bytes[i] = bin.charCodeAt(i);\n return bytes;\n }\n // Fallback — node-style Buffer, gated behind a runtime check.\n const g = globalThis as {\n Buffer?: { from: (s: string, enc: string) => Uint8Array };\n };\n if (g.Buffer) return g.Buffer.from(b64, 'base64');\n return new Uint8Array();\n}\n\nasync function sha256Hex(bytes: Uint8Array): Promise<string> {\n const g = globalThis as { crypto?: Crypto };\n if (g.crypto?.subtle) {\n // Copy the bytes into a fresh ArrayBuffer so the slice is always an\n // ArrayBuffer (never a SharedArrayBuffer) — SubtleCrypto's BufferSource\n // narrowing doesn't accept the latter.\n const copy = new Uint8Array(bytes.byteLength);\n copy.set(bytes);\n const digest = await g.crypto.subtle.digest('SHA-256', copy.buffer);\n return toHex(new Uint8Array(digest));\n }\n // No subtle crypto — return empty so callers can still use the rest\n // of the payload. Test env is expected to stub crypto.subtle.\n return '';\n}\n\n/**\n * Render the typed fallback string onto an offscreen canvas and return\n * it. Used by the confirm path when the user has typed their name\n * instead of drawing. Size is fixed at `32px italic` because Canvas2D\n * resolves fonts eagerly and can't expand `var(--font-size-*)`.\n */\nfunction renderTypedSignatureToCanvas(\n text: string,\n cssWidth: number,\n cssHeight: number,\n penColor: string,\n backgroundColor: string,\n): HTMLCanvasElement {\n const dpr = Math.max(\n 1,\n typeof window !== 'undefined' ? window.devicePixelRatio : 1,\n );\n const canvas = document.createElement('canvas');\n canvas.width = Math.floor(cssWidth * dpr);\n canvas.height = Math.floor(cssHeight * dpr);\n const ctx = canvas.getContext('2d');\n if (!ctx) return canvas;\n ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\n // Fill background with the token-resolved colour.\n ctx.fillStyle = backgroundColor || 'transparent';\n ctx.fillRect(0, 0, cssWidth, cssHeight);\n // Draw the typed signature centred.\n ctx.fillStyle = penColor || 'currentColor';\n ctx.font = '32px italic sans-serif';\n ctx.textAlign = 'center';\n ctx.textBaseline = 'middle';\n ctx.fillText(text, cssWidth / 2, cssHeight / 2, cssWidth - 16);\n return canvas;\n}\n\n/* ------------------------------------------------------------------ */\n/* SignatureCapture */\n/* ------------------------------------------------------------------ */\n\nexport const SignatureCapture = forwardRef<\n SignatureCaptureHandle,\n SignatureCaptureProps\n>(\n (\n {\n id,\n onConfirm,\n onClear,\n onStart,\n width = 400,\n height = 200,\n penColor,\n backgroundColor,\n allowTypedFallback = true,\n disabled = false,\n ariaLabel,\n className,\n },\n ref,\n ) => {\n const { t } = useTranslation();\n const rawId = useId();\n const idSafe = useMemo(\n () => `sig-${rawId.replace(/[^a-zA-Z0-9-_]/g, '')}`,\n [rawId],\n );\n const liveRegionId = `${idSafe}-live`;\n\n const wrapperRef = useRef<HTMLDivElement>(null);\n const padFrameRef = useRef<HTMLDivElement>(null);\n const canvasRef = useRef<HTMLCanvasElement>(null);\n const typedPreviewRef = useRef<HTMLDivElement>(null);\n const signaturePadRef = useRef<SignaturePad | null>(null);\n\n const [mode, setMode] = useState<'draw' | 'typed'>('draw');\n const [typedValue, setTypedValue] = useState('');\n // Tracks whether the pad has any ink — gates the Confirm button.\n // signature_pad's isEmpty() is a sync ref read and won't trigger\n // re-renders; this state mirrors it so React sees the change.\n const [padHasInk, setPadHasInk] = useState(false);\n // Retained state — consumers may subscribe to the pad's lifecycle via\n // `onConfirm`/`onClear`/`onStart`; we still track the machine internally\n // so the live region + confirm button stay coherent.\n const signatureStateRef = useRef<SignatureState>('empty');\n const [announcement, setAnnouncement] = useState<string>('');\n const [resolvedPen, setResolvedPen] = useState<string>('');\n const [resolvedBg, setResolvedBg] = useState<string>('');\n\n // Stable callback refs so we can wire signature_pad once without\n // re-instantiating on every render.\n const onStartRef = useRef<SignatureCaptureProps['onStart']>(onStart);\n const onClearRef = useRef<SignatureCaptureProps['onClear']>(onClear);\n const onConfirmRef = useRef<SignatureCaptureProps['onConfirm']>(onConfirm);\n useEffect(() => {\n onStartRef.current = onStart;\n onClearRef.current = onClear;\n onConfirmRef.current = onConfirm;\n }, [onStart, onClear, onConfirm]);\n\n /* ---- Announce helper ---------------------------------------- */\n const announce = useCallback(\n (next: SignatureState) => {\n signatureStateRef.current = next;\n setAnnouncement(t(`signature.state.${next}`));\n },\n [t],\n );\n\n /* ---- Resolve tokens ----------------------------------------- */\n useEffect(() => {\n if (typeof document === 'undefined') return undefined;\n function resolveAll(): void {\n const pen = penColor ?? resolveCssVar('--foreground');\n const bg = backgroundColor ?? resolveCssVar('--background');\n // Fall back to `currentColor` / `transparent` — keyword literals\n // are token-neutral and honour the surrounding theme even when\n // the CSS variable is briefly unavailable (SSR, initial paint).\n setResolvedPen(pen || 'currentColor');\n setResolvedBg(bg || 'transparent');\n }\n resolveAll();\n // Watch for theme-class changes on <html>.\n const mo = new MutationObserver(() => {\n resolveAll();\n });\n mo.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class'],\n });\n return () => mo.disconnect();\n }, [penColor, backgroundColor]);\n\n /* ---- Apply colour changes to an existing pad ---------------- */\n useEffect(() => {\n const pad = signaturePadRef.current;\n if (!pad) return;\n if (resolvedPen) pad.penColor = resolvedPen;\n if (resolvedBg) pad.backgroundColor = resolvedBg;\n }, [resolvedPen, resolvedBg]);\n\n /* ---- Instantiate signature_pad ------------------------------ */\n useEffect(() => {\n if (mode !== 'draw') return undefined;\n const canvas = canvasRef.current;\n if (!canvas) return undefined;\n\n const pad = new SignaturePad(canvas, {\n penColor: resolvedPen || 'currentColor',\n backgroundColor: resolvedBg || 'transparent',\n minWidth: 0.5,\n maxWidth: 2.5,\n velocityFilterWeight: 0.7,\n });\n signaturePadRef.current = pad;\n\n const handleBegin = (): void => {\n setPadHasInk(true);\n announce('drawing');\n onStartRef.current?.();\n };\n const handleEnd = (): void => {\n // Keep state as 'drawing' — transition to 'captured' on confirm.\n };\n pad.addEventListener('beginStroke', handleBegin);\n pad.addEventListener('endStroke', handleEnd);\n\n // Initial DPR scale + announcement.\n scaleCanvas(canvas);\n announce('empty');\n\n return () => {\n pad.removeEventListener('beginStroke', handleBegin);\n pad.removeEventListener('endStroke', handleEnd);\n // Clear strokes from memory; 08-third-party §Signature Pad.\n pad.clear();\n pad.off();\n signaturePadRef.current = null;\n };\n // We intentionally re-create the pad only when switching between\n // typed and draw modes. Color updates flow through the effect above.\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [mode]);\n\n /* ---- Disabled state ----------------------------------------- */\n useEffect(() => {\n const pad = signaturePadRef.current;\n if (!pad) return;\n if (disabled) pad.off();\n else pad.on();\n }, [disabled, mode]);\n\n /* ---- DPR + ResizeObserver ----------------------------------- */\n // Hard-cap backing-store dimensions to bound memory. 4096 px × 4096 px at\n // 4 bytes per pixel is ~67 MB — generous for any realistic signature, but\n // well under the multi-GB allocation a careless or malicious prop could\n // request on a high-DPR display. See security-hardening.mdx.\n const MAX_CANVAS_PX = 4096;\n const scaleCanvas = useCallback(\n (canvas: HTMLCanvasElement) => {\n const rect = canvas.getBoundingClientRect();\n const dpr = Math.max(\n 1,\n typeof window !== 'undefined' ? window.devicePixelRatio : 1,\n );\n const rawWidth = Math.max(1, Math.floor(rect.width * dpr));\n const rawHeight = Math.max(1, Math.floor(rect.height * dpr));\n const targetWidth = Math.min(rawWidth, MAX_CANVAS_PX);\n const targetHeight = Math.min(rawHeight, MAX_CANVAS_PX);\n if (\n import.meta.env.DEV &&\n (rawWidth !== targetWidth || rawHeight !== targetHeight)\n ) {\n // Silent in production; a consumer shipping 10k × 10k probably wants\n // the nudge.\n console.warn(\n `[SignatureCapture] clamped canvas backing store from ${rawWidth}x${rawHeight} to ${targetWidth}x${targetHeight} (cap = ${MAX_CANVAS_PX}px).`,\n );\n }\n if (canvas.width === targetWidth && canvas.height === targetHeight)\n return;\n\n const pad = signaturePadRef.current;\n const prior = pad ? pad.toData() : null;\n canvas.width = targetWidth;\n canvas.height = targetHeight;\n const ctx = canvas.getContext('2d');\n if (ctx) ctx.scale(dpr, dpr);\n if (pad) {\n if (resolvedBg) pad.backgroundColor = resolvedBg;\n if (resolvedPen) pad.penColor = resolvedPen;\n pad.clear();\n if (prior && prior.length > 0) {\n pad.fromData(prior);\n }\n }\n },\n [resolvedBg, resolvedPen],\n );\n\n useEffect(() => {\n const canvas = canvasRef.current;\n if (!canvas) return undefined;\n if (typeof ResizeObserver === 'undefined') {\n scaleCanvas(canvas);\n return undefined;\n }\n const ro = new ResizeObserver(() => {\n scaleCanvas(canvas);\n });\n ro.observe(canvas);\n return () => ro.disconnect();\n }, [scaleCanvas]);\n\n /* ---- Imperative handle -------------------------------------- */\n const clear = useCallback(() => {\n const pad = signaturePadRef.current;\n if (pad) pad.clear();\n setTypedValue('');\n setPadHasInk(false);\n announce('cleared');\n onClearRef.current?.();\n }, [announce]);\n\n const undo = useCallback(() => {\n const pad = signaturePadRef.current;\n if (!pad) return;\n const data = pad.toData();\n if (!data || data.length === 0) return;\n data.pop();\n pad.fromData(data);\n if (data.length === 0) {\n setPadHasInk(false);\n announce('empty');\n }\n }, [announce]);\n\n const isEmpty = useCallback((): boolean => {\n if (mode === 'typed') return typedValue.trim().length === 0;\n const pad = signaturePadRef.current;\n return pad ? pad.isEmpty() : true;\n }, [mode, typedValue]);\n\n const confirm =\n useCallback(async (): Promise<SignatureConfirmPayload | null> => {\n // parsePxValue returns null for \"100%\" / \"50vw\" etc. — fall back\n // to the live rendered rect so widthMm reflects reality, not a\n // mis-parsed parseFloat(\"100%\") = 100.\n const widthParsed = parsePxValue(\n typeof width === 'number' ? `${width}` : String(width),\n );\n const heightParsed = parsePxValue(\n typeof height === 'number' ? `${height}` : String(height),\n );\n const measureEl =\n mode === 'draw'\n ? (canvasRef.current ?? padFrameRef.current ?? wrapperRef.current)\n : (typedPreviewRef.current ?? wrapperRef.current);\n const measuredRect = measureEl?.getBoundingClientRect();\n const cssWidth =\n widthParsed ?? (measuredRect ? measuredRect.width : 400);\n const cssHeight =\n heightParsed ?? (measuredRect ? measuredRect.height : 200);\n\n let pngDataUrl = '';\n let svgString = '';\n let strokes: PointGroup[] | undefined;\n\n if (mode === 'draw') {\n const pad = signaturePadRef.current;\n if (!pad || pad.isEmpty()) return null;\n pngDataUrl = pad.toDataURL('image/png');\n svgString = pad.toSVG();\n strokes = pad.toData();\n } else {\n const value = typedValue.trim();\n if (value.length === 0) return null;\n const offscreen = renderTypedSignatureToCanvas(\n value,\n cssWidth,\n cssHeight,\n resolvedPen || 'currentColor',\n resolvedBg || 'transparent',\n );\n pngDataUrl = offscreen.toDataURL('image/png');\n // Inline SVG — we can't call toSVG() because signature_pad isn't\n // driving the canvas. Build a minimal SVG with the rendered text.\n const safeText = value\n .replace(/&/g, '&')\n .replace(/</g, '<')\n .replace(/>/g, '>')\n .replace(/\"/g, '"')\n .replace(/'/g, ''');\n svgString =\n `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 ${cssWidth} ${cssHeight}\" width=\"${cssWidth}\" height=\"${cssHeight}\">` +\n `<text x=\"50%\" y=\"50%\" dominant-baseline=\"middle\" text-anchor=\"middle\" font-family=\"sans-serif\" font-style=\"italic\" font-size=\"32\" fill=\"${resolvedPen || 'currentColor'}\" letter-spacing=\"3\">${safeText}</text>` +\n `</svg>`;\n }\n\n // 96 CSS px = 25.4 mm (per W3C CSS absolute length definition).\n const widthMm = (cssWidth * 25.4) / 96;\n const heightMm = (cssHeight * 25.4) / 96;\n const capturedAt = new Date().toISOString();\n\n // Compute SHA-256 of the PNG bytes.\n let sha256 = '';\n if (pngDataUrl) {\n const commaIx = pngDataUrl.indexOf(',');\n const b64 = commaIx >= 0 ? pngDataUrl.slice(commaIx + 1) : '';\n const bytes = base64ToBytes(b64);\n sha256 = await sha256Hex(bytes);\n }\n\n const payload: SignatureConfirmPayload = {\n png: pngDataUrl,\n svg: svgString,\n widthMm,\n heightMm,\n capturedAt,\n sha256,\n strokes,\n };\n\n announce('captured');\n onConfirmRef.current?.(payload);\n return payload;\n }, [mode, typedValue, width, height, resolvedPen, resolvedBg, announce]);\n\n const agentHandle = useMemo<SignatureCaptureHandle>(\n () => ({\n clear,\n undo,\n isEmpty,\n confirm,\n }),\n [clear, undo, isEmpty, confirm],\n );\n useImperativeHandle(ref, () => agentHandle, [agentHandle]);\n useAgentRegistration(signatureCaptureAgent, agentHandle, id);\n\n /* ---- Derived UI state --------------------------------------- */\n // Gate Confirm on React state, not the signature_pad ref — its\n // isEmpty() doesn't trigger re-renders, leaving the button stale.\n const hasContent =\n mode === 'typed' ? typedValue.trim().length > 0 : padHasInk;\n const confirmDisabled = disabled || !hasContent;\n // Inline style — permitted per 23-constraints §Runtime-computed\n // dimensions (CSS custom property setter for dynamic width/height\n // from consumer props; the width rule lives in Tailwind arbitrary\n // values that read --signature-width / --signature-height).\n const sizeStyle: CSSProperties = {\n ['--signature-width' as unknown as keyof CSSProperties]: toCssSize(\n width,\n 'var(--signature-default-width)',\n ),\n ['--signature-height' as unknown as keyof CSSProperties]: toCssSize(\n height,\n 'var(--signature-default-height)',\n ),\n } as CSSProperties;\n\n /* ---- Render -------------------------------------------------- */\n return (\n <div\n ref={wrapperRef}\n role=\"group\"\n aria-label={ariaLabel ?? t('signature.padLabel')}\n aria-disabled={disabled || undefined}\n className={[wrapperVariants(), className].filter(Boolean).join(' ')}\n // eslint-disable-next-line react/forbid-dom-props -- runtime-computed pad dimensions\n style={sizeStyle}\n data-component=\"signature-capture\"\n data-component-id={id}\n >\n {mode === 'draw' ? (\n <div ref={padFrameRef} className={padFrameVariants()}>\n <canvas\n ref={canvasRef}\n role=\"img\"\n aria-label={t('signature.padLabel')}\n className={canvasVariants()}\n data-testid=\"signature-canvas\"\n />\n </div>\n ) : (\n <label className=\"ds:flex ds:flex-col ds:gap-[var(--spacing-xs)]\">\n <span className=\"type-body-sm ds:text-[var(--muted-foreground)]\">\n {t('signature.typedFallback.label')}\n </span>\n <input\n type=\"text\"\n value={typedValue}\n onChange={(e) => {\n setTypedValue(e.target.value);\n if (e.target.value.length > 0) announce('drawing');\n else announce('empty');\n }}\n placeholder={t('signature.typedFallback.placeholder')}\n aria-label={t('signature.typedFallback.label')}\n disabled={disabled}\n className={typedInputVariants()}\n data-testid=\"signature-typed-input\"\n />\n {typedValue ? (\n <div\n ref={typedPreviewRef}\n className={typedPreviewVariants()}\n aria-hidden=\"true\"\n >\n {typedValue}\n </div>\n ) : null}\n </label>\n )}\n\n {/* Live region — state transitions (empty, drawing, captured, cleared) */}\n <div\n id={liveRegionId}\n aria-live=\"polite\"\n aria-atomic=\"true\"\n className=\"ds:sr-only\"\n data-testid=\"signature-live\"\n >\n {announcement}\n </div>\n\n <div\n className={toolbarVariants()}\n role=\"group\"\n aria-label={t('signature.padLabel')}\n >\n <button\n type=\"button\"\n onClick={() => {\n if (disabled) return;\n clear();\n }}\n aria-disabled={disabled || undefined}\n className={actionButtonVariants()}\n >\n {t('signature.clear')}\n </button>\n {mode === 'draw' ? (\n <button\n type=\"button\"\n onClick={() => {\n if (disabled) return;\n undo();\n }}\n aria-disabled={disabled || undefined}\n className={actionButtonVariants()}\n >\n {t('signature.undo')}\n </button>\n ) : null}\n {allowTypedFallback ? (\n <button\n type=\"button\"\n onClick={() => {\n if (disabled) return;\n setTypedValue('');\n setMode((m) => (m === 'draw' ? 'typed' : 'draw'));\n announce('cleared');\n }}\n aria-disabled={disabled || undefined}\n className={actionButtonVariants()}\n aria-pressed={mode === 'typed'}\n >\n {mode === 'draw'\n ? t('signature.typedFallback.toggle')\n : t('signature.typedFallback.toggleDraw')}\n </button>\n ) : null}\n <button\n type=\"button\"\n onClick={() => {\n if (confirmDisabled) return;\n void confirm();\n }}\n aria-disabled={confirmDisabled || undefined}\n aria-describedby={liveRegionId}\n className={confirmButtonVariants()}\n data-testid=\"signature-confirm\"\n >\n {t('signature.confirm')}\n </button>\n </div>\n </div>\n );\n },\n);\n\nSignatureCapture.displayName = 'SignatureCapture';\n\nexport {\n wrapperVariants as signatureWrapperVariants,\n actionButtonVariants as signatureActionButtonVariants,\n confirmButtonVariants as signatureConfirmButtonVariants,\n};\n"],"names":["signatureCaptureAgent","handle","wrapperVariants","cva","padFrameVariants","canvasVariants","toolbarVariants","actionButtonVariants","confirmButtonVariants","typedInputVariants","typedPreviewVariants","resolveCssVar","name","toCssSize","v","fallback","parsePxValue","toHex","bytes","out","i","b","base64ToBytes","b64","bin","g","sha256Hex","_a","copy","digest","renderTypedSignatureToCanvas","text","cssWidth","cssHeight","penColor","backgroundColor","dpr","canvas","ctx","SignatureCapture","forwardRef","id","onConfirm","onClear","onStart","width","height","allowTypedFallback","disabled","ariaLabel","className","ref","t","useTranslation","rawId","useId","liveRegionId","useMemo","wrapperRef","useRef","padFrameRef","canvasRef","typedPreviewRef","signaturePadRef","mode","setMode","useState","typedValue","setTypedValue","padHasInk","setPadHasInk","signatureStateRef","announcement","setAnnouncement","resolvedPen","setResolvedPen","resolvedBg","setResolvedBg","onStartRef","onClearRef","onConfirmRef","useEffect","announce","useCallback","next","resolveAll","pen","bg","mo","pad","SignaturePad","handleBegin","handleEnd","scaleCanvas","MAX_CANVAS_PX","rect","rawWidth","rawHeight","targetWidth","targetHeight","prior","ro","clear","undo","data","isEmpty","confirm","widthParsed","heightParsed","measureEl","measuredRect","pngDataUrl","svgString","strokes","value","safeText","widthMm","heightMm","capturedAt","sha256","commaIx","payload","agentHandle","useImperativeHandle","useAgentRegistration","hasContent","confirmDisabled","sizeStyle","jsxs","jsx","m"],"mappings":"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"}

package/dist/_chunks/social-sign-in-button-X54ySJr1.js ADDED Viewed

@@ -0,0 +1,243 @@
+import { jsx as s, jsxs as m } from "react/jsx-runtime";
+import { forwardRef as y, useRef as p, useEffect as N } from "react";
+import { c as n } from "./index-D2ZczOXr.js";
+import { useTranslation as j } from "react-i18next";
+import { S as V } from "./spinner-CCByyvcb.js";
+function A({ className: e }) {
+  return /* @__PURE__ */ s(
+    "svg",
+    {
+      "aria-hidden": "true",
+      focusable: "false",
+      viewBox: "0 0 24 24",
+      fill: "currentColor",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: e,
+      children: /* @__PURE__ */ s("path", { d: "M17.05 12.536c-.024-2.51 2.05-3.715 2.143-3.774-1.168-1.708-2.985-1.942-3.63-1.967-1.546-.157-3.018.91-3.802.91-.783 0-1.99-.888-3.273-.864-1.684.025-3.236.978-4.102 2.485-1.748 3.03-.448 7.513 1.255 9.97.832 1.203 1.825 2.552 3.127 2.504 1.255-.05 1.73-.81 3.247-.81 1.518 0 1.945.81 3.273.786 1.351-.025 2.206-1.227 3.03-2.434.955-1.394 1.348-2.745 1.372-2.815-.03-.013-2.633-1.01-2.66-4.001m-2.48-7.343c.692-.838 1.158-2.002 1.03-3.163-.997.04-2.205.664-2.92 1.502-.64.742-1.2 1.927-1.05 3.066 1.112.086 2.247-.566 2.94-1.405" })
+    }
+  );
+}
+function v({ className: e }) {
+  return /* @__PURE__ */ m(
+    "svg",
+    {
+      "aria-hidden": "true",
+      focusable: "false",
+      viewBox: "0 0 24 24",
+      xmlns: "http://www.w3.org/2000/svg",
+      className: e,
+      children: [
+        /* @__PURE__ */ s(
+          "path",
+          {
+            fill: "#4285F4",
+            d: "M23.52 12.273c0-.851-.076-1.67-.218-2.455H12v4.642h6.458a5.52 5.52 0 0 1-2.394 3.622v3.01h3.878c2.269-2.09 3.578-5.166 3.578-8.819z"
+          }
+        ),
+        /* @__PURE__ */ s(
+          "path",
+          {
+            fill: "#34A853",
+            d: "M12 24c3.24 0 5.956-1.075 7.942-2.908l-3.878-3.01c-1.075.72-2.45 1.146-4.064 1.146-3.125 0-5.77-2.11-6.714-4.946H1.276v3.106A11.995 11.995 0 0 0 12 24z"
+          }
+        ),
+        /* @__PURE__ */ s(
+          "path",
+          {
+            fill: "#FBBC05",
+            d: "M5.286 14.282A7.213 7.213 0 0 1 4.91 12c0-.792.136-1.562.376-2.282V6.612H1.276A11.995 11.995 0 0 0 0 12c0 1.936.464 3.768 1.276 5.388l4.01-3.106z"
+          }
+        ),
+        /* @__PURE__ */ s(
+          "path",
+          {
+            fill: "#EA4335",
+            d: "M12 4.773c1.762 0 3.344.605 4.589 1.794l3.442-3.442C17.951 1.19 15.235 0 12 0A11.995 11.995 0 0 0 1.276 6.612l4.01 3.106C6.23 6.882 8.875 4.773 12 4.773z"
+          }
+        )
+      ]
+    }
+  );
+}
+const M = n(
+  [
+    "ds:relative ds:inline-flex ds:items-center ds:justify-center",
+    "ds:font-medium ds:whitespace-nowrap",
+    "ds:rounded-[var(--radius-md)]",
+    "ds:gap-[var(--spacing-sm)]",
+    "ds:border ds:border-solid",
+    "ds:active:opacity-90",
+    "ds:transition-[background-color,box-shadow,opacity]",
+    "ds:duration-[var(--animation-duration)]",
+    // Focus ring is `var(--ring)` (the kit primary), NEVER the brand
+    // surface colour — painting the ring in the brand hue on a brand
+    // surface makes it invisible. Same rule WhatsAppButton codifies.
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    // Windows High Contrast Mode strips brand fills — repaint a solid
+    // border edge + swap the focus ring to CanvasText so the affordance
+    // stays identifiable.
+    "ds:forced-colors:border-[ButtonBorder]",
+    "ds:forced-colors:focus-visible:outline-[CanvasText]",
+    "ds:disabled:opacity-50 ds:disabled:cursor-not-allowed",
+    "ds:aria-busy:cursor-wait",
+    "ds:motion-reduce:transition-none"
+  ].join(" "),
+  {
+    variants: {
+      provider: {
+        apple: "",
+        google: ""
+      },
+      appearance: {
+        light: "",
+        dark: ""
+      },
+      size: {
+        // Heights mirror Button (sm 32 / md 40 / lg 48). `sm` (32px) and
+        // `md` (40px) both fall below `--min-target-size` (44 base / 48
+        // accessible), so each adds the ::before pseudo-element touch-
+        // target expansion to reach the minimum on mobile, collapsing
+        // above the `sm:` breakpoint. This component is the patient
+        // check-in (HTP-5104) mobile sign-in surface and `md` is the
+        // DEFAULT size rendered there, so it MUST meet WCAG 2.5.5 at both
+        // theme levels — unlike Button/WhatsApp, we do not leave md short.
+        // `lg` (48px) already meets the minimum natively.
+        sm: [
+          "ds:h-8 ds:ps-3 ds:pe-3 ds:text-[length:var(--font-size-sm)] ds:[&_svg]:size-4",
+          "ds:min-h-[var(--min-target-size)] ds:sm:min-h-0",
+          'ds:before:absolute ds:before:inset-x-[calc((var(--min-target-size)-100%)/-2)] ds:before:inset-y-[calc((var(--min-target-size)-100%)/-2)] ds:before:content-[""] ds:sm:before:hidden'
+        ].join(" "),
+        md: [
+          "ds:h-10 ds:ps-4 ds:pe-4 ds:text-[length:var(--font-size-base)] ds:[&_svg]:size-5",
+          "ds:min-h-[var(--min-target-size)] ds:sm:min-h-0",
+          'ds:before:absolute ds:before:inset-x-[calc((var(--min-target-size)-100%)/-2)] ds:before:inset-y-[calc((var(--min-target-size)-100%)/-2)] ds:before:content-[""] ds:sm:before:hidden'
+        ].join(" "),
+        lg: "ds:h-12 ds:ps-5 ds:pe-5 ds:text-[length:var(--font-size-lg)] ds:[&_svg]:size-6"
+      }
+    },
+    compoundVariants: [
+      /* Apple — light: white surface, black logo + text. */
+      {
+        provider: "apple",
+        appearance: "light",
+        class: "ds:bg-[var(--brand-apple-light)] ds:text-[var(--brand-apple-light-foreground)] ds:border-[var(--brand-apple-light-border)] ds:hover:bg-[var(--brand-apple-light-hover)]"
+      },
+      /* Apple — dark: black surface, white logo + text. */
+      {
+        provider: "apple",
+        appearance: "dark",
+        class: "ds:bg-[var(--brand-apple-dark)] ds:text-[var(--brand-apple-dark-foreground)] ds:border-[var(--brand-apple-dark)] ds:hover:bg-[var(--brand-apple-dark-hover)]"
+      },
+      /* Google — light: white/neutral surface, grey text. */
+      {
+        provider: "google",
+        appearance: "light",
+        class: "ds:bg-[var(--brand-google-light)] ds:text-[var(--brand-google-light-foreground)] ds:border-[var(--brand-google-light-border)] ds:hover:bg-[var(--brand-google-light-hover)]"
+      },
+      /* Google — dark: Google-blue surface, white text. */
+      {
+        provider: "google",
+        appearance: "dark",
+        class: "ds:bg-[var(--brand-google-dark)] ds:text-[var(--brand-google-dark-foreground)] ds:border-[var(--brand-google-dark)] ds:hover:bg-[var(--brand-google-dark-hover)]"
+      }
+    ],
+    defaultVariants: {
+      appearance: "light",
+      size: "md"
+    }
+  }
+), _ = {
+  sm: "md",
+  md: "lg",
+  lg: "lg"
+}, C = n(
+  "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0",
+  {
+    variants: {
+      size: {
+        sm: "ds:size-4",
+        md: "ds:size-5",
+        lg: "ds:size-6"
+      }
+    },
+    defaultVariants: { size: "md" }
+  }
+), E = n(
+  "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0",
+  {
+    variants: {
+      appearance: {
+        light: "",
+        dark: "ds:rounded-[var(--radius-sm)] ds:bg-[var(--brand-google-tile)]"
+      },
+      size: {
+        sm: "ds:[&_svg]:size-4",
+        md: "ds:[&_svg]:size-5",
+        lg: "ds:[&_svg]:size-6"
+      }
+    },
+    compoundVariants: [
+      { appearance: "dark", size: "sm", class: "ds:p-1" },
+      { appearance: "dark", size: "md", class: "ds:p-1.5" },
+      { appearance: "dark", size: "lg", class: "ds:p-2" }
+    ],
+    defaultVariants: { appearance: "light", size: "md" }
+  }
+), I = y(
+  ({
+    provider: e,
+    appearance: r = "light",
+    size: d = "md",
+    loading: a = !1,
+    disabled: u,
+    label: b,
+    onLoadingCancelled: i,
+    type: f = "button",
+    className: h,
+    ...z
+  }, k) => {
+    const { t } = j(), l = d ?? "md", w = b ?? t(`socialSignInButton.${e}`), c = p(a), o = p(i);
+    c.current = a, o.current = i, N(() => {
+      const g = (B) => {
+        B.persisted && c.current && o.current && o.current();
+      };
+      return window.addEventListener("pageshow", g), () => window.removeEventListener("pageshow", g);
+    }, []);
+    const x = [
+      M({ provider: e, appearance: r, size: d }),
+      h
+    ].filter(Boolean).join(" "), S = e === "apple" ? /* @__PURE__ */ s(A, { className: "ds:shrink-0" }) : r === "dark" ? /* @__PURE__ */ s("span", { className: E({ appearance: r, size: d }), children: /* @__PURE__ */ s(v, {}) }) : /* @__PURE__ */ s(v, { className: "ds:shrink-0" });
+    return /* @__PURE__ */ m(
+      "button",
+      {
+        ref: k,
+        type: f,
+        disabled: u || a,
+        "aria-busy": a || void 0,
+        "data-component": "social-sign-in-button",
+        "data-provider": e,
+        "data-appearance": r,
+        className: x,
+        ...z,
+        children: [
+          a ? /* @__PURE__ */ s("span", { className: C({ size: l }), children: /* @__PURE__ */ s(
+            V,
+            {
+              size: _[l],
+              variant: "pulse",
+              className: "ds:size-full",
+              label: t("socialSignInButton.loading")
+            }
+          ) }) : S,
+          /* @__PURE__ */ s("span", { children: w })
+        ]
+      }
+    );
+  }
+);
+I.displayName = "SocialSignInButton";
+export {
+  I as S
+};
+//# sourceMappingURL=social-sign-in-button-X54ySJr1.js.map

package/dist/_chunks/social-sign-in-button-X54ySJr1.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"social-sign-in-button-X54ySJr1.js","sources":["../../src/brand/provider-marks/apple.tsx","../../src/brand/provider-marks/google.tsx","../../src/components/social-sign-in-button/social-sign-in-button.tsx"],"sourcesContent":["/* -------------------------------------------------------------------- */\n/* Apple brand mark — \"Sign in with Apple\". */\n/* */\n/* Lives under src/brand/** (the sanctioned hex-literal exception zone */\n/* per CLAUDE.md §2) alongside the Google mark, even though this glyph */\n/* is single-colour and follows `currentColor`. Keeping both provider */\n/* marks in one folder gives token-auditor a single brand path to reason */\n/* about and matches the WhatsAppButton inline-glyph precedent. */\n/* */\n/* Per Apple Human Interface Guidelines the Apple logo is a single-colour */\n/* mark that inherits the button's text colour: black on a white (light) */\n/* surface, white on a black (dark) surface. We paint it with */\n/* `fill=\"currentColor\"` so the consuming button's foreground token */\n/* drives the colour from one CVA class — never recolour the Apple logo */\n/* to a brand hue (HIG forbids it). The mark is decorative: the visible */\n/* localized \"Sign in with Apple\" text is the accessible name, so the */\n/* SVG carries `aria-hidden=\"true\"` and the button announces only its */\n/* text label. */\n/* -------------------------------------------------------------------- */\n\nimport type { ReactNode } from 'react';\n\nexport interface ProviderMarkProps {\n /** Forwarded to the root `<svg>` for size / colour utility classes. */\n className?: string;\n}\n\n/**\n * The Apple logo glyph. Single path, `currentColor` fill so it follows\n * the button foreground across light / dark appearances and all four kit\n * themes. Decorative — `aria-hidden`.\n */\nexport function AppleMark({ className }: ProviderMarkProps): ReactNode {\n return (\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 24 24\"\n fill=\"currentColor\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n >\n <path d=\"M17.05 12.536c-.024-2.51 2.05-3.715 2.143-3.774-1.168-1.708-2.985-1.942-3.63-1.967-1.546-.157-3.018.91-3.802.91-.783 0-1.99-.888-3.273-.864-1.684.025-3.236.978-4.102 2.485-1.748 3.03-.448 7.513 1.255 9.97.832 1.203 1.825 2.552 3.127 2.504 1.255-.05 1.73-.81 3.247-.81 1.518 0 1.945.81 3.273.786 1.351-.025 2.206-1.227 3.03-2.434.955-1.394 1.348-2.745 1.372-2.815-.03-.013-2.633-1.01-2.66-4.001m-2.48-7.343c.692-.838 1.158-2.002 1.03-3.163-.997.04-2.205.664-2.92 1.502-.64.742-1.2 1.927-1.05 3.066 1.112.086 2.247-.566 2.94-1.405\" />\n </svg>\n );\n}\n","/* -------------------------------------------------------------------- */\n/* Google brand mark — \"Sign in with Google\". */\n/* */\n/* Lives under src/brand/** — the ONLY zone where hex-colour literals are */\n/* permitted (CLAUDE.md §2). The Google \"G\" is a FIXED four-colour mark */\n/* that Google Identity Services brand guidelines forbid recolouring: */\n/* blue #4285F4 */\n/* red #EA4335 */\n/* yellow #FBBC05 */\n/* green #34A853 */\n/* These literals are therefore mandatory and intentional — they MUST NOT */\n/* be swapped for tokens or `currentColor`, and they MUST NOT shift across */\n/* the four kit themes or between light/dark button appearances. The mark */\n/* is rendered on a white tile (see SocialSignInButton) on coloured */\n/* surfaces, per GIS guidance, so the colours always read. */\n/* */\n/* The mark is decorative: the visible localized \"Sign in with Google\" */\n/* text is the accessible name, so the SVG carries `aria-hidden=\"true\"` */\n/* and screen readers never announce the individual colour paths. */\n/* -------------------------------------------------------------------- */\n\nimport type { ReactNode } from 'react';\n\nexport interface ProviderMarkProps {\n /** Forwarded to the root `<svg>` for size utility classes. */\n className?: string;\n}\n\n/**\n * The Google \"G\" glyph — the canonical Google Identity Services asset.\n * Four hardcoded brand hues (blue / red / yellow / green) that brand\n * guidelines forbid altering; this is why the file lives under\n * src/brand/** and not src/components/**. Decorative — `aria-hidden`.\n */\nexport function GoogleMark({ className }: ProviderMarkProps): ReactNode {\n return (\n <svg\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n >\n {/* Brand-mandated fixed colours — do NOT tokenise (GIS guidelines). */}\n <path\n fill=\"#4285F4\"\n d=\"M23.52 12.273c0-.851-.076-1.67-.218-2.455H12v4.642h6.458a5.52 5.52 0 0 1-2.394 3.622v3.01h3.878c2.269-2.09 3.578-5.166 3.578-8.819z\"\n />\n <path\n fill=\"#34A853\"\n d=\"M12 24c3.24 0 5.956-1.075 7.942-2.908l-3.878-3.01c-1.075.72-2.45 1.146-4.064 1.146-3.125 0-5.77-2.11-6.714-4.946H1.276v3.106A11.995 11.995 0 0 0 12 24z\"\n />\n <path\n fill=\"#FBBC05\"\n d=\"M5.286 14.282A7.213 7.213 0 0 1 4.91 12c0-.792.136-1.562.376-2.282V6.612H1.276A11.995 11.995 0 0 0 0 12c0 1.936.464 3.768 1.276 5.388l4.01-3.106z\"\n />\n <path\n fill=\"#EA4335\"\n d=\"M12 4.773c1.762 0 3.344.605 4.589 1.794l3.442-3.442C17.951 1.19 15.235 0 12 0A11.995 11.995 0 0 0 1.276 6.612l4.01 3.106C6.23 6.882 8.875 4.773 12 4.773z\"\n />\n </svg>\n );\n}\n","/* -------------------------------------------------------------------- */\n/* SocialSignInButton — brand-compliant provider sign-in (Apple, Google). */\n/* */\n/* Rendered as a REAL native <button> (forwardRef<HTMLButtonElement>) — */\n/* shown as secondary passwordless options beneath the primary email-OTP */\n/* in patient check-in (HTP-5104). One component, a CVA `provider` axis */\n/* (apple | google, designed to grow), each carrying its official inline */\n/* brand mark and brand surface: */\n/* */\n/* - Apple HIG: light = white button + black logo/text; */\n/* dark = black button + white logo/text. The Apple mark */\n/* follows `currentColor`. */\n/* - Google Identity Services: light = white/neutral button + grey */\n/* text; dark = Google-blue button + white text. The fixed */\n/* 4-colour \"G\" never recolours and sits on a white tile on */\n/* the dark (coloured) surface per GIS guidance. */\n/* */\n/* This mirrors WhatsAppButton's brand-token EXCEPTION pattern: */\n/* `--brand-apple-*` / `--brand-google-*` tokens live in */\n/* src/tokens/index.css across all four themes, and the brand marks ship */\n/* as inline SVGs under src/brand/provider-marks/ (the sanctioned hex */\n/* zone for Google's mandated colours). It also mirrors */\n/* SignInWithAlfadocsButton's provider-button shape: i18n default label, */\n/* Spinner-on-loading, aria-busy, and the bfcache `pageshow` listener that */\n/* fires `onLoadingCancelled` when the user returns from the IDP via the */\n/* browser back button. */\n/* */\n/* Presentation only: it renders the brand-correct trigger and exposes */\n/* onClick — the consuming auth pattern wires the actual OAuth/OIDC */\n/* redirect. `asChild` is intentionally NOT supported (brand guidelines */\n/* require a real button and forbid wrapping the mark in arbitrary link */\n/* chrome). `type` defaults to 'button' so it never implicitly submits an */\n/* ambient form. */\n/* -------------------------------------------------------------------- */\n\nimport {\n forwardRef,\n useEffect,\n useRef,\n type ButtonHTMLAttributes,\n type ReactNode,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\nimport { Spinner } from '../spinner';\nimport { AppleMark } from '../../brand/provider-marks/apple';\nimport { GoogleMark } from '../../brand/provider-marks/google';\n\n/* ------------------------------------------------------------------ */\n/* CVA */\n/* ------------------------------------------------------------------ */\n\nconst rootVariants = cva(\n [\n 'ds:relative ds:inline-flex ds:items-center ds:justify-center',\n 'ds:font-medium ds:whitespace-nowrap',\n 'ds:rounded-[var(--radius-md)]',\n 'ds:gap-[var(--spacing-sm)]',\n 'ds:border ds:border-solid',\n 'ds:active:opacity-90',\n 'ds:transition-[background-color,box-shadow,opacity]',\n 'ds:duration-[var(--animation-duration)]',\n // Focus ring is `var(--ring)` (the kit primary), NEVER the brand\n // surface colour — painting the ring in the brand hue on a brand\n // surface makes it invisible. Same rule WhatsAppButton codifies.\n 'ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid',\n 'ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]',\n // Windows High Contrast Mode strips brand fills — repaint a solid\n // border edge + swap the focus ring to CanvasText so the affordance\n // stays identifiable.\n 'ds:forced-colors:border-[ButtonBorder]',\n 'ds:forced-colors:focus-visible:outline-[CanvasText]',\n 'ds:disabled:opacity-50 ds:disabled:cursor-not-allowed',\n 'ds:aria-busy:cursor-wait',\n 'ds:motion-reduce:transition-none',\n ].join(' '),\n {\n variants: {\n provider: {\n apple: '',\n google: '',\n },\n appearance: {\n light: '',\n dark: '',\n },\n size: {\n // Heights mirror Button (sm 32 / md 40 / lg 48). `sm` (32px) and\n // `md` (40px) both fall below `--min-target-size` (44 base / 48\n // accessible), so each adds the ::before pseudo-element touch-\n // target expansion to reach the minimum on mobile, collapsing\n // above the `sm:` breakpoint. This component is the patient\n // check-in (HTP-5104) mobile sign-in surface and `md` is the\n // DEFAULT size rendered there, so it MUST meet WCAG 2.5.5 at both\n // theme levels — unlike Button/WhatsApp, we do not leave md short.\n // `lg` (48px) already meets the minimum natively.\n sm: [\n 'ds:h-8 ds:ps-3 ds:pe-3 ds:text-[length:var(--font-size-sm)] ds:[&_svg]:size-4',\n 'ds:min-h-[var(--min-target-size)] ds:sm:min-h-0',\n 'ds:before:absolute ds:before:inset-x-[calc((var(--min-target-size)-100%)/-2)] ds:before:inset-y-[calc((var(--min-target-size)-100%)/-2)] ds:before:content-[\"\"] ds:sm:before:hidden',\n ].join(' '),\n md: [\n 'ds:h-10 ds:ps-4 ds:pe-4 ds:text-[length:var(--font-size-base)] ds:[&_svg]:size-5',\n 'ds:min-h-[var(--min-target-size)] ds:sm:min-h-0',\n 'ds:before:absolute ds:before:inset-x-[calc((var(--min-target-size)-100%)/-2)] ds:before:inset-y-[calc((var(--min-target-size)-100%)/-2)] ds:before:content-[\"\"] ds:sm:before:hidden',\n ].join(' '),\n lg: 'ds:h-12 ds:ps-5 ds:pe-5 ds:text-[length:var(--font-size-lg)] ds:[&_svg]:size-6',\n },\n },\n compoundVariants: [\n /* Apple — light: white surface, black logo + text. */\n {\n provider: 'apple',\n appearance: 'light',\n class:\n 'ds:bg-[var(--brand-apple-light)] ds:text-[var(--brand-apple-light-foreground)] ds:border-[var(--brand-apple-light-border)] ds:hover:bg-[var(--brand-apple-light-hover)]',\n },\n /* Apple — dark: black surface, white logo + text. */\n {\n provider: 'apple',\n appearance: 'dark',\n class:\n 'ds:bg-[var(--brand-apple-dark)] ds:text-[var(--brand-apple-dark-foreground)] ds:border-[var(--brand-apple-dark)] ds:hover:bg-[var(--brand-apple-dark-hover)]',\n },\n /* Google — light: white/neutral surface, grey text. */\n {\n provider: 'google',\n appearance: 'light',\n class:\n 'ds:bg-[var(--brand-google-light)] ds:text-[var(--brand-google-light-foreground)] ds:border-[var(--brand-google-light-border)] ds:hover:bg-[var(--brand-google-light-hover)]',\n },\n /* Google — dark: Google-blue surface, white text. */\n {\n provider: 'google',\n appearance: 'dark',\n class:\n 'ds:bg-[var(--brand-google-dark)] ds:text-[var(--brand-google-dark-foreground)] ds:border-[var(--brand-google-dark)] ds:hover:bg-[var(--brand-google-dark-hover)]',\n },\n ],\n defaultVariants: {\n appearance: 'light',\n size: 'md',\n },\n },\n);\n\n/* The loading Spinner stands in for the brand mark, so it must occupy the\n SAME footprint (the button's `[&_svg]:size-4/5/6` = 16/20/24px). The\n Spinner's own size ramp is one step smaller (sm/md/lg = 12/16/20px), so\n we bump it one step and wrap it in a size-matched box; without this the\n spinner is ~4px smaller than the glyph it replaces and the button jumps\n on load. `lg` button → `lg` spinner (20px) inside a 24px box that the\n button's `[&_svg]:size-6` then drives via the inner svg. */\nconst SPINNER_SIZE: Record<\n NonNullable<VariantProps<typeof rootVariants>['size']>,\n 'sm' | 'md' | 'lg'\n> = {\n sm: 'md',\n md: 'lg',\n lg: 'lg',\n};\n\nconst spinnerBoxVariants = cva(\n 'ds:inline-flex ds:items-center ds:justify-center ds:shrink-0',\n {\n variants: {\n size: {\n sm: 'ds:size-4',\n md: 'ds:size-5',\n lg: 'ds:size-6',\n },\n },\n defaultVariants: { size: 'md' },\n },\n);\n\n/* The Google mark on a coloured (dark) surface sits inside a white tile\n per Google Identity Services guidance, so the 4-colour G always reads.\n On the light/neutral surface it sits directly on the button. The tile\n is a presentational chrome detail (not the mandated mark), so it uses\n tokens. */\nconst googleTileVariants = cva(\n 'ds:inline-flex ds:items-center ds:justify-center ds:shrink-0',\n {\n variants: {\n appearance: {\n light: '',\n dark: 'ds:rounded-[var(--radius-sm)] ds:bg-[var(--brand-google-tile)]',\n },\n size: {\n sm: 'ds:[&_svg]:size-4',\n md: 'ds:[&_svg]:size-5',\n lg: 'ds:[&_svg]:size-6',\n },\n },\n compoundVariants: [\n { appearance: 'dark', size: 'sm', class: 'ds:p-1' },\n { appearance: 'dark', size: 'md', class: 'ds:p-1.5' },\n { appearance: 'dark', size: 'lg', class: 'ds:p-2' },\n ],\n defaultVariants: { appearance: 'light', size: 'md' },\n },\n);\n\n/* ------------------------------------------------------------------ */\n/* Props */\n/* ------------------------------------------------------------------ */\n\nexport type SocialSignInProvider = 'apple' | 'google';\n\n/**\n * Brand surface variant — independent of the kit theme. Apple HIG:\n * `light` = white button + black mark/text, `dark` = black button +\n * white mark/text. Google: `light` = white/neutral button, `dark` =\n * Google-blue button. Pick the appearance that contrasts with your\n * auth-card background; do NOT bind it to `useTheme()`. Defaults to\n * `'light'`. Derived from `rootVariants` so the prop union tracks the\n * CVA option list automatically.\n */\nexport type SocialSignInAppearance = NonNullable<\n VariantProps<typeof rootVariants>['appearance']\n>;\n\n/** Button size. Defaults to `'md'`. Derived from `rootVariants`. */\nexport type SocialSignInSize = NonNullable<\n VariantProps<typeof rootVariants>['size']\n>;\n\nexport interface SocialSignInButtonProps\n extends\n Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'>,\n Omit<VariantProps<typeof rootVariants>, 'provider'> {\n /**\n * Which identity provider this button represents. Drives the brand\n * mark, the surface colour token, and the default i18n verb + name.\n * Designed extensible — the union and the CVA option list grow\n * together when a new provider (e.g. `'microsoft'`) is added.\n */\n provider: SocialSignInProvider;\n /**\n * Swaps the brand mark for the kit Spinner (size-matched), sets\n * `aria-busy='true'`, and disables the button so the user cannot\n * double-submit the OAuth redirect. The label stays visible.\n */\n loading?: boolean;\n /**\n * Override the visible label. When omitted, reads\n * `socialSignInButton.<provider>` (\"Sign in with Apple\" / \"Sign in\n * with Google\"). Override only to switch the verb to \"Continue with\"\n * — never for marketing copy, and the provider NAME (\"Apple\" /\n * \"Google\") must stay verbatim per brand rules.\n */\n label?: ReactNode;\n /**\n * Fired when the component detects the user cancelled an in-flight\n * sign-in — typically by pressing browser back after the OAuth\n * redirect, which restores the page from bfcache with `loading` still\n * true. Wire this to your loading-state setter so the button returns\n * to idle. Only fires when `loading` is currently true; never on first\n * mount. Mirrors SignInWithAlfadocsButton — the component does not\n * reset state it doesn't own.\n */\n onLoadingCancelled?: () => void;\n}\n\n/* ------------------------------------------------------------------ */\n/* SocialSignInButton */\n/* ------------------------------------------------------------------ */\n\nexport const SocialSignInButton = forwardRef<\n HTMLButtonElement,\n SocialSignInButtonProps\n>(\n (\n {\n provider,\n appearance = 'light',\n size = 'md',\n loading = false,\n disabled,\n label,\n onLoadingCancelled,\n type = 'button',\n className,\n ...props\n },\n ref,\n ) => {\n const { t } = useTranslation();\n // VariantProps types size/appearance as nullable; the destructure\n // default only narrows `undefined`. Normalise to a non-null value\n // before indexing the spinner-size map and box variant.\n const resolvedSize: SocialSignInSize = size ?? 'md';\n // Default label resolves from the provider key. The provider NAME is\n // a brand constant carried verbatim by the translation value.\n const resolvedLabel = label ?? t(`socialSignInButton.${provider}`);\n\n // Stash latest values in refs so the `pageshow` listener reads them\n // without re-binding on every render. One listener for the lifetime.\n const loadingRef = useRef(loading);\n const onCancelRef = useRef(onLoadingCancelled);\n loadingRef.current = loading;\n onCancelRef.current = onLoadingCancelled;\n\n useEffect(() => {\n const onPageShow = (event: PageTransitionEvent) => {\n // `event.persisted` is true when the page was restored from the\n // back/forward cache — the canonical \"user navigated away and\n // came back without a fresh load\" signal. If the button still\n // thinks it's loading, an OAuth redirect was started but never\n // completed.\n if (event.persisted && loadingRef.current && onCancelRef.current) {\n onCancelRef.current();\n }\n };\n window.addEventListener('pageshow', onPageShow);\n return () => window.removeEventListener('pageshow', onPageShow);\n }, []);\n\n const composedClassName = [\n rootVariants({ provider, appearance, size }),\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n // The mark sits at the inline-start; it does NOT mirror in RTL\n // (a logo is not a directional glyph). Logical `gap`/`ps`/`pe` keep\n // the layout direction-correct without flipping the mark itself.\n const mark =\n provider === 'apple' ? (\n <AppleMark className=\"ds:shrink-0\" />\n ) : appearance === 'dark' ? (\n <span className={googleTileVariants({ appearance, size })}>\n <GoogleMark />\n </span>\n ) : (\n <GoogleMark className=\"ds:shrink-0\" />\n );\n\n return (\n <button\n ref={ref}\n type={type}\n disabled={disabled || loading}\n aria-busy={loading || undefined}\n data-component=\"social-sign-in-button\"\n data-provider={provider}\n data-appearance={appearance}\n className={composedClassName}\n {...props}\n >\n {loading ? (\n <span className={spinnerBoxVariants({ size: resolvedSize })}>\n <Spinner\n size={SPINNER_SIZE[resolvedSize]}\n variant=\"pulse\"\n className=\"ds:size-full\"\n label={t('socialSignInButton.loading')}\n />\n </span>\n ) : (\n mark\n )}\n <span>{resolvedLabel}</span>\n </button>\n );\n },\n);\n\nSocialSignInButton.displayName = 'SocialSignInButton';\n"],"names":["AppleMark","className","jsx","GoogleMark","jsxs","rootVariants","cva","SPINNER_SIZE","spinnerBoxVariants","googleTileVariants","SocialSignInButton","forwardRef","provider","appearance","size","loading","disabled","label","onLoadingCancelled","type","props","ref","useTranslation","resolvedSize","resolvedLabel","loadingRef","useRef","onCancelRef","useEffect","onPageShow","event","composedClassName","mark","Spinner"],"mappings":"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"}