51:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 52:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 53:T1094,// Ballmac UI: Currency Input. https://ui.ballmac.com/components/currency-input "use client" import * as React from "react" import { cn } from "@/lib/utils" import { useLocale } from "@/lib/ballmac/i18n" type CurrencyInputProps = Omit< React.ComponentProps<"input">, "value" | "defaultValue" | "onChange" | "type" > & { /** Visible and accessible input label. */ label: string /** ISO 4217 currency code. */ currency?: string /** Fixed locale for formatting and parsing. */ locale?: string /** Controlled numeric amount, or null when empty. */ value?: number | null /** Initial numeric amount. */ defaultValue?: number | null /** Called with the parsed numeric amount while editing. */ onValueChange?: (value: number | null) => void /** Smallest allowed amount. */ min?: number /** Largest allowed amount. */ max?: number } function CurrencyInput({ className, label, currency = "USD", locale, value, defaultValue = null, onValueChange, min, max, onFocus, onBlur, ...props }: CurrencyInputProps) { const defaultLocale = useLocale() locale ??= defaultLocale const [internal, setInternal] = React.useState(defaultValue) const [editing, setEditing] = React.useState(false) const [draft, setDraft] = React.useState("") const current = value === undefined ? internal : value const formatter = new Intl.NumberFormat(locale, { style: "currency", currency, }) const decimal = formatter.formatToParts(1.1).find((part) => part.type === "decimal") ?.value ?? "." const group = formatter.formatToParts(1000).find((part) => part.type === "group") ?.value ?? "," const digits = formatter.resolvedOptions().maximumFractionDigits const shown = editing ? draft : current === null ? "" : formatter.format(current) function report(next: number | null) { if (value === undefined) setInternal(next) onValueChange?.(next) } function parse(raw: string) { const compact = raw .replaceAll(group, "") .replaceAll(decimal, ".") .replace(/[^\d.\-]/g, "") if (!compact || compact === "-" || compact === "." || compact === "-.") return null const parsed = Number(compact) return Number.isFinite(parsed) ? parsed : null } return ( {label} { setEditing(true) setDraft( current === null ? "" : String(current).replace(".", decimal), ) onFocus?.(event) }} onChange={(event) => { const raw = event.target.value setDraft(raw) if (raw.trim() === "") report(null) else { const parsed = parse(raw) if (parsed !== null) report(parsed) } }} onBlur={(event) => { setEditing(false) const parsed = parse(draft) if (parsed !== null) { const bounded = Math.min( max ?? Infinity, Math.max(min ?? -Infinity, parsed), ) const rounded = Number(bounded.toFixed(digits)) if (rounded !== current) report(rounded) } onBlur?.(event) }} className={cn( "border-input bg-background text-foreground h-9 w-full min-w-0 rounded-md border px-3 pe-14 text-sm tabular-nums outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20", className, )} /> ) } export { CurrencyInput, type CurrencyInputProps } 50:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L51",null,{"namespace":"@ballmac","registryDependencies":["utils","https://ui.ballmac.com/r/i18n.json"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"registry/ballmac/components/currency-input.tsx","content":"$53","type":"registry:ui","target":"@components/ballmac/currency-input.tsx"}],"className":"h-[70svh] min-h-80"}]]}]