tempest-react-sdk 0.77.0 → 0.79.0

package/dist/components/AudioRecorder/AudioRecorder.js

@@ -47,22 +47,21 @@ function b({ onRecorded: b, maxDurationMs: x, deviceId: S, format: C = "native",
 	let N = y[D], P = t("microphone"), F = o({ deviceId: S }), [I, L] = u(!1), [R, z] = u(null), [B, V] = u(!0);
 	l(() => V(i()), []);
 	let H = async (e) => {
-		if (C !== "wav") {
-			z(e), b?.(e);
-			return;
-		}
-		L(!0);
-		try {
-			let t = await s(e.blob, w), n = {
-				...e,
-				blob: t,
-				mimeType: "audio/wav"
-			};
-			z(n), b?.(n);
-		} catch (t) {
-			k?.(t), z(e), b?.(e);
-		} finally {
-			L(!1);
+		if (C !== "wav") z(e), b?.(e);
+		else {
+			L(!0);
+			try {
+				let t = await s(e.blob, w), n = {
+					...e,
+					blob: t,
+					mimeType: "audio/wav"
+				};
+				z(n), b?.(n);
+			} catch (t) {
+				k?.(t), z(e), b?.(e);
+			} finally {
+				L(!1);
+			}
 		}
 	}, U = a(F.stream, {
 		maxDurationMs: x,
@@ -79,11 +78,7 @@ function b({ onRecorded: b, maxDurationMs: x, deviceId: S, format: C = "native",
 		U
 	]);
 	let K = () => {
-		if (z(null), F.stream && U.ready) {
-			U.start();
-			return;
-		}
-		G(!0), F.start();
+		z(null), F.stream && U.ready ? U.start() : (G(!0), F.start());
 	}, q = () => {
 		z(null), U.cancel(), K();
 	}, J = U.status === "recording" || U.status === "paused", Y = P.state === "denied";

package/dist/components/AudioRecorder/AudioRecorder.js.map

@@ -1 +1 @@
-{"version":3,"file":"AudioRecorder.js","names":[],"sources":["../../../src/components/AudioRecorder/AudioRecorder.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — recording has three\n * separate configurations that a caller genuinely picks between: the capture\n * (deviceId, audioBitsPerSecond, maxDurationMs), the output (format, wavOptions) and\n * the review step (review, footer, locale). The body holds permission, recording,\n * review and error as one state machine; splitting it would thread the same recorder\n * handle through props.\n */\nimport { Mic, Pause, Play, RotateCcw, Square } from \"lucide-react\";\nimport { useEffect, useState, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { formatDuration } from \"@/audio/duration\";\nimport { isAudioRecordingSupported } from \"@/audio/audio-recorder\";\nimport { useAudioRecorder } from \"@/audio/use-audio-recorder\";\nimport { useMicrophone } from \"@/audio/use-microphone\";\nimport { blobToWav, type WavOptions } from \"@/audio/wav\";\nimport type { AudioRecording } from \"@/audio/audio-recorder\";\nimport { useMediaPermission } from \"@/hooks/use-media-permission\";\nimport { cn } from \"@/utils/cn\";\n\nimport { AudioPlayer } from \"../AudioPlayer\";\nimport styles from \"./AudioRecorder.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onError\";\n\nexport interface AudioRecorderProps extends Omit<\n    HTMLAttributes<HTMLDivElement>,\n    OverriddenDomProps\n> {\n    /**\n     * Called once a recording is finished and (when asked) converted.\n     *\n     * Fires on stop and on hitting `maxDurationMs`, never on cancel.\n     */\n    onRecorded?: (recording: AudioRecording) => void;\n    /** Stop automatically after this long. Strongly recommended on anything public. */\n    maxDurationMs?: number;\n    /** Specific microphone, from `useMediaDevices().audioInputs`. */\n    deviceId?: string;\n    /**\n     * Output container.\n     *\n     * `\"native\"` (default) keeps what the browser produced — Opus on Chromium and\n     * Firefox, AAC on Safari — which is the smallest and needs no work. `\"wav\"`\n     * converts on stop, for a backend that only accepts WAV; see `wavOptions`, and\n     * expect roughly ten times the bytes.\n     */\n    format?: \"native\" | \"wav\";\n    /** Passed to `blobToWav` when `format=\"wav\"`. `{ mono: true, sampleRate: 16000 }` suits speech. */\n    wavOptions?: WavOptions;\n    /** Target bitrate. 32000–64000 is plenty for speech in Opus. */\n    audioBitsPerSecond?: number;\n    /** Offer playback of the recording before handing it over. Default `true`. */\n    review?: boolean;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Rendered under the controls — a hint, a character count, a legal notice. */\n    footer?: ReactNode;\n    /** Recorder-level failure, or a failed WAV conversion. */\n    onError?: (error: unknown) => void;\n    disabled?: boolean;\n}\n\nconst STRINGS = {\n    \"pt-BR\": {\n        record: \"Gravar\",\n        stop: \"Parar\",\n        pause: \"Pausar\",\n        resume: \"Continuar\",\n        retake: \"Gravar de novo\",\n        level: \"Nível do microfone\",\n        asking: \"Pedindo acesso ao microfone…\",\n        denied: \"Acesso ao microfone bloqueado. Libere nas configurações do site e recarregue.\",\n        unsupported: \"Este navegador não grava áudio.\",\n        idleHint: \"Toque em Gravar para começar.\",\n        recording: \"Gravando\",\n        paused: \"Pausado\",\n        converting: \"Convertendo…\",\n    },\n    en: {\n        record: \"Record\",\n        stop: \"Stop\",\n        pause: \"Pause\",\n        resume: \"Resume\",\n        retake: \"Record again\",\n        level: \"Microphone level\",\n        asking: \"Requesting microphone access…\",\n        denied: \"Microphone access blocked. Allow it in site settings and reload.\",\n        unsupported: \"This browser cannot record audio.\",\n        idleHint: \"Press Record to start.\",\n        recording: \"Recording\",\n        paused: \"Paused\",\n        converting: \"Converting…\",\n    },\n} as const;\n\n/**\n * Record a voice note: one button to start, a live level meter, a clock, and a\n * playback review before the audio leaves the component.\n *\n * The permission flow is the part worth reading. The microphone is **not** opened on\n * mount — the prompt fires on the first press of Record, because a prompt the user did\n * not provoke is the most reliable way to earn a permanent block, after which\n * `getUserMedia` rejects without ever asking again. When the permission is already\n * `\"denied\"`, the component says so and how to fix it instead of offering a button\n * that cannot work.\n *\n * The level meter is not decoration either: a muted OS input or a headset with its mic\n * arm folded up produces a perfectly successful recording of silence, and without a\n * visible level the user only finds out after they finish talking.\n *\n * @example\n * <AudioRecorder\n *     maxDurationMs={120_000}\n *     format=\"wav\"\n *     wavOptions={{ mono: true, sampleRate: 16000 }}\n *     onRecorded={({ blob }) => upload(blob)}\n * />\n */\nexport function AudioRecorder({\n    onRecorded,\n    maxDurationMs,\n    deviceId,\n    format = \"native\",\n    wavOptions,\n    audioBitsPerSecond,\n    review = true,\n    locale = \"pt-BR\",\n    footer,\n    onError,\n    disabled = false,\n    className,\n    ...rest\n}: AudioRecorderProps) {\n    const strings = STRINGS[locale];\n    const permission = useMediaPermission(\"microphone\");\n    const mic = useMicrophone({ deviceId });\n    const [converting, setConverting] = useState(false);\n    const [result, setResult] = useState<AudioRecording | null>(null);\n    const [supported, setSupported] = useState(true);\n\n    useEffect(() => setSupported(isAudioRecordingSupported()), []);\n\n    /**\n     * Convert if asked, then publish.\n     *\n     * The conversion is awaited here rather than left to the caller so that\n     * `onRecorded` only ever fires with the format the caller asked for — a callback\n     * that sometimes hands over WebM and sometimes WAV is a bug waiting in the upload\n     * path.\n     */\n    const finish = async (recording: AudioRecording): Promise<void> => {\n        if (format !== \"wav\") {\n            setResult(recording);\n            onRecorded?.(recording);\n            return;\n        }\n        setConverting(true);\n        try {\n            const blob = await blobToWav(recording.blob, wavOptions);\n            const converted: AudioRecording = { ...recording, blob, mimeType: \"audio/wav\" };\n            setResult(converted);\n            onRecorded?.(converted);\n        } catch (error) {\n            onError?.(error);\n            setResult(recording);\n            onRecorded?.(recording);\n        } finally {\n            setConverting(false);\n        }\n    };\n\n    const recorder = useAudioRecorder(mic.stream, {\n        maxDurationMs,\n        audioBitsPerSecond,\n        onRecorded: (recording) => void finish(recording),\n        onError,\n    });\n\n    /**\n     * Start recording as soon as the stream lands.\n     *\n     * The user pressed Record before the permission prompt existed, so the press has\n     * to survive the round-trip: `mic.start()` opens the device, the stream arrives a\n     * few hundred milliseconds later, and recording begins then. Waiting for a second\n     * press would make the first one look broken.\n     */\n    const [armed, setArmed] = useState(false);\n    useEffect(() => {\n        if (!armed || !recorder.ready || recorder.status !== \"idle\") return;\n        setArmed(false);\n        recorder.start();\n    }, [armed, recorder.ready, recorder.status, recorder]);\n\n    const begin = (): void => {\n        setResult(null);\n        if (mic.stream && recorder.ready) {\n            recorder.start();\n            return;\n        }\n        setArmed(true);\n        mic.start();\n    };\n\n    const retake = (): void => {\n        setResult(null);\n        recorder.cancel();\n        begin();\n    };\n\n    const busy = recorder.status === \"recording\" || recorder.status === \"paused\";\n    const blocked = permission.state === \"denied\";\n\n    if (!supported) {\n        return (\n            <div className={cn(styles.recorder, className)} {...rest}>\n                <p className={styles.notice}>{strings.unsupported}</p>\n            </div>\n        );\n    }\n\n    return (\n        <div className={cn(styles.recorder, className)} {...rest}>\n            <div className={styles.row}>\n                {!busy && (\n                    <button\n                        type=\"button\"\n                        className={styles.record}\n                        onClick={result ? retake : begin}\n                        disabled={disabled || blocked || converting}\n                        aria-label={result ? strings.retake : strings.record}\n                    >\n                        {result ? (\n                            <RotateCcw size={16} aria-hidden />\n                        ) : (\n                            <Mic size={16} aria-hidden />\n                        )}\n                        <span>{result ? strings.retake : strings.record}</span>\n                    </button>\n                )}\n\n                {busy && (\n                    <>\n                        <button\n                            type=\"button\"\n                            className={styles.stop}\n                            onClick={() => void recorder.stop()}\n                            aria-label={strings.stop}\n                        >\n                            <Square size={14} aria-hidden />\n                            <span>{strings.stop}</span>\n                        </button>\n                        <button\n                            type=\"button\"\n                            className={styles.secondary}\n                            onClick={\n                                recorder.status === \"paused\" ? recorder.resume : recorder.pause\n                            }\n                            aria-label={\n                                recorder.status === \"paused\" ? strings.resume : strings.pause\n                            }\n                        >\n                            {recorder.status === \"paused\" ? (\n                                <Play size={14} aria-hidden />\n                            ) : (\n                                <Pause size={14} aria-hidden />\n                            )}\n                        </button>\n                    </>\n                )}\n\n                {busy && (\n                    <div\n                        className={styles.meter}\n                        role=\"meter\"\n                        aria-label={strings.level}\n                        aria-valuemin={0}\n                        aria-valuemax={100}\n                        aria-valuenow={Math.round(recorder.level * 100)}\n                    >\n                        <span\n                            className={styles.meterFill}\n                            style={{ transform: `scaleX(${recorder.level})` }}\n                        />\n                    </div>\n                )}\n\n                <span className={styles.clock}>\n                    {formatDuration(busy ? recorder.durationMs : (result?.durationMs ?? 0))}\n                    {maxDurationMs !== undefined && (\n                        <span className={styles.max}> / {formatDuration(maxDurationMs)}</span>\n                    )}\n                </span>\n            </div>\n\n            <p className={styles.status} role=\"status\">\n                {converting\n                    ? strings.converting\n                    : mic.status === \"requesting\"\n                      ? strings.asking\n                      : blocked\n                        ? strings.denied\n                        : mic.error\n                          ? mic.error.message\n                          : recorder.status === \"recording\"\n                            ? strings.recording\n                            : recorder.status === \"paused\"\n                              ? strings.paused\n                              : result\n                                ? \"\"\n                                : strings.idleHint}\n            </p>\n\n            {review && result && (\n                <AudioPlayer\n                    src={result.blob}\n                    durationMs={result.durationMs}\n                    locale={locale}\n                    onError={onError}\n                />\n            )}\n\n            {footer && <div className={styles.footer}>{footer}</div>}\n        </div>\n    );\n}\n"],"mappings":";;;;;;;;;;;;;AAgEA,IAAM,IAAU;CACZ,SAAS;EACL,QAAQ;EACR,MAAM;EACN,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,aAAa;EACb,UAAU;EACV,WAAW;EACX,QAAQ;EACR,YAAY;CAChB;CACA,IAAI;EACA,QAAQ;EACR,MAAM;EACN,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,aAAa;EACb,UAAU;EACV,WAAW;EACX,QAAQ;EACR,YAAY;CAChB;AACJ;AAyBA,SAAgB,EAAc,EAC1B,eACA,kBACA,aACA,YAAS,UACT,eACA,uBACA,YAAS,IACT,YAAS,SACT,WACA,YACA,cAAW,IACX,cACA,GAAG,KACgB;CACnB,IAAM,IAAU,EAAQ,IAClB,IAAa,EAAmB,YAAY,GAC5C,IAAM,EAAc,EAAE,YAAS,CAAC,GAChC,CAAC,GAAY,KAAiB,EAAS,EAAK,GAC5C,CAAC,GAAQ,KAAa,EAAgC,IAAI,GAC1D,CAAC,GAAW,KAAgB,EAAS,EAAI;CAE/C,QAAgB,EAAa,EAA0B,CAAC,GAAG,CAAC,CAAC;CAU7D,IAAM,IAAS,OAAO,MAA6C;EAC/D,IAAI,MAAW,OAAO;GAElB,AADA,EAAU,CAAS,GACnB,IAAa,CAAS;GACtB;EACJ;EACA,EAAc,EAAI;EAClB,IAAI;GACA,IAAM,IAAO,MAAM,EAAU,EAAU,MAAM,CAAU,GACjD,IAA4B;IAAE,GAAG;IAAW;IAAM,UAAU;GAAY;GAE9E,AADA,EAAU,CAAS,GACnB,IAAa,CAAS;EAC1B,SAAS,GAAO;GAGZ,AAFA,IAAU,CAAK,GACf,EAAU,CAAS,GACnB,IAAa,CAAS;EAC1B,UAAU;GACN,EAAc,EAAK;EACvB;CACJ,GAEM,IAAW,EAAiB,EAAI,QAAQ;EAC1C;EACA;EACA,aAAa,MAAc,KAAK,EAAO,CAAS;EAChD;CACJ,CAAC,GAUK,CAAC,GAAO,KAAY,EAAS,EAAK;CACxC,QAAgB;EACR,AAAC,KAAU,EAAS,SAAS,EAAS,WAAW,WACrD,EAAS,EAAK,GACd,EAAS,MAAM;CACnB,GAAG;EAAC;EAAO,EAAS;EAAO,EAAS;EAAQ;CAAQ,CAAC;CAErD,IAAM,UAAoB;EAEtB,IADA,EAAU,IAAI,GACV,EAAI,UAAU,EAAS,OAAO;GAC9B,EAAS,MAAM;GACf;EACJ;EAEA,AADA,EAAS,EAAI,GACb,EAAI,MAAM;CACd,GAEM,UAAqB;EAGvB,AAFA,EAAU,IAAI,GACd,EAAS,OAAO,GAChB,EAAM;CACV,GAEM,IAAO,EAAS,WAAW,eAAe,EAAS,WAAW,UAC9D,IAAU,EAAW,UAAU;CAUrC,OARK,IASD,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,UAAU,CAAS;EAAG,GAAI;EAApD,UAAA;GACI,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAvB,UAAA;KACK,CAAC,KACE,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,SAAS,IAAS,IAAS;MAC3B,UAAU,KAAY,KAAW;MACjC,cAAY,IAAS,EAAQ,SAAS,EAAQ;MALlD,UAAA,CAQQ,EADH,IACI,IAEA,GAFD;OAAW,MAAM;OAAI,eAAA;MAAa,CAEN,GAEhC,kBAAC,QAAD,EAAA,UAAO,IAAS,EAAQ,SAAS,EAAQ,OAAa,CAAA,CAClD;;KAGX,KACG,kBAAA,GAAA,EAAA,UAAA,CACI,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,eAAe,KAAK,EAAS,KAAK;MAClC,cAAY,EAAQ;MAJxB,UAAA,CAMI,kBAAC,GAAD;OAAQ,MAAM;OAAI,eAAA;MAAa,CAAA,GAC/B,kBAAC,QAAD,EAAA,UAAO,EAAQ,KAAW,CAAA,CACtB;KACR,CAAA,GAAA,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,SACI,EAAS,WAAW,WAAW,EAAS,SAAS,EAAS;MAE9D,cACI,EAAS,WAAW,WAAW,EAAQ,SAAS,EAAQ;MAG3D,UAAA,EAAS,WAAW,WACjB,kBAAC,GAAD;OAAM,MAAM;OAAI,eAAA;MAAa,CAAA,IAE7B,kBAAC,GAAD;OAAO,MAAM;OAAI,eAAA;MAAa,CAAA;KAE9B,CAAA,CACV,EAAA,CAAA;KAGL,KACG,kBAAC,OAAD;MACI,WAAW,EAAO;MAClB,MAAK;MACL,cAAY,EAAQ;MACpB,iBAAe;MACf,iBAAe;MACf,iBAAe,KAAK,MAAM,EAAS,QAAQ,GAAG;MAE9C,UAAA,kBAAC,QAAD;OACI,WAAW,EAAO;OAClB,OAAO,EAAE,WAAW,UAAU,EAAS,MAAM,GAAG;MACnD,CAAA;KACA,CAAA;KAGT,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAxB,UAAA,CACK,EAAe,IAAO,EAAS,aAAc,GAAQ,cAAc,CAAE,GACrE,MAAkB,KAAA,KACf,kBAAC,QAAD;OAAM,WAAW,EAAO;OAAxB,UAAA,CAA6B,OAAI,EAAe,CAAa,CAAQ;MAEvE,CAAA,CAAA;;IACL;;GAEL,kBAAC,KAAD;IAAG,WAAW,EAAO;IAAQ,MAAK;IAC7B,UAAA,IACK,EAAQ,aACR,EAAI,WAAW,eACb,EAAQ,SACR,IACE,EAAQ,SACR,EAAI,QACF,EAAI,MAAM,UACV,EAAS,WAAW,cAClB,EAAQ,YACR,EAAS,WAAW,WAClB,EAAQ,SACR,IACE,KACA,EAAQ;GAC3B,CAAA;GAEF,KAAU,KACP,kBAAC,GAAD;IACI,KAAK,EAAO;IACZ,YAAY,EAAO;IACX;IACC;GACZ,CAAA;GAGJ,KAAU,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAS,UAAA;GAAY,CAAA;EACtD;MA5GD,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,UAAU,CAAS;EAAG,GAAI;EAChD,UAAA,kBAAC,KAAD;GAAG,WAAW,EAAO;GAAS,UAAA,EAAQ;EAAe,CAAA;CACpD,CAAA;AA4GjB"}
+{"version":3,"file":"AudioRecorder.js","names":["styles","_Fragment","AudioRecorder_module_default","Fragment$1","STRINGS","AudioRecorder","rest","strings","locale","permission","useMediaPermission","mic","useMicrophone","converting","setConverting","useState","result","setResult","supported","setSupported","isAudioRecordingSupported","finish","format","recording","onRecorded","blob","blobToWav","wavOptions","converted","error","onError","recorder","useAudioRecorder","armed","setArmed","begin","retake","busy","blocked","cn","className","disabled","jsx","RotateCcw","Mic","Square","Play","Pause","formatDuration","maxDurationMs","review","AudioPlayer","footer"],"sources":["../../../src/components/AudioRecorder/AudioRecorder.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — recording has three\n * separate configurations that a caller genuinely picks between: the capture\n * (deviceId, audioBitsPerSecond, maxDurationMs), the output (format, wavOptions) and\n * the review step (review, footer, locale). The body holds permission, recording,\n * review and error as one state machine; splitting it would thread the same recorder\n * handle through props.\n */\nimport { Mic, Pause, Play, RotateCcw, Square } from \"lucide-react\";\nimport { useEffect, useState, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { formatDuration } from \"@/audio/duration\";\nimport { isAudioRecordingSupported } from \"@/audio/audio-recorder\";\nimport { useAudioRecorder } from \"@/audio/use-audio-recorder\";\nimport { useMicrophone } from \"@/audio/use-microphone\";\nimport { blobToWav, type WavOptions } from \"@/audio/wav\";\nimport type { AudioRecording } from \"@/audio/audio-recorder\";\nimport { useMediaPermission } from \"@/hooks/use-media-permission\";\nimport { cn } from \"@/utils/cn\";\n\nimport { AudioPlayer } from \"../AudioPlayer\";\nimport styles from \"./AudioRecorder.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onError\";\n\nexport interface AudioRecorderProps extends Omit<\n    HTMLAttributes<HTMLDivElement>,\n    OverriddenDomProps\n> {\n    /**\n     * Called once a recording is finished and (when asked) converted.\n     *\n     * Fires on stop and on hitting `maxDurationMs`, never on cancel.\n     */\n    onRecorded?: (recording: AudioRecording) => void;\n    /** Stop automatically after this long. Strongly recommended on anything public. */\n    maxDurationMs?: number;\n    /** Specific microphone, from `useMediaDevices().audioInputs`. */\n    deviceId?: string;\n    /**\n     * Output container.\n     *\n     * `\"native\"` (default) keeps what the browser produced — Opus on Chromium and\n     * Firefox, AAC on Safari — which is the smallest and needs no work. `\"wav\"`\n     * converts on stop, for a backend that only accepts WAV; see `wavOptions`, and\n     * expect roughly ten times the bytes.\n     */\n    format?: \"native\" | \"wav\";\n    /** Passed to `blobToWav` when `format=\"wav\"`. `{ mono: true, sampleRate: 16000 }` suits speech. */\n    wavOptions?: WavOptions;\n    /** Target bitrate. 32000–64000 is plenty for speech in Opus. */\n    audioBitsPerSecond?: number;\n    /** Offer playback of the recording before handing it over. Default `true`. */\n    review?: boolean;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Rendered under the controls — a hint, a character count, a legal notice. */\n    footer?: ReactNode;\n    /** Recorder-level failure, or a failed WAV conversion. */\n    onError?: (error: unknown) => void;\n    disabled?: boolean;\n}\n\nconst STRINGS = {\n    \"pt-BR\": {\n        record: \"Gravar\",\n        stop: \"Parar\",\n        pause: \"Pausar\",\n        resume: \"Continuar\",\n        retake: \"Gravar de novo\",\n        level: \"Nível do microfone\",\n        asking: \"Pedindo acesso ao microfone…\",\n        denied: \"Acesso ao microfone bloqueado. Libere nas configurações do site e recarregue.\",\n        unsupported: \"Este navegador não grava áudio.\",\n        idleHint: \"Toque em Gravar para começar.\",\n        recording: \"Gravando\",\n        paused: \"Pausado\",\n        converting: \"Convertendo…\",\n    },\n    en: {\n        record: \"Record\",\n        stop: \"Stop\",\n        pause: \"Pause\",\n        resume: \"Resume\",\n        retake: \"Record again\",\n        level: \"Microphone level\",\n        asking: \"Requesting microphone access…\",\n        denied: \"Microphone access blocked. Allow it in site settings and reload.\",\n        unsupported: \"This browser cannot record audio.\",\n        idleHint: \"Press Record to start.\",\n        recording: \"Recording\",\n        paused: \"Paused\",\n        converting: \"Converting…\",\n    },\n} as const;\n\n/**\n * Record a voice note: one button to start, a live level meter, a clock, and a\n * playback review before the audio leaves the component.\n *\n * The permission flow is the part worth reading. The microphone is **not** opened on\n * mount — the prompt fires on the first press of Record, because a prompt the user did\n * not provoke is the most reliable way to earn a permanent block, after which\n * `getUserMedia` rejects without ever asking again. When the permission is already\n * `\"denied\"`, the component says so and how to fix it instead of offering a button\n * that cannot work.\n *\n * The level meter is not decoration either: a muted OS input or a headset with its mic\n * arm folded up produces a perfectly successful recording of silence, and without a\n * visible level the user only finds out after they finish talking.\n *\n * @example\n * <AudioRecorder\n *     maxDurationMs={120_000}\n *     format=\"wav\"\n *     wavOptions={{ mono: true, sampleRate: 16000 }}\n *     onRecorded={({ blob }) => upload(blob)}\n * />\n */\nexport function AudioRecorder({\n    onRecorded,\n    maxDurationMs,\n    deviceId,\n    format = \"native\",\n    wavOptions,\n    audioBitsPerSecond,\n    review = true,\n    locale = \"pt-BR\",\n    footer,\n    onError,\n    disabled = false,\n    className,\n    ...rest\n}: AudioRecorderProps) {\n    const strings = STRINGS[locale];\n    const permission = useMediaPermission(\"microphone\");\n    const mic = useMicrophone({ deviceId });\n    const [converting, setConverting] = useState(false);\n    const [result, setResult] = useState<AudioRecording | null>(null);\n    const [supported, setSupported] = useState(true);\n\n    useEffect(() => setSupported(isAudioRecordingSupported()), []);\n\n    /**\n     * Convert if asked, then publish.\n     *\n     * The conversion is awaited here rather than left to the caller so that\n     * `onRecorded` only ever fires with the format the caller asked for — a callback\n     * that sometimes hands over WebM and sometimes WAV is a bug waiting in the upload\n     * path.\n     */\n    const finish = async (recording: AudioRecording): Promise<void> => {\n        if (format !== \"wav\") {\n            setResult(recording);\n            onRecorded?.(recording);\n            return;\n        }\n        setConverting(true);\n        try {\n            const blob = await blobToWav(recording.blob, wavOptions);\n            const converted: AudioRecording = { ...recording, blob, mimeType: \"audio/wav\" };\n            setResult(converted);\n            onRecorded?.(converted);\n        } catch (error) {\n            onError?.(error);\n            setResult(recording);\n            onRecorded?.(recording);\n        } finally {\n            setConverting(false);\n        }\n    };\n\n    const recorder = useAudioRecorder(mic.stream, {\n        maxDurationMs,\n        audioBitsPerSecond,\n        onRecorded: (recording) => void finish(recording),\n        onError,\n    });\n\n    /**\n     * Start recording as soon as the stream lands.\n     *\n     * The user pressed Record before the permission prompt existed, so the press has\n     * to survive the round-trip: `mic.start()` opens the device, the stream arrives a\n     * few hundred milliseconds later, and recording begins then. Waiting for a second\n     * press would make the first one look broken.\n     */\n    const [armed, setArmed] = useState(false);\n    useEffect(() => {\n        if (!armed || !recorder.ready || recorder.status !== \"idle\") return;\n        setArmed(false);\n        recorder.start();\n    }, [armed, recorder.ready, recorder.status, recorder]);\n\n    const begin = (): void => {\n        setResult(null);\n        if (mic.stream && recorder.ready) {\n            recorder.start();\n            return;\n        }\n        setArmed(true);\n        mic.start();\n    };\n\n    const retake = (): void => {\n        setResult(null);\n        recorder.cancel();\n        begin();\n    };\n\n    const busy = recorder.status === \"recording\" || recorder.status === \"paused\";\n    const blocked = permission.state === \"denied\";\n\n    if (!supported) {\n        return (\n            <div className={cn(styles.recorder, className)} {...rest}>\n                <p className={styles.notice}>{strings.unsupported}</p>\n            </div>\n        );\n    }\n\n    return (\n        <div className={cn(styles.recorder, className)} {...rest}>\n            <div className={styles.row}>\n                {!busy && (\n                    <button\n                        type=\"button\"\n                        className={styles.record}\n                        onClick={result ? retake : begin}\n                        disabled={disabled || blocked || converting}\n                        aria-label={result ? strings.retake : strings.record}\n                    >\n                        {result ? (\n                            <RotateCcw size={16} aria-hidden />\n                        ) : (\n                            <Mic size={16} aria-hidden />\n                        )}\n                        <span>{result ? strings.retake : strings.record}</span>\n                    </button>\n                )}\n\n                {busy && (\n                    <>\n                        <button\n                            type=\"button\"\n                            className={styles.stop}\n                            onClick={() => void recorder.stop()}\n                            aria-label={strings.stop}\n                        >\n                            <Square size={14} aria-hidden />\n                            <span>{strings.stop}</span>\n                        </button>\n                        <button\n                            type=\"button\"\n                            className={styles.secondary}\n                            onClick={\n                                recorder.status === \"paused\" ? recorder.resume : recorder.pause\n                            }\n                            aria-label={\n                                recorder.status === \"paused\" ? strings.resume : strings.pause\n                            }\n                        >\n                            {recorder.status === \"paused\" ? (\n                                <Play size={14} aria-hidden />\n                            ) : (\n                                <Pause size={14} aria-hidden />\n                            )}\n                        </button>\n                    </>\n                )}\n\n                {busy && (\n                    <div\n                        className={styles.meter}\n                        role=\"meter\"\n                        aria-label={strings.level}\n                        aria-valuemin={0}\n                        aria-valuemax={100}\n                        aria-valuenow={Math.round(recorder.level * 100)}\n                    >\n                        <span\n                            className={styles.meterFill}\n                            style={{ transform: `scaleX(${recorder.level})` }}\n                        />\n                    </div>\n                )}\n\n                <span className={styles.clock}>\n                    {formatDuration(busy ? recorder.durationMs : (result?.durationMs ?? 0))}\n                    {maxDurationMs !== undefined && (\n                        <span className={styles.max}> / {formatDuration(maxDurationMs)}</span>\n                    )}\n                </span>\n            </div>\n\n            <p className={styles.status} role=\"status\">\n                {converting\n                    ? strings.converting\n                    : mic.status === \"requesting\"\n                      ? strings.asking\n                      : blocked\n                        ? strings.denied\n                        : mic.error\n                          ? mic.error.message\n                          : recorder.status === \"recording\"\n                            ? strings.recording\n                            : recorder.status === \"paused\"\n                              ? strings.paused\n                              : result\n                                ? \"\"\n                                : strings.idleHint}\n            </p>\n\n            {review && result && (\n                <AudioPlayer\n                    src={result.blob}\n                    durationMs={result.durationMs}\n                    locale={locale}\n                    onError={onError}\n                />\n            )}\n\n            {footer && <div className={styles.footer}>{footer}</div>}\n        </div>\n    );\n}\n"],"mappings":";;;;;;;;;;;;;AAgEA,IAAMI,IAAU;CACZ,SAAS;EACL,QAAQ;EACR,MAAM;EACN,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,aAAa;EACb,UAAU;EACV,WAAW;EACX,QAAQ;EACR,YAAY;CAChB;CACA,IAAI;EACA,QAAQ;EACR,MAAM;EACN,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,QAAQ;EACR,aAAa;EACb,UAAU;EACV,WAAW;EACX,QAAQ;EACR,YAAY;CAChB;AACJ;AAyBA,SAAgBC,EAAc,EAC1B,eACA,kBACA,aACA,YAAS,UACT,eACA,uBACA,YAAS,IACT,YAAS,SACT,WACA,YACA,cAAW,IACX,cACA,GAAGC,KACgB;CACnB,IAAMC,IAAUH,EAAQI,IAClBC,IAAaC,EAAmB,YAAY,GAC5CC,IAAMC,EAAc,EAAE,YAAS,CAAC,GAChC,CAACC,GAAYC,KAAiBC,EAAS,EAAK,GAC5C,CAACC,GAAQC,KAAaF,EAAgC,IAAI,GAC1D,CAACG,GAAWC,KAAgBJ,EAAS,EAAI;CAE/C,QAAgBI,EAAaC,EAA0B,CAAC,GAAG,CAAC,CAAC;CAU7D,IAAMC,IAAS,OAAO,MAA6C;EAC/D,IAAIC,MAAW,OAEX,AADAL,EAAUM,CAAS,GACnBC,IAAaD,CAAS;OAG1B;KAAc,EAAI;GAClB,IAAI;IACA,IAAME,IAAO,MAAMC,EAAUH,EAAU,MAAMI,CAAU,GACjDC,IAA4B;KAAE,GAAGL;KAAW;KAAM,UAAU;IAAY;IAE9E,AADAN,EAAUW,CAAS,GACnBJ,IAAaI,CAAS;GAC1B,SAASC,GAAO;IAGZ,AAFAC,IAAUD,CAAK,GACfZ,EAAUM,CAAS,GACnBC,IAAaD,CAAS;GAC1B,UAAU;IACN,EAAc,EAAK;GACvB;EAZkB;CAatB,GAEMQ,IAAWC,EAAiBrB,EAAI,QAAQ;EAC1C;EACA;EACA,aAAa,MAAc,KAAKU,EAAOE,CAAS;EAChD;CACJ,CAAC,GAUK,CAACU,GAAOC,KAAYnB,EAAS,EAAK;CACxC,QAAgB;EACZ,AAAKkB,KAAUF,EAAS,SAASA,EAAS,WAAW,WACrDG,EAAS,EAAK,GACdH,EAAS,MAAM;CACnB,GAAG;EAACE;EAAOF,EAAS;EAAOA,EAAS;EAAQA;CAAQ,CAAC;CAErD,IAAMI,UAAoB;EAEtB,AADAlB,EAAU,IAAI,GACVN,EAAI,UAAUoB,EAAS,QACvBA,EAAS,MAAM,KAGnBG,EAAS,EAAI,GACbvB,EAAI,MAAM;CACd,GAEMyB,UAAqB;EAGvB,AAFAnB,EAAU,IAAI,GACdc,EAAS,OAAO,GAChBI,EAAM;CACV,GAEME,IAAON,EAAS,WAAW,eAAeA,EAAS,WAAW,UAC9DO,IAAU7B,EAAW,UAAU;CAUrC,OARKS,IASD,kBAAC,OAAD;EAAK,WAAWqB,EAAGvC,EAAO,UAAUwC,CAAS;EAAG,GAAIlC;EAApD,UAAA;GACI,kBAAC,OAAD;IAAK,WAAWN,EAAO;IAAvB,UAAA;KACK,CAACqC,KACE,kBAAC,UAAD;MACI,MAAK;MACL,WAAWrC,EAAO;MAClB,SAASgB,IAASoB,IAASD;MAC3B,UAAUM,KAAYH,KAAWzB;MACjC,cAAYG,IAAST,EAAQ,SAASA,EAAQ;MALlD,UAAA,CAQQmC,EADH1B,IACI2B,IAEAC,GAFD;OAAW,MAAM;OAAI,eAAA;MAAa,CAEN,GAEhC,kBAAC,QAAD,EAAA,UAAO5B,IAAST,EAAQ,SAASA,EAAQ,OAAa,CAAA,CAClD;;KAGX8B,KACG,kBAAApC,GAAA,EAAA,UAAA,CACI,kBAAC,UAAD;MACI,MAAK;MACL,WAAWD,EAAO;MAClB,eAAe,KAAK+B,EAAS,KAAK;MAClC,cAAYxB,EAAQ;MAJxB,UAAA,CAMI,kBAACsC,GAAD;OAAQ,MAAM;OAAI,eAAA;MAAa,CAAA,GAC/B,kBAAC,QAAD,EAAA,UAAOtC,EAAQ,KAAW,CAAA,CACtB;KACR,CAAA,GAAA,kBAAC,UAAD;MACI,MAAK;MACL,WAAWP,EAAO;MAClB,SACI+B,EAAS,WAAW,WAAWA,EAAS,SAASA,EAAS;MAE9D,cACIA,EAAS,WAAW,WAAWxB,EAAQ,SAASA,EAAQ;MAG3D,UAAAwB,EAAS,WAAW,WACjB,kBAACe,GAAD;OAAM,MAAM;OAAI,eAAA;MAAa,CAAA,IAE7B,kBAACC,GAAD;OAAO,MAAM;OAAI,eAAA;MAAa,CAAA;KAE9B,CAAA,CACV,EAAA,CAAA;KAGLV,KACG,kBAAC,OAAD;MACI,WAAWrC,EAAO;MAClB,MAAK;MACL,cAAYO,EAAQ;MACpB,iBAAe;MACf,iBAAe;MACf,iBAAe,KAAK,MAAMwB,EAAS,QAAQ,GAAG;MAE9C,UAAA,kBAAC,QAAD;OACI,WAAW/B,EAAO;OAClB,OAAO,EAAE,WAAW,UAAU+B,EAAS,MAAM,GAAG;MACnD,CAAA;KACA,CAAA;KAGT,kBAAC,QAAD;MAAM,WAAW/B,EAAO;MAAxB,UAAA,CACKgD,EAAeX,IAAON,EAAS,aAAcf,GAAQ,cAAc,CAAE,GACrEiC,MAAkB,KAAA,KACf,kBAAC,QAAD;OAAM,WAAWjD,EAAO;OAAxB,UAAA,CAA6B,OAAIgD,EAAeC,CAAa,CAAQ;MAEvE,CAAA,CAAA;;IACL;;GAEL,kBAAC,KAAD;IAAG,WAAWjD,EAAO;IAAQ,MAAK;IAC7B,UAAAa,IACKN,EAAQ,aACRI,EAAI,WAAW,eACbJ,EAAQ,SACR+B,IACE/B,EAAQ,SACRI,EAAI,QACFA,EAAI,MAAM,UACVoB,EAAS,WAAW,cAClBxB,EAAQ,YACRwB,EAAS,WAAW,WAClBxB,EAAQ,SACRS,IACE,KACAT,EAAQ;GAC3B,CAAA;GAEF2C,KAAUlC,KACP,kBAACmC,GAAD;IACI,KAAKnC,EAAO;IACZ,YAAYA,EAAO;IACX;IACC;GACZ,CAAA;GAGJoC,KAAU,kBAAC,OAAD;IAAK,WAAWpD,EAAO;IAAS,UAAAoD;GAAY,CAAA;EACtD;C,KA5GD,kBAAC,OAAD;EAAK,WAAWb,EAAGvC,EAAO,UAAUwC,CAAS;EAAG,GAAIlC;EAChD,UAAA,kBAAC,KAAD;GAAG,WAAWN,EAAO;GAAS,UAAAO,EAAQ;EAAe,CAAA;CACpD,CAAA;AA4GjB"}

package/dist/components/AudioRecorder/AudioRecorder.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AudioRecorder.module.cjs","names":[],"sources":["../../../src/components/AudioRecorder/AudioRecorder.module.css"],"sourcesContent":[".recorder {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n    padding: var(--tempest-space-3);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n}\n\n.row {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n}\n\n.record,\n.stop,\n.secondary {\n    position: relative;\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    font: inherit;\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-medium);\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n.record {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.record:disabled {\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-subtle);\n    cursor: not-allowed;\n}\n\n/*\n * Stop reads as the danger control — while recording it is the one\n * irreversible-feeling thing on screen and has to be what the eye lands on without\n * reading labels — but it uses the **soft** danger pair, not solid red with white.\n *\n * Measured in a real browser: white on `--tempest-danger-solid` is 4.83:1 in the light\n * theme and **3.76:1** in dark, under the 4.5:1 floor for text. Every solid variant\n * fails there (`--tempest-danger` is 2.77:1 against white in dark, `-hover` 3.76:1);\n * only `--tempest-danger-fg` on `--tempest-danger-bg` clears it in both — 8.2:1 light,\n * 6.57:1 dark. The border keeps the control unmistakably red at a glance.\n */\n.stop {\n    border-color: var(--tempest-danger);\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n\n.secondary {\n    border-color: var(--tempest-border);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    padding-inline: var(--tempest-space-2);\n}\n\n.record:focus-visible,\n.stop:focus-visible,\n.secondary:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .record,\n    .stop,\n    .secondary {\n        transition: none;\n    }\n}\n\n/* Touch hit-slop — 44×44 without changing the visual footprint, as `Button` does. */\n@media (pointer: coarse) {\n    .secondary::after {\n        content: \"\";\n        position: absolute;\n        inset: -6px;\n    }\n}\n\n/*\n * The meter is transform-driven, not width-driven: `transform` is composited, so a\n * value arriving 10 times a second does not force layout on the whole row.\n */\n.meter {\n    flex: 1 1 6rem;\n    min-width: 3rem;\n    height: 0.5rem;\n    overflow: hidden;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-2);\n}\n\n.meterFill {\n    display: block;\n    width: 100%;\n    height: 100%;\n    background-color: var(--tempest-success);\n    transform-origin: left center;\n    transform: scaleX(0);\n    transition: transform 80ms linear;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .meterFill {\n        transition: none;\n    }\n}\n\n.clock {\n    flex: 0 0 auto;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-sm);\n    font-variant-numeric: tabular-nums;\n}\n\n.max {\n    color: var(--tempest-text-muted);\n}\n\n.status {\n    margin: 0;\n    min-height: 1.25em;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n.notice {\n    margin: 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n}\n\n.footer {\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n@media (max-width: 480px) {\n    .recorder {\n        padding: var(--tempest-space-2);\n    }\n\n    .meter {\n        flex-basis: 100%;\n        order: 1;\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"AudioRecorder.module.cjs","names":["recorder","row","record","stop","secondary","meter","meterFill","clock","max","status","notice","footer","AudioRecorder_module_default"],"sources":["../../../src/components/AudioRecorder/AudioRecorder.module.css"],"sourcesContent":[".recorder {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n    padding: var(--tempest-space-3);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n}\n\n.row {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n}\n\n.record,\n.stop,\n.secondary {\n    position: relative;\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    font: inherit;\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-medium);\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n.record {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.record:disabled {\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-subtle);\n    cursor: not-allowed;\n}\n\n/*\n * Stop reads as the danger control — while recording it is the one\n * irreversible-feeling thing on screen and has to be what the eye lands on without\n * reading labels — but it uses the **soft** danger pair, not solid red with white.\n *\n * Measured in a real browser: white on `--tempest-danger-solid` is 4.83:1 in the light\n * theme and **3.76:1** in dark, under the 4.5:1 floor for text. Every solid variant\n * fails there (`--tempest-danger` is 2.77:1 against white in dark, `-hover` 3.76:1);\n * only `--tempest-danger-fg` on `--tempest-danger-bg` clears it in both — 8.2:1 light,\n * 6.57:1 dark. The border keeps the control unmistakably red at a glance.\n */\n.stop {\n    border-color: var(--tempest-danger);\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n\n.secondary {\n    border-color: var(--tempest-border);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    padding-inline: var(--tempest-space-2);\n}\n\n.record:focus-visible,\n.stop:focus-visible,\n.secondary:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .record,\n    .stop,\n    .secondary {\n        transition: none;\n    }\n}\n\n/* Touch hit-slop — 44×44 without changing the visual footprint, as `Button` does. */\n@media (pointer: coarse) {\n    .secondary::after {\n        content: \"\";\n        position: absolute;\n        inset: -6px;\n    }\n}\n\n/*\n * The meter is transform-driven, not width-driven: `transform` is composited, so a\n * value arriving 10 times a second does not force layout on the whole row.\n */\n.meter {\n    flex: 1 1 6rem;\n    min-width: 3rem;\n    height: 0.5rem;\n    overflow: hidden;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-2);\n}\n\n.meterFill {\n    display: block;\n    width: 100%;\n    height: 100%;\n    background-color: var(--tempest-success);\n    transform-origin: left center;\n    transform: scaleX(0);\n    transition: transform 80ms linear;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .meterFill {\n        transition: none;\n    }\n}\n\n.clock {\n    flex: 0 0 auto;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-sm);\n    font-variant-numeric: tabular-nums;\n}\n\n.max {\n    color: var(--tempest-text-muted);\n}\n\n.status {\n    margin: 0;\n    min-height: 1.25em;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n.notice {\n    margin: 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n}\n\n.footer {\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n@media (max-width: 480px) {\n    .recorder {\n        padding: var(--tempest-space-2);\n    }\n\n    .meter {\n        flex-basis: 100%;\n        order: 1;\n    }\n}\n"],"mappings":";"}

package/dist/components/AudioRecorder/AudioRecorder.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"AudioRecorder.module.js","names":[],"sources":["../../../src/components/AudioRecorder/AudioRecorder.module.css"],"sourcesContent":[".recorder {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n    padding: var(--tempest-space-3);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n}\n\n.row {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n}\n\n.record,\n.stop,\n.secondary {\n    position: relative;\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    font: inherit;\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-medium);\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n.record {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.record:disabled {\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-subtle);\n    cursor: not-allowed;\n}\n\n/*\n * Stop reads as the danger control — while recording it is the one\n * irreversible-feeling thing on screen and has to be what the eye lands on without\n * reading labels — but it uses the **soft** danger pair, not solid red with white.\n *\n * Measured in a real browser: white on `--tempest-danger-solid` is 4.83:1 in the light\n * theme and **3.76:1** in dark, under the 4.5:1 floor for text. Every solid variant\n * fails there (`--tempest-danger` is 2.77:1 against white in dark, `-hover` 3.76:1);\n * only `--tempest-danger-fg` on `--tempest-danger-bg` clears it in both — 8.2:1 light,\n * 6.57:1 dark. The border keeps the control unmistakably red at a glance.\n */\n.stop {\n    border-color: var(--tempest-danger);\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n\n.secondary {\n    border-color: var(--tempest-border);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    padding-inline: var(--tempest-space-2);\n}\n\n.record:focus-visible,\n.stop:focus-visible,\n.secondary:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .record,\n    .stop,\n    .secondary {\n        transition: none;\n    }\n}\n\n/* Touch hit-slop — 44×44 without changing the visual footprint, as `Button` does. */\n@media (pointer: coarse) {\n    .secondary::after {\n        content: \"\";\n        position: absolute;\n        inset: -6px;\n    }\n}\n\n/*\n * The meter is transform-driven, not width-driven: `transform` is composited, so a\n * value arriving 10 times a second does not force layout on the whole row.\n */\n.meter {\n    flex: 1 1 6rem;\n    min-width: 3rem;\n    height: 0.5rem;\n    overflow: hidden;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-2);\n}\n\n.meterFill {\n    display: block;\n    width: 100%;\n    height: 100%;\n    background-color: var(--tempest-success);\n    transform-origin: left center;\n    transform: scaleX(0);\n    transition: transform 80ms linear;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .meterFill {\n        transition: none;\n    }\n}\n\n.clock {\n    flex: 0 0 auto;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-sm);\n    font-variant-numeric: tabular-nums;\n}\n\n.max {\n    color: var(--tempest-text-muted);\n}\n\n.status {\n    margin: 0;\n    min-height: 1.25em;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n.notice {\n    margin: 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n}\n\n.footer {\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n@media (max-width: 480px) {\n    .recorder {\n        padding: var(--tempest-space-2);\n    }\n\n    .meter {\n        flex-basis: 100%;\n        order: 1;\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"AudioRecorder.module.js","names":["recorder","row","record","stop","secondary","meter","meterFill","clock","max","status","notice","footer","AudioRecorder_module_default"],"sources":["../../../src/components/AudioRecorder/AudioRecorder.module.css"],"sourcesContent":[".recorder {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n    padding: var(--tempest-space-3);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n}\n\n.row {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    min-width: 0;\n}\n\n.record,\n.stop,\n.secondary {\n    position: relative;\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    font: inherit;\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-medium);\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n.record {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.record:disabled {\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-subtle);\n    cursor: not-allowed;\n}\n\n/*\n * Stop reads as the danger control — while recording it is the one\n * irreversible-feeling thing on screen and has to be what the eye lands on without\n * reading labels — but it uses the **soft** danger pair, not solid red with white.\n *\n * Measured in a real browser: white on `--tempest-danger-solid` is 4.83:1 in the light\n * theme and **3.76:1** in dark, under the 4.5:1 floor for text. Every solid variant\n * fails there (`--tempest-danger` is 2.77:1 against white in dark, `-hover` 3.76:1);\n * only `--tempest-danger-fg` on `--tempest-danger-bg` clears it in both — 8.2:1 light,\n * 6.57:1 dark. The border keeps the control unmistakably red at a glance.\n */\n.stop {\n    border-color: var(--tempest-danger);\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n\n.secondary {\n    border-color: var(--tempest-border);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    padding-inline: var(--tempest-space-2);\n}\n\n.record:focus-visible,\n.stop:focus-visible,\n.secondary:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .record,\n    .stop,\n    .secondary {\n        transition: none;\n    }\n}\n\n/* Touch hit-slop — 44×44 without changing the visual footprint, as `Button` does. */\n@media (pointer: coarse) {\n    .secondary::after {\n        content: \"\";\n        position: absolute;\n        inset: -6px;\n    }\n}\n\n/*\n * The meter is transform-driven, not width-driven: `transform` is composited, so a\n * value arriving 10 times a second does not force layout on the whole row.\n */\n.meter {\n    flex: 1 1 6rem;\n    min-width: 3rem;\n    height: 0.5rem;\n    overflow: hidden;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-2);\n}\n\n.meterFill {\n    display: block;\n    width: 100%;\n    height: 100%;\n    background-color: var(--tempest-success);\n    transform-origin: left center;\n    transform: scaleX(0);\n    transition: transform 80ms linear;\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .meterFill {\n        transition: none;\n    }\n}\n\n.clock {\n    flex: 0 0 auto;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-sm);\n    font-variant-numeric: tabular-nums;\n}\n\n.max {\n    color: var(--tempest-text-muted);\n}\n\n.status {\n    margin: 0;\n    min-height: 1.25em;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n.notice {\n    margin: 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n}\n\n.footer {\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n}\n\n@media (max-width: 480px) {\n    .recorder {\n        padding: var(--tempest-space-2);\n    }\n\n    .meter {\n        flex-basis: 100%;\n        order: 1;\n    }\n}\n"],"mappings":";"}

package/dist/components/Avatar/Avatar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.cjs","names":[],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"mappings":"6HAiBA,SAAS,EAAY,EAAsB,CACvC,IAAM,EAAQ,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,EAGrD,OAFI,EAAM,SAAW,EAAU,IAC3B,EAAM,SAAW,EAAU,EAAM,EAAE,CAAE,MAAM,EAAG,CAAC,EAC5C,GAAG,EAAM,EAAE,CAAE,OAAO,CAAC,IAAI,EAAM,EAAM,OAAS,EAAE,CAAE,OAAO,CAAC,GACrE,CAMA,SAAgB,EAAO,CACnB,MACA,MACA,OAAO,GACP,OAAO,KACP,SACA,YACA,WACY,CACZ,GAAM,CAAC,EAAS,IAAA,EAAc,EAAA,SAAA,CAAkB,EAAK,EAC/C,GAAA,EAAW,EAAA,QAAA,KAAc,EAAY,CAAI,EAAG,CAAC,CAAI,CAAC,EAElD,EAAY,GAAO,CAAC,EACpB,EAAO,EAAU,SAAW,IAAA,GAC5B,EAAW,EAAU,EAAI,IAAA,GAE/B,OACI,EAAA,EAAA,KAAA,CAAC,OAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,OAAQ,EAAA,QAAO,GAAO,GAAU,EAAA,QAAO,OAAQ,CAAS,EACvE,OACI,WACD,UACT,UACI,EACO,GAAU,EACH,EAAM,MAAQ,SAAW,EAAM,MAAQ,OACvC,EAAM,eAAe,EACrB,EAAQ,EAEhB,EACA,IAAA,GAbd,SAAA,CAgBK,GACG,EAAA,EAAA,IAAA,CAAC,MAAD,CACS,MACL,IAAK,GAAO,EACZ,UAAW,EAAA,QAAO,MAClB,YAAe,EAAW,EAAI,CACjC,CAAA,GAED,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,aAAY,GAAO,EAAO,SAAA,CAAe,CAAA,EAElD,IAAU,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,GAAG,EAAA,QAAO,IAAK,EAAA,QAAO,EAAO,EAAG,cAAA,EAAa,CAAA,CACvE,GAEd"}
+{"version":3,"file":"Avatar.cjs","names":["useState","useMemo","cn","styles","require_cn","require_Avatar_module","react","react_jsx_runtime","getInitials","parts","name","Avatar","errored","setErrored","initials","showImage","src","role","onClick","tabIndex","size","status","className","event","alt"],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"mappings":"A,6HAiBA,SAASQ,EAAY,EAAsB,CACvC,IAAMC,EAAQC,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO,EAGrD,OAFID,EAAM,SAAW,EAAU,IAC3BA,EAAM,SAAW,EAAUA,EAAM,EAAE,CAAE,MAAM,EAAG,CAAC,EAC5C,GAAGA,EAAM,EAAE,CAAE,OAAO,CAAC,IAAIA,EAAMA,EAAM,OAAS,EAAE,CAAE,OAAO,CAAC,GACrE,CAMA,SAAgBE,EAAO,CACnB,MACA,MACA,OAAO,GACP,OAAO,KACP,SACA,YACA,WACY,CACZ,GAAM,CAACC,EAASC,IAAA,EAAcb,EAAAA,SAAAA,CAAkB,EAAK,EAC/Cc,GAAA,EAAWb,EAAAA,QAAAA,KAAcO,EAAYE,CAAI,EAAG,CAACA,CAAI,CAAC,EAElDK,EAAYC,GAAO,CAACJ,EACpBK,EAAOC,EAAU,SAAW,IAAA,GAC5BC,EAAWD,EAAU,EAAI,IAAA,GAE/B,OACI,EAAAX,EAAA,KAAA,CAAC,OAAD,CACI,UAAWL,EAAAA,GAAGC,EAAAA,QAAO,OAAQA,EAAAA,QAAOiB,GAAOC,GAAUlB,EAAAA,QAAO,OAAQmB,CAAS,EACvE,OACI,WACD,UACT,UACIJ,EACO,GAAU,EACHK,EAAM,MAAQ,SAAWA,EAAM,MAAQ,OACvCA,EAAM,eAAe,EACrBL,EAAQ,EAEhB,EACA,IAAA,GAbd,SAAA,CAgBKH,GACG,EAAAR,EAAA,IAAA,CAAC,MAAD,CACS,MACL,IAAKiB,GAAOd,EACZ,UAAWP,EAAAA,QAAO,MAClB,YAAeU,EAAW,EAAI,CACjC,CAAA,GAED,EAAAN,EAAA,IAAA,CAAC,OAAD,CAAM,aAAYiB,GAAOd,EAAO,SAAAI,CAAe,CAAA,EAElDO,IAAU,EAAAd,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWL,EAAAA,GAAGC,EAAAA,QAAO,IAAKA,EAAAA,QAAOkB,EAAO,EAAG,cAAA,EAAa,CAAA,CACvE,C,EAEd,C"}

package/dist/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","names":[],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"mappings":";;;;;AAiBA,SAAS,EAAY,GAAsB;CACvC,IAAM,IAAQ,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO;CAGrD,OAFI,EAAM,WAAW,IAAU,MAC3B,EAAM,WAAW,IAAU,EAAM,EAAE,CAAE,MAAM,GAAG,CAAC,IAC5C,GAAG,EAAM,EAAE,CAAE,OAAO,CAAC,IAAI,EAAM,EAAM,SAAS,EAAE,CAAE,OAAO,CAAC;AACrE;AAMA,SAAgB,EAAO,EACnB,QACA,QACA,UAAO,IACP,UAAO,MACP,WACA,cACA,cACY;CACZ,IAAM,CAAC,GAAS,KAAc,EAAkB,EAAK,GAC/C,IAAW,QAAc,EAAY,CAAI,GAAG,CAAC,CAAI,CAAC,GAElD,IAAY,KAAO,CAAC,GACpB,IAAO,IAAU,WAAW,KAAA,GAC5B,IAAW,IAAU,IAAI,KAAA;CAE/B,OACI,kBAAC,QAAD;EACI,WAAW,EAAG,EAAO,QAAQ,EAAO,IAAO,KAAU,EAAO,QAAQ,CAAS;EACvE;EACI;EACD;EACT,WACI,KACO,MAAU;GACP,CAAI,EAAM,QAAQ,WAAW,EAAM,QAAQ,SACvC,EAAM,eAAe,GACrB,EAAQ;EAEhB,IACA,KAAA;EAbd,UAAA,CAgBK,IACG,kBAAC,OAAD;GACS;GACL,KAAK,KAAO;GACZ,WAAW,EAAO;GAClB,eAAe,EAAW,EAAI;EACjC,CAAA,IAED,kBAAC,QAAD;GAAM,cAAY,KAAO;GAAO,UAAA;EAAe,CAAA,GAElD,KAAU,kBAAC,QAAD;GAAM,WAAW,EAAG,EAAO,KAAK,EAAO,EAAO;GAAG,eAAA;EAAa,CAAA,CACvE;;AAEd"}
+{"version":3,"file":"Avatar.js","names":["styles","Avatar_module_default","getInitials","parts","name","Avatar","errored","setErrored","useState","initials","useMemo","showImage","src","role","onClick","tabIndex","cn","size","status","className","event","alt"],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Avatar.module.css\";\n\nexport type AvatarSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type AvatarStatus = \"online\" | \"offline\" | \"busy\";\n\nexport interface AvatarProps {\n    src?: string;\n    alt?: string;\n    name?: string;\n    size?: AvatarSize;\n    status?: AvatarStatus;\n    className?: string;\n    onClick?: () => void;\n}\n\nfunction getInitials(name: string): string {\n    const parts = name.trim().split(/\\s+/).filter(Boolean);\n    if (parts.length === 0) return \"?\";\n    if (parts.length === 1) return parts[0]!.slice(0, 2);\n    return `${parts[0]!.charAt(0)}${parts[parts.length - 1]!.charAt(0)}`;\n}\n\n/**\n * Round avatar. Falls back to colored initials when the image fails to load\n * or no `src` is provided. Optional status dot in the bottom-right corner.\n */\nexport function Avatar({\n    src,\n    alt,\n    name = \"\",\n    size = \"md\",\n    status,\n    className,\n    onClick,\n}: AvatarProps) {\n    const [errored, setErrored] = useState<boolean>(false);\n    const initials = useMemo(() => getInitials(name), [name]);\n\n    const showImage = src && !errored;\n    const role = onClick ? \"button\" : undefined;\n    const tabIndex = onClick ? 0 : undefined;\n\n    return (\n        <span\n            className={cn(styles.avatar, styles[size], status && styles.status, className)}\n            role={role}\n            tabIndex={tabIndex}\n            onClick={onClick}\n            onKeyDown={\n                onClick\n                    ? (event) => {\n                          if (event.key === \"Enter\" || event.key === \" \") {\n                              event.preventDefault();\n                              onClick();\n                          }\n                      }\n                    : undefined\n            }\n        >\n            {showImage ? (\n                <img\n                    src={src}\n                    alt={alt ?? name}\n                    className={styles.image}\n                    onError={() => setErrored(true)}\n                />\n            ) : (\n                <span aria-label={alt ?? name}>{initials}</span>\n            )}\n            {status && <span className={cn(styles.dot, styles[status])} aria-hidden />}\n        </span>\n    );\n}\n"],"mappings":";;;;;AAiBA,SAASE,EAAY,GAAsB;CACvC,IAAMC,IAAQC,EAAK,KAAK,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,OAAO,OAAO;CAGrD,OAFID,EAAM,WAAW,IAAU,MAC3BA,EAAM,WAAW,IAAUA,EAAM,EAAE,CAAE,MAAM,GAAG,CAAC,IAC5C,GAAGA,EAAM,EAAE,CAAE,OAAO,CAAC,IAAIA,EAAMA,EAAM,SAAS,EAAE,CAAE,OAAO,CAAC;AACrE;AAMA,SAAgBE,EAAO,EACnB,QACA,QACA,UAAO,IACP,UAAO,MACP,WACA,cACA,cACY;CACZ,IAAM,CAACC,GAASC,KAAcC,EAAkB,EAAK,GAC/CC,IAAWC,QAAcR,EAAYE,CAAI,GAAG,CAACA,CAAI,CAAC,GAElDO,IAAYC,KAAO,CAACN,GACpBO,IAAOC,IAAU,WAAW,KAAA,GAC5BC,IAAWD,IAAU,IAAI,KAAA;CAE/B,OACI,kBAAC,QAAD;EACI,WAAWE,EAAGhB,EAAO,QAAQA,EAAOiB,IAAOC,KAAUlB,EAAO,QAAQmB,CAAS;EACvE;EACI;EACD;EACT,WACIL,KACO,MAAU;GACP,CAAIM,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACvCA,EAAM,eAAe,GACrBN,EAAQ;EAEhB,IACA,KAAA;EAbd,UAAA,CAgBKH,IACG,kBAAC,OAAD;GACS;GACL,KAAKU,KAAOjB;GACZ,WAAWJ,EAAO;GAClB,eAAeO,EAAW,EAAI;EACjC,CAAA,IAED,kBAAC,QAAD;GAAM,cAAYc,KAAOjB;GAAO,UAAAK;EAAe,CAAA,GAElDS,KAAU,kBAAC,QAAD;GAAM,WAAWF,EAAGhB,EAAO,KAAKA,EAAOkB,EAAO;GAAG,eAAA;EAAa,CAAA,CACvE;;AAEd"}

package/dist/components/Avatar/Avatar.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.module.cjs","names":[],"sources":["../../../src/components/Avatar/Avatar.module.css"],"sourcesContent":[".avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n    overflow: hidden;\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    text-transform: uppercase;\n    flex-shrink: 0;\n    user-select: none;\n}\n\n.image {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n}\n\n.xs {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm {\n    width: 32px;\n    height: 32px;\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    width: 40px;\n    height: 40px;\n    font-size: var(--tempest-text-base);\n}\n\n.lg {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-xl);\n}\n\n.xl {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-3xl);\n}\n\n.status {\n    position: relative;\n}\n\n.dot {\n    position: absolute;\n    bottom: 0;\n    right: 0;\n    width: 28%;\n    height: 28%;\n    border-radius: 50%;\n    border: 2px solid var(--tempest-bg);\n}\n\n.dot.online {\n    background-color: var(--tempest-success-solid);\n}\n\n.dot.offline {\n    background-color: var(--tempest-text-subtle);\n}\n\n.dot.busy {\n    background-color: var(--tempest-danger-solid);\n}\n"],"mappings":";"}
+{"version":3,"file":"Avatar.module.cjs","names":["avatar","image","xs","sm","md","lg","xl","status","dot","online","offline","busy","Avatar_module_default"],"sources":["../../../src/components/Avatar/Avatar.module.css"],"sourcesContent":[".avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n    overflow: hidden;\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    text-transform: uppercase;\n    flex-shrink: 0;\n    user-select: none;\n}\n\n.image {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n}\n\n.xs {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm {\n    width: 32px;\n    height: 32px;\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    width: 40px;\n    height: 40px;\n    font-size: var(--tempest-text-base);\n}\n\n.lg {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-xl);\n}\n\n.xl {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-3xl);\n}\n\n.status {\n    position: relative;\n}\n\n.dot {\n    position: absolute;\n    bottom: 0;\n    right: 0;\n    width: 28%;\n    height: 28%;\n    border-radius: 50%;\n    border: 2px solid var(--tempest-bg);\n}\n\n.dot.online {\n    background-color: var(--tempest-success-solid);\n}\n\n.dot.offline {\n    background-color: var(--tempest-text-subtle);\n}\n\n.dot.busy {\n    background-color: var(--tempest-danger-solid);\n}\n"],"mappings":";"}

package/dist/components/Avatar/Avatar.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.module.js","names":[],"sources":["../../../src/components/Avatar/Avatar.module.css"],"sourcesContent":[".avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n    overflow: hidden;\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    text-transform: uppercase;\n    flex-shrink: 0;\n    user-select: none;\n}\n\n.image {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n}\n\n.xs {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm {\n    width: 32px;\n    height: 32px;\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    width: 40px;\n    height: 40px;\n    font-size: var(--tempest-text-base);\n}\n\n.lg {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-xl);\n}\n\n.xl {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-3xl);\n}\n\n.status {\n    position: relative;\n}\n\n.dot {\n    position: absolute;\n    bottom: 0;\n    right: 0;\n    width: 28%;\n    height: 28%;\n    border-radius: 50%;\n    border: 2px solid var(--tempest-bg);\n}\n\n.dot.online {\n    background-color: var(--tempest-success-solid);\n}\n\n.dot.offline {\n    background-color: var(--tempest-text-subtle);\n}\n\n.dot.busy {\n    background-color: var(--tempest-danger-solid);\n}\n"],"mappings":";"}
+{"version":3,"file":"Avatar.module.js","names":["avatar","image","xs","sm","md","lg","xl","status","dot","online","offline","busy","Avatar_module_default"],"sources":["../../../src/components/Avatar/Avatar.module.css"],"sourcesContent":[".avatar {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n    overflow: hidden;\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    text-transform: uppercase;\n    flex-shrink: 0;\n    user-select: none;\n}\n\n.image {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n}\n\n.xs {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm {\n    width: 32px;\n    height: 32px;\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    width: 40px;\n    height: 40px;\n    font-size: var(--tempest-text-base);\n}\n\n.lg {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-xl);\n}\n\n.xl {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-3xl);\n}\n\n.status {\n    position: relative;\n}\n\n.dot {\n    position: absolute;\n    bottom: 0;\n    right: 0;\n    width: 28%;\n    height: 28%;\n    border-radius: 50%;\n    border: 2px solid var(--tempest-bg);\n}\n\n.dot.online {\n    background-color: var(--tempest-success-solid);\n}\n\n.dot.offline {\n    background-color: var(--tempest-text-subtle);\n}\n\n.dot.busy {\n    background-color: var(--tempest-danger-solid);\n}\n"],"mappings":";"}

package/dist/components/AvatarGroup/AvatarGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.cjs","names":[],"sources":["../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import { cn } from \"@/utils/cn\";\nimport { Avatar } from \"../Avatar\";\nimport type { AvatarSize } from \"../Avatar\";\nimport styles from \"./AvatarGroup.module.css\";\n\n/** One participant of the group. */\nexport interface AvatarGroupItem {\n    /** Image URL. Falls back to initials from `name`. */\n    src?: string;\n    /** Full name — drives the initials and the accessible label. */\n    name: string;\n}\n\nexport interface AvatarGroupProps {\n    items: AvatarGroupItem[];\n    /** How many avatars to show before collapsing into `+N`. Default `4`. */\n    max?: number;\n    size?: AvatarSize;\n    /** Accessible name of the group, e.g. `\"Participantes\"`. */\n    label?: string;\n    /**\n     * Called when the `+N` chip is activated — a natural hook for \"see all\n     * participants\". Without it the chip is plain text and not focusable.\n     */\n    onOverflowClick?: () => void;\n    className?: string;\n}\n\n/**\n * Overlapping row of avatars with a `+N` overflow chip — participants of a\n * meeting, assignees of a task, members of a team.\n *\n * The whole row is one `role=\"group\"` with a single accessible name, and each\n * avatar's name is exposed as its label. That is deliberate: announcing seven\n * separate images with no relation between them is noise, and the overflow chip\n * carries the remaining count so the total is never hidden from a screen reader.\n *\n * @example\n * ```tsx\n * <AvatarGroup\n *   label=\"Participantes\"\n *   max={3}\n *   items={[\n *     { name: \"Ada Lovelace\", src: ada },\n *     { name: \"Grace Hopper\" },\n *     { name: \"Alan Turing\" },\n *     { name: \"Edsger Dijkstra\" },\n *   ]}\n *   onOverflowClick={() => setDrawerOpen(true)}\n * />\n * ```\n */\nexport function AvatarGroup({\n    items,\n    max = 4,\n    size = \"md\",\n    label,\n    onOverflowClick,\n    className,\n}: AvatarGroupProps) {\n    const limit = Math.max(0, max);\n    const visible = items.slice(0, limit);\n    const overflow = items.length - visible.length;\n\n    return (\n        <div role=\"group\" aria-label={label} className={cn(styles.group, styles[size], className)}>\n            {visible.map((item, index) => (\n                <span key={`${item.name}-${index}`} className={styles.slot}>\n                    <Avatar src={item.src} name={item.name} alt={item.name} size={size} />\n                </span>\n            ))}\n\n            {overflow > 0 ? (\n                <span className={styles.slot}>\n                    {onOverflowClick ? (\n                        <button\n                            type=\"button\"\n                            className={cn(styles.overflow, styles.overflowButton)}\n                            aria-label={`${overflow} more`}\n                            onClick={onOverflowClick}\n                        >\n                            +{overflow}\n                        </button>\n                    ) : (\n                        <span className={styles.overflow} aria-label={`${overflow} more`}>\n                            +{overflow}\n                        </span>\n                    )}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"iJAoDA,SAAgB,EAAY,CACxB,QACA,MAAM,EACN,OAAO,KACP,QACA,kBACA,aACiB,CACjB,IAAM,EAAQ,KAAK,IAAI,EAAG,CAAG,EACvB,EAAU,EAAM,MAAM,EAAG,CAAK,EAC9B,EAAW,EAAM,OAAS,EAAQ,OAExC,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,KAAK,QAAQ,aAAY,EAAO,UAAW,EAAA,GAAG,EAAA,QAAO,MAAO,EAAA,QAAO,GAAO,CAAS,EAAxF,SAAA,CACK,EAAQ,KAAK,EAAM,KAChB,EAAA,EAAA,IAAA,CAAC,OAAD,CAAoC,UAAW,EAAA,QAAO,KAClD,UAAA,EAAA,EAAA,IAAA,CAAC,EAAA,OAAD,CAAQ,IAAK,EAAK,IAAK,KAAM,EAAK,KAAM,IAAK,EAAK,KAAY,MAAO,CAAA,CACnE,EAFK,GAAG,EAAK,KAAK,GAAG,GAErB,CACT,EAEA,EAAW,GACR,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KACnB,SAAA,GACG,EAAA,EAAA,KAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,GAAG,EAAA,QAAO,SAAU,EAAA,QAAO,cAAc,EACpD,aAAY,GAAG,EAAS,OACxB,QAAS,EAJb,SAAA,CAKC,IACK,CACE,CAER,CAAA,GAAA,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,SAAU,aAAY,GAAG,EAAS,OAA1D,SAAA,CAAkE,IAC5D,CACA,GAER,CAAA,EACN,IACH,GAEb"}
+{"version":3,"file":"AvatarGroup.cjs","names":["cn","styles","Avatar","require_cn","require_Avatar","require_AvatarGroup_module","react_jsx_runtime","AvatarGroup","limit","max","visible","items","overflow","label","size","className","item","index","onOverflowClick"],"sources":["../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import { cn } from \"@/utils/cn\";\nimport { Avatar } from \"../Avatar\";\nimport type { AvatarSize } from \"../Avatar\";\nimport styles from \"./AvatarGroup.module.css\";\n\n/** One participant of the group. */\nexport interface AvatarGroupItem {\n    /** Image URL. Falls back to initials from `name`. */\n    src?: string;\n    /** Full name — drives the initials and the accessible label. */\n    name: string;\n}\n\nexport interface AvatarGroupProps {\n    items: AvatarGroupItem[];\n    /** How many avatars to show before collapsing into `+N`. Default `4`. */\n    max?: number;\n    size?: AvatarSize;\n    /** Accessible name of the group, e.g. `\"Participantes\"`. */\n    label?: string;\n    /**\n     * Called when the `+N` chip is activated — a natural hook for \"see all\n     * participants\". Without it the chip is plain text and not focusable.\n     */\n    onOverflowClick?: () => void;\n    className?: string;\n}\n\n/**\n * Overlapping row of avatars with a `+N` overflow chip — participants of a\n * meeting, assignees of a task, members of a team.\n *\n * The whole row is one `role=\"group\"` with a single accessible name, and each\n * avatar's name is exposed as its label. That is deliberate: announcing seven\n * separate images with no relation between them is noise, and the overflow chip\n * carries the remaining count so the total is never hidden from a screen reader.\n *\n * @example\n * ```tsx\n * <AvatarGroup\n *   label=\"Participantes\"\n *   max={3}\n *   items={[\n *     { name: \"Ada Lovelace\", src: ada },\n *     { name: \"Grace Hopper\" },\n *     { name: \"Alan Turing\" },\n *     { name: \"Edsger Dijkstra\" },\n *   ]}\n *   onOverflowClick={() => setDrawerOpen(true)}\n * />\n * ```\n */\nexport function AvatarGroup({\n    items,\n    max = 4,\n    size = \"md\",\n    label,\n    onOverflowClick,\n    className,\n}: AvatarGroupProps) {\n    const limit = Math.max(0, max);\n    const visible = items.slice(0, limit);\n    const overflow = items.length - visible.length;\n\n    return (\n        <div role=\"group\" aria-label={label} className={cn(styles.group, styles[size], className)}>\n            {visible.map((item, index) => (\n                <span key={`${item.name}-${index}`} className={styles.slot}>\n                    <Avatar src={item.src} name={item.name} alt={item.name} size={size} />\n                </span>\n            ))}\n\n            {overflow > 0 ? (\n                <span className={styles.slot}>\n                    {onOverflowClick ? (\n                        <button\n                            type=\"button\"\n                            className={cn(styles.overflow, styles.overflowButton)}\n                            aria-label={`${overflow} more`}\n                            onClick={onOverflowClick}\n                        >\n                            +{overflow}\n                        </button>\n                    ) : (\n                        <span className={styles.overflow} aria-label={`${overflow} more`}>\n                            +{overflow}\n                        </span>\n                    )}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"A,iJAoDA,SAAgBO,EAAY,CACxB,QACA,MAAM,EACN,OAAO,KACP,QACA,kBACA,aACiB,CACjB,IAAMC,EAAQ,KAAK,IAAI,EAAGC,CAAG,EACvBC,EAAUC,EAAM,MAAM,EAAGH,CAAK,EAC9BI,EAAWD,EAAM,OAASD,EAAQ,OAExC,OACI,EAAAJ,EAAA,KAAA,CAAC,MAAD,CAAK,KAAK,QAAQ,aAAYO,EAAO,UAAWb,EAAAA,GAAGC,EAAAA,QAAO,MAAOA,EAAAA,QAAOa,GAAOC,CAAS,EAAxF,SAAA,CACKL,EAAQ,KAAK,EAAM,KAChB,EAAAJ,EAAA,IAAA,CAAC,OAAD,CAAoC,UAAWL,EAAAA,QAAO,KAClD,UAAA,EAAAK,EAAA,IAAA,CAACJ,EAAAA,OAAD,CAAQ,IAAKc,EAAK,IAAK,KAAMA,EAAK,KAAM,IAAKA,EAAK,KAAY,MAAO,CAAA,CACnE,EAFK,GAAGA,EAAK,KAAK,GAAGC,GAErB,CACT,EAEAL,EAAW,GACR,EAAAN,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWL,EAAAA,QAAO,KACnB,SAAAiB,GACG,EAAAZ,EAAA,KAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAWN,EAAAA,GAAGC,EAAAA,QAAO,SAAUA,EAAAA,QAAO,cAAc,EACpD,aAAY,GAAGW,EAAS,OACxB,QAASM,EAJb,SAAA,CAKC,IACKN,CACE,CAER,CAAA,GAAA,EAAAN,EAAA,KAAA,CAAC,OAAD,CAAM,UAAWL,EAAAA,QAAO,SAAU,aAAY,GAAGW,EAAS,OAA1D,SAAA,CAAkE,IAC5DA,CACA,C,EAER,CAAA,EACN,IACH,C,EAEb,C"}

package/dist/components/AvatarGroup/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","names":[],"sources":["../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import { cn } from \"@/utils/cn\";\nimport { Avatar } from \"../Avatar\";\nimport type { AvatarSize } from \"../Avatar\";\nimport styles from \"./AvatarGroup.module.css\";\n\n/** One participant of the group. */\nexport interface AvatarGroupItem {\n    /** Image URL. Falls back to initials from `name`. */\n    src?: string;\n    /** Full name — drives the initials and the accessible label. */\n    name: string;\n}\n\nexport interface AvatarGroupProps {\n    items: AvatarGroupItem[];\n    /** How many avatars to show before collapsing into `+N`. Default `4`. */\n    max?: number;\n    size?: AvatarSize;\n    /** Accessible name of the group, e.g. `\"Participantes\"`. */\n    label?: string;\n    /**\n     * Called when the `+N` chip is activated — a natural hook for \"see all\n     * participants\". Without it the chip is plain text and not focusable.\n     */\n    onOverflowClick?: () => void;\n    className?: string;\n}\n\n/**\n * Overlapping row of avatars with a `+N` overflow chip — participants of a\n * meeting, assignees of a task, members of a team.\n *\n * The whole row is one `role=\"group\"` with a single accessible name, and each\n * avatar's name is exposed as its label. That is deliberate: announcing seven\n * separate images with no relation between them is noise, and the overflow chip\n * carries the remaining count so the total is never hidden from a screen reader.\n *\n * @example\n * ```tsx\n * <AvatarGroup\n *   label=\"Participantes\"\n *   max={3}\n *   items={[\n *     { name: \"Ada Lovelace\", src: ada },\n *     { name: \"Grace Hopper\" },\n *     { name: \"Alan Turing\" },\n *     { name: \"Edsger Dijkstra\" },\n *   ]}\n *   onOverflowClick={() => setDrawerOpen(true)}\n * />\n * ```\n */\nexport function AvatarGroup({\n    items,\n    max = 4,\n    size = \"md\",\n    label,\n    onOverflowClick,\n    className,\n}: AvatarGroupProps) {\n    const limit = Math.max(0, max);\n    const visible = items.slice(0, limit);\n    const overflow = items.length - visible.length;\n\n    return (\n        <div role=\"group\" aria-label={label} className={cn(styles.group, styles[size], className)}>\n            {visible.map((item, index) => (\n                <span key={`${item.name}-${index}`} className={styles.slot}>\n                    <Avatar src={item.src} name={item.name} alt={item.name} size={size} />\n                </span>\n            ))}\n\n            {overflow > 0 ? (\n                <span className={styles.slot}>\n                    {onOverflowClick ? (\n                        <button\n                            type=\"button\"\n                            className={cn(styles.overflow, styles.overflowButton)}\n                            aria-label={`${overflow} more`}\n                            onClick={onOverflowClick}\n                        >\n                            +{overflow}\n                        </button>\n                    ) : (\n                        <span className={styles.overflow} aria-label={`${overflow} more`}>\n                            +{overflow}\n                        </span>\n                    )}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAoDA,SAAgB,EAAY,EACxB,UACA,SAAM,GACN,UAAO,MACP,UACA,oBACA,gBACiB;CACjB,IAAM,IAAQ,KAAK,IAAI,GAAG,CAAG,GACvB,IAAU,EAAM,MAAM,GAAG,CAAK,GAC9B,IAAW,EAAM,SAAS,EAAQ;CAExC,OACI,kBAAC,OAAD;EAAK,MAAK;EAAQ,cAAY;EAAO,WAAW,EAAG,EAAO,OAAO,EAAO,IAAO,CAAS;EAAxF,UAAA,CACK,EAAQ,KAAK,GAAM,MAChB,kBAAC,QAAD;GAAoC,WAAW,EAAO;GAClD,UAAA,kBAAC,GAAD;IAAQ,KAAK,EAAK;IAAK,MAAM,EAAK;IAAM,KAAK,EAAK;IAAY;GAAO,CAAA;EACnE,GAFK,GAAG,EAAK,KAAK,GAAG,GAErB,CACT,GAEA,IAAW,IACR,kBAAC,QAAD;GAAM,WAAW,EAAO;GACnB,UAAA,IACG,kBAAC,UAAD;IACI,MAAK;IACL,WAAW,EAAG,EAAO,UAAU,EAAO,cAAc;IACpD,cAAY,GAAG,EAAS;IACxB,SAAS;IAJb,UAAA,CAKC,KACK,CACE;GAER,CAAA,IAAA,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAU,cAAY,GAAG,EAAS;IAA1D,UAAA,CAAkE,KAC5D,CACA;;EAER,CAAA,IACN,IACH;;AAEb"}
+{"version":3,"file":"AvatarGroup.js","names":["styles","AvatarGroup_module_default","AvatarGroup","limit","max","visible","items","overflow","label","cn","size","className","Avatar","item","index","onOverflowClick"],"sources":["../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import { cn } from \"@/utils/cn\";\nimport { Avatar } from \"../Avatar\";\nimport type { AvatarSize } from \"../Avatar\";\nimport styles from \"./AvatarGroup.module.css\";\n\n/** One participant of the group. */\nexport interface AvatarGroupItem {\n    /** Image URL. Falls back to initials from `name`. */\n    src?: string;\n    /** Full name — drives the initials and the accessible label. */\n    name: string;\n}\n\nexport interface AvatarGroupProps {\n    items: AvatarGroupItem[];\n    /** How many avatars to show before collapsing into `+N`. Default `4`. */\n    max?: number;\n    size?: AvatarSize;\n    /** Accessible name of the group, e.g. `\"Participantes\"`. */\n    label?: string;\n    /**\n     * Called when the `+N` chip is activated — a natural hook for \"see all\n     * participants\". Without it the chip is plain text and not focusable.\n     */\n    onOverflowClick?: () => void;\n    className?: string;\n}\n\n/**\n * Overlapping row of avatars with a `+N` overflow chip — participants of a\n * meeting, assignees of a task, members of a team.\n *\n * The whole row is one `role=\"group\"` with a single accessible name, and each\n * avatar's name is exposed as its label. That is deliberate: announcing seven\n * separate images with no relation between them is noise, and the overflow chip\n * carries the remaining count so the total is never hidden from a screen reader.\n *\n * @example\n * ```tsx\n * <AvatarGroup\n *   label=\"Participantes\"\n *   max={3}\n *   items={[\n *     { name: \"Ada Lovelace\", src: ada },\n *     { name: \"Grace Hopper\" },\n *     { name: \"Alan Turing\" },\n *     { name: \"Edsger Dijkstra\" },\n *   ]}\n *   onOverflowClick={() => setDrawerOpen(true)}\n * />\n * ```\n */\nexport function AvatarGroup({\n    items,\n    max = 4,\n    size = \"md\",\n    label,\n    onOverflowClick,\n    className,\n}: AvatarGroupProps) {\n    const limit = Math.max(0, max);\n    const visible = items.slice(0, limit);\n    const overflow = items.length - visible.length;\n\n    return (\n        <div role=\"group\" aria-label={label} className={cn(styles.group, styles[size], className)}>\n            {visible.map((item, index) => (\n                <span key={`${item.name}-${index}`} className={styles.slot}>\n                    <Avatar src={item.src} name={item.name} alt={item.name} size={size} />\n                </span>\n            ))}\n\n            {overflow > 0 ? (\n                <span className={styles.slot}>\n                    {onOverflowClick ? (\n                        <button\n                            type=\"button\"\n                            className={cn(styles.overflow, styles.overflowButton)}\n                            aria-label={`${overflow} more`}\n                            onClick={onOverflowClick}\n                        >\n                            +{overflow}\n                        </button>\n                    ) : (\n                        <span className={styles.overflow} aria-label={`${overflow} more`}>\n                            +{overflow}\n                        </span>\n                    )}\n                </span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAoDA,SAAgBE,EAAY,EACxB,UACA,SAAM,GACN,UAAO,MACP,UACA,oBACA,gBACiB;CACjB,IAAMC,IAAQ,KAAK,IAAI,GAAGC,CAAG,GACvBC,IAAUC,EAAM,MAAM,GAAGH,CAAK,GAC9BI,IAAWD,EAAM,SAASD,EAAQ;CAExC,OACI,kBAAC,OAAD;EAAK,MAAK;EAAQ,cAAYG;EAAO,WAAWC,EAAGT,EAAO,OAAOA,EAAOU,IAAOC,CAAS;EAAxF,UAAA,CACKN,EAAQ,KAAK,GAAM,MAChB,kBAAC,QAAD;GAAoC,WAAWL,EAAO;GAClD,UAAA,kBAACY,GAAD;IAAQ,KAAKC,EAAK;IAAK,MAAMA,EAAK;IAAM,KAAKA,EAAK;IAAY;GAAO,CAAA;EACnE,GAFK,GAAGA,EAAK,KAAK,GAAGC,GAErB,CACT,GAEAP,IAAW,IACR,kBAAC,QAAD;GAAM,WAAWP,EAAO;GACnB,UAAAe,IACG,kBAAC,UAAD;IACI,MAAK;IACL,WAAWN,EAAGT,EAAO,UAAUA,EAAO,cAAc;IACpD,cAAY,GAAGO,EAAS;IACxB,SAASQ;IAJb,UAAA,CAKC,KACKR,CACE;GAER,CAAA,IAAA,kBAAC,QAAD;IAAM,WAAWP,EAAO;IAAU,cAAY,GAAGO,EAAS;IAA1D,UAAA,CAAkE,KAC5DA,CACA;;EAER,CAAA,IACN,IACH;;AAEb"}

package/dist/components/AvatarGroup/AvatarGroup.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.module.cjs","names":[],"sources":["../../../src/components/AvatarGroup/AvatarGroup.module.css"],"sourcesContent":[".group {\n    display: inline-flex;\n    align-items: center;\n}\n\n/**\n * Each slot pulls the next avatar over the previous one. The overlap is a\n * fraction of the avatar size so every size keeps the same proportion.\n */\n.slot {\n    display: inline-flex;\n    border-radius: var(--tempest-radius-full);\n    box-shadow: 0 0 0 2px var(--tempest-bg);\n}\n\n.slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.xs .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -8px);\n}\n\n.sm .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.md .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -12px);\n}\n\n.lg .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -16px);\n}\n\n.xl .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -22px);\n}\n\n.overflow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    width: 40px;\n    height: 40px;\n    border: 0;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    font-variant-numeric: tabular-nums;\n}\n\n.xs .overflow {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm .overflow {\n    width: 32px;\n    height: 32px;\n}\n\n.lg .overflow {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-sm);\n}\n\n.xl .overflow {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-base);\n}\n\n.overflowButton {\n    cursor: pointer;\n    transition: background-color var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.overflowButton:hover {\n    background-color: var(--tempest-border-strong);\n    color: var(--tempest-text);\n}\n\n.overflowButton:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .overflowButton {\n        transition: none;\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"AvatarGroup.module.cjs","names":["group","slot","xs","sm","md","lg","xl","overflow","overflowButton","AvatarGroup_module_default"],"sources":["../../../src/components/AvatarGroup/AvatarGroup.module.css"],"sourcesContent":[".group {\n    display: inline-flex;\n    align-items: center;\n}\n\n/**\n * Each slot pulls the next avatar over the previous one. The overlap is a\n * fraction of the avatar size so every size keeps the same proportion.\n */\n.slot {\n    display: inline-flex;\n    border-radius: var(--tempest-radius-full);\n    box-shadow: 0 0 0 2px var(--tempest-bg);\n}\n\n.slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.xs .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -8px);\n}\n\n.sm .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.md .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -12px);\n}\n\n.lg .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -16px);\n}\n\n.xl .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -22px);\n}\n\n.overflow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    width: 40px;\n    height: 40px;\n    border: 0;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    font-variant-numeric: tabular-nums;\n}\n\n.xs .overflow {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm .overflow {\n    width: 32px;\n    height: 32px;\n}\n\n.lg .overflow {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-sm);\n}\n\n.xl .overflow {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-base);\n}\n\n.overflowButton {\n    cursor: pointer;\n    transition: background-color var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.overflowButton:hover {\n    background-color: var(--tempest-border-strong);\n    color: var(--tempest-text);\n}\n\n.overflowButton:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .overflowButton {\n        transition: none;\n    }\n}\n"],"mappings":";"}

package/dist/components/AvatarGroup/AvatarGroup.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.module.js","names":[],"sources":["../../../src/components/AvatarGroup/AvatarGroup.module.css"],"sourcesContent":[".group {\n    display: inline-flex;\n    align-items: center;\n}\n\n/**\n * Each slot pulls the next avatar over the previous one. The overlap is a\n * fraction of the avatar size so every size keeps the same proportion.\n */\n.slot {\n    display: inline-flex;\n    border-radius: var(--tempest-radius-full);\n    box-shadow: 0 0 0 2px var(--tempest-bg);\n}\n\n.slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.xs .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -8px);\n}\n\n.sm .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.md .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -12px);\n}\n\n.lg .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -16px);\n}\n\n.xl .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -22px);\n}\n\n.overflow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    width: 40px;\n    height: 40px;\n    border: 0;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    font-variant-numeric: tabular-nums;\n}\n\n.xs .overflow {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm .overflow {\n    width: 32px;\n    height: 32px;\n}\n\n.lg .overflow {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-sm);\n}\n\n.xl .overflow {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-base);\n}\n\n.overflowButton {\n    cursor: pointer;\n    transition: background-color var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.overflowButton:hover {\n    background-color: var(--tempest-border-strong);\n    color: var(--tempest-text);\n}\n\n.overflowButton:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .overflowButton {\n        transition: none;\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"AvatarGroup.module.js","names":["group","slot","xs","sm","md","lg","xl","overflow","overflowButton","AvatarGroup_module_default"],"sources":["../../../src/components/AvatarGroup/AvatarGroup.module.css"],"sourcesContent":[".group {\n    display: inline-flex;\n    align-items: center;\n}\n\n/**\n * Each slot pulls the next avatar over the previous one. The overlap is a\n * fraction of the avatar size so every size keeps the same proportion.\n */\n.slot {\n    display: inline-flex;\n    border-radius: var(--tempest-radius-full);\n    box-shadow: 0 0 0 2px var(--tempest-bg);\n}\n\n.slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.xs .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -8px);\n}\n\n.sm .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -10px);\n}\n\n.md .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -12px);\n}\n\n.lg .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -16px);\n}\n\n.xl .slot + .slot {\n    margin-inline-start: var(--tempest-avatar-overlap, -22px);\n}\n\n.overflow {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    box-sizing: border-box;\n    width: 40px;\n    height: 40px;\n    border: 0;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-surface-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    font-variant-numeric: tabular-nums;\n}\n\n.xs .overflow {\n    width: 24px;\n    height: 24px;\n    font-size: var(--tempest-text-2xs);\n}\n\n.sm .overflow {\n    width: 32px;\n    height: 32px;\n}\n\n.lg .overflow {\n    width: 56px;\n    height: 56px;\n    font-size: var(--tempest-text-sm);\n}\n\n.xl .overflow {\n    width: 80px;\n    height: 80px;\n    font-size: var(--tempest-text-base);\n}\n\n.overflowButton {\n    cursor: pointer;\n    transition: background-color var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.overflowButton:hover {\n    background-color: var(--tempest-border-strong);\n    color: var(--tempest-text);\n}\n\n.overflowButton:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .overflowButton {\n        transition: none;\n    }\n}\n"],"mappings":";"}

package/dist/components/Badge/Badge.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.cjs","names":[],"sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Badge.module.css\";\n\nexport type BadgeVariant = \"neutral\" | \"primary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\nexport type BadgeAppearance = \"soft\" | \"solid\" | \"outline\";\nexport type BadgeSize = \"sm\" | \"md\" | \"lg\";\nexport type BadgeShape = \"pill\" | \"square\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n    variant?: BadgeVariant;\n    /** Visual style: soft (default tinted bg), solid (filled), outline (bordered). */\n    appearance?: BadgeAppearance;\n    size?: BadgeSize;\n    /** Pill (default rounded) or square (slightly rounded). */\n    shape?: BadgeShape;\n    /** Renders a leading status dot in the badge color. */\n    dot?: boolean;\n}\n\n/**\n * Pill / square status badge.\n *\n * - `variant` picks the tone (neutral, primary, success, warning, danger, info).\n * - `appearance` picks the style (soft, solid, outline).\n * - `dot` prepends a status dot in the same tone.\n */\nexport function Badge({\n    variant = \"neutral\",\n    appearance = \"soft\",\n    size = \"md\",\n    shape = \"pill\",\n    dot = false,\n    className,\n    children,\n    ...props\n}: BadgeProps) {\n    return (\n        <span\n            className={cn(\n                styles.badge,\n                styles[variant],\n                appearance === \"solid\" && styles.solid,\n                appearance === \"outline\" && styles.outline,\n                styles[size],\n                shape === \"square\" && styles.square,\n                className,\n            )}\n            {...props}\n        >\n            {dot && <span className={styles.dot} aria-hidden />}\n            {children}\n        </span>\n    );\n}\n"],"mappings":"yGA2BA,SAAgB,EAAM,CAClB,UAAU,UACV,aAAa,OACb,OAAO,KACP,QAAQ,OACR,MAAM,GACN,YACA,WACA,GAAG,GACQ,CACX,OACI,EAAA,EAAA,KAAA,CAAC,OAAD,CACI,UAAW,EAAA,GACP,EAAA,QAAO,MACP,EAAA,QAAO,GACP,IAAe,SAAW,EAAA,QAAO,MACjC,IAAe,WAAa,EAAA,QAAO,QACnC,EAAA,QAAO,GACP,IAAU,UAAY,EAAA,QAAO,OAC7B,CACJ,EACA,GAAI,EAVR,SAAA,CAYK,IAAO,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,IAAK,cAAA,EAAa,CAAA,EACjD,CACC,GAEd"}
+{"version":3,"file":"Badge.cjs","names":["cn","styles","require_cn","require_Badge_module","react_jsx_runtime","Badge","props","variant","appearance","size","shape","className","dot","children"],"sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Badge.module.css\";\n\nexport type BadgeVariant = \"neutral\" | \"primary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\nexport type BadgeAppearance = \"soft\" | \"solid\" | \"outline\";\nexport type BadgeSize = \"sm\" | \"md\" | \"lg\";\nexport type BadgeShape = \"pill\" | \"square\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n    variant?: BadgeVariant;\n    /** Visual style: soft (default tinted bg), solid (filled), outline (bordered). */\n    appearance?: BadgeAppearance;\n    size?: BadgeSize;\n    /** Pill (default rounded) or square (slightly rounded). */\n    shape?: BadgeShape;\n    /** Renders a leading status dot in the badge color. */\n    dot?: boolean;\n}\n\n/**\n * Pill / square status badge.\n *\n * - `variant` picks the tone (neutral, primary, success, warning, danger, info).\n * - `appearance` picks the style (soft, solid, outline).\n * - `dot` prepends a status dot in the same tone.\n */\nexport function Badge({\n    variant = \"neutral\",\n    appearance = \"soft\",\n    size = \"md\",\n    shape = \"pill\",\n    dot = false,\n    className,\n    children,\n    ...props\n}: BadgeProps) {\n    return (\n        <span\n            className={cn(\n                styles.badge,\n                styles[variant],\n                appearance === \"solid\" && styles.solid,\n                appearance === \"outline\" && styles.outline,\n                styles[size],\n                shape === \"square\" && styles.square,\n                className,\n            )}\n            {...props}\n        >\n            {dot && <span className={styles.dot} aria-hidden />}\n            {children}\n        </span>\n    );\n}\n"],"mappings":"A,yGA2BA,SAAgBK,EAAM,CAClB,UAAU,UACV,aAAa,OACb,OAAO,KACP,QAAQ,OACR,MAAM,GACN,YACA,WACA,GAAGC,GACQ,CACX,OACI,EAAAF,EAAA,KAAA,CAAC,OAAD,CACI,UAAWJ,EAAAA,GACPC,EAAAA,QAAO,MACPA,EAAAA,QAAOM,GACPC,IAAe,SAAWP,EAAAA,QAAO,MACjCO,IAAe,WAAaP,EAAAA,QAAO,QACnCA,EAAAA,QAAOQ,GACPC,IAAU,UAAYT,EAAAA,QAAO,OAC7BU,CACJ,EACA,GAAIL,EAVR,SAAA,CAYKM,IAAO,EAAAR,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWH,EAAAA,QAAO,IAAK,cAAA,EAAa,CAAA,EACjDY,CACC,C,EAEd,C"}

package/dist/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","names":[],"sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Badge.module.css\";\n\nexport type BadgeVariant = \"neutral\" | \"primary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\nexport type BadgeAppearance = \"soft\" | \"solid\" | \"outline\";\nexport type BadgeSize = \"sm\" | \"md\" | \"lg\";\nexport type BadgeShape = \"pill\" | \"square\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n    variant?: BadgeVariant;\n    /** Visual style: soft (default tinted bg), solid (filled), outline (bordered). */\n    appearance?: BadgeAppearance;\n    size?: BadgeSize;\n    /** Pill (default rounded) or square (slightly rounded). */\n    shape?: BadgeShape;\n    /** Renders a leading status dot in the badge color. */\n    dot?: boolean;\n}\n\n/**\n * Pill / square status badge.\n *\n * - `variant` picks the tone (neutral, primary, success, warning, danger, info).\n * - `appearance` picks the style (soft, solid, outline).\n * - `dot` prepends a status dot in the same tone.\n */\nexport function Badge({\n    variant = \"neutral\",\n    appearance = \"soft\",\n    size = \"md\",\n    shape = \"pill\",\n    dot = false,\n    className,\n    children,\n    ...props\n}: BadgeProps) {\n    return (\n        <span\n            className={cn(\n                styles.badge,\n                styles[variant],\n                appearance === \"solid\" && styles.solid,\n                appearance === \"outline\" && styles.outline,\n                styles[size],\n                shape === \"square\" && styles.square,\n                className,\n            )}\n            {...props}\n        >\n            {dot && <span className={styles.dot} aria-hidden />}\n            {children}\n        </span>\n    );\n}\n"],"mappings":";;;;AA2BA,SAAgB,EAAM,EAClB,aAAU,WACV,gBAAa,QACb,UAAO,MACP,WAAQ,QACR,SAAM,IACN,cACA,aACA,GAAG,KACQ;CACX,OACI,kBAAC,QAAD;EACI,WAAW,EACP,EAAO,OACP,EAAO,IACP,MAAe,WAAW,EAAO,OACjC,MAAe,aAAa,EAAO,SACnC,EAAO,IACP,MAAU,YAAY,EAAO,QAC7B,CACJ;EACA,GAAI;EAVR,UAAA,CAYK,KAAO,kBAAC,QAAD;GAAM,WAAW,EAAO;GAAK,eAAA;EAAa,CAAA,GACjD,CACC;;AAEd"}
+{"version":3,"file":"Badge.js","names":["styles","Badge_module_default","Badge","props","cn","variant","appearance","size","shape","className","dot","children"],"sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Badge.module.css\";\n\nexport type BadgeVariant = \"neutral\" | \"primary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\nexport type BadgeAppearance = \"soft\" | \"solid\" | \"outline\";\nexport type BadgeSize = \"sm\" | \"md\" | \"lg\";\nexport type BadgeShape = \"pill\" | \"square\";\n\nexport interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {\n    variant?: BadgeVariant;\n    /** Visual style: soft (default tinted bg), solid (filled), outline (bordered). */\n    appearance?: BadgeAppearance;\n    size?: BadgeSize;\n    /** Pill (default rounded) or square (slightly rounded). */\n    shape?: BadgeShape;\n    /** Renders a leading status dot in the badge color. */\n    dot?: boolean;\n}\n\n/**\n * Pill / square status badge.\n *\n * - `variant` picks the tone (neutral, primary, success, warning, danger, info).\n * - `appearance` picks the style (soft, solid, outline).\n * - `dot` prepends a status dot in the same tone.\n */\nexport function Badge({\n    variant = \"neutral\",\n    appearance = \"soft\",\n    size = \"md\",\n    shape = \"pill\",\n    dot = false,\n    className,\n    children,\n    ...props\n}: BadgeProps) {\n    return (\n        <span\n            className={cn(\n                styles.badge,\n                styles[variant],\n                appearance === \"solid\" && styles.solid,\n                appearance === \"outline\" && styles.outline,\n                styles[size],\n                shape === \"square\" && styles.square,\n                className,\n            )}\n            {...props}\n        >\n            {dot && <span className={styles.dot} aria-hidden />}\n            {children}\n        </span>\n    );\n}\n"],"mappings":";;;;AA2BA,SAAgBE,EAAM,EAClB,aAAU,WACV,gBAAa,QACb,UAAO,MACP,WAAQ,QACR,SAAM,IACN,cACA,aACA,GAAGC,KACQ;CACX,OACI,kBAAC,QAAD;EACI,WAAWC,EACPJ,EAAO,OACPA,EAAOK,IACPC,MAAe,WAAWN,EAAO,OACjCM,MAAe,aAAaN,EAAO,SACnCA,EAAOO,IACPC,MAAU,YAAYR,EAAO,QAC7BS,CACJ;EACA,GAAIN;EAVR,UAAA,CAYKO,KAAO,kBAAC,QAAD;GAAM,WAAWV,EAAO;GAAK,eAAA;EAAa,CAAA,GACjDW,CACC;;AAEd"}

package/dist/components/Badge/Badge.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.module.cjs","names":[],"sources":["../../../src/components/Badge/Badge.module.css"],"sourcesContent":[".badge {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: 2px var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-full);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-semibold);\n    line-height: var(--tempest-leading-snug);\n    letter-spacing: var(--tempest-tracking-normal);\n    white-space: nowrap;\n}\n\n/* ============================================================\n * Sizes\n * ============================================================ */\n.sm {\n    padding: 1px var(--tempest-space-2);\n    font-size: var(--tempest-text-2xs);\n}\n.md {\n    padding: 2px var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n.lg {\n    padding: 3px var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n/* ============================================================\n * Shapes — pill is the default (border-radius-full).\n * `square` flips to a small radius for chip-style badges.\n * ============================================================ */\n.square {\n    border-radius: var(--tempest-radius-sm);\n}\n\n/* ============================================================\n * Tone × Style matrix.\n * Soft (default) = tinted bg + colored fg.\n * Solid = filled colored bg + white fg.\n * Outline = transparent bg + colored fg + colored border.\n * ============================================================ */\n\n/* Neutral */\n.neutral {\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n}\n.neutral.solid {\n    background-color: var(--tempest-gray-700);\n    color: var(--tempest-neutral-on-solid);\n}\n.neutral.outline {\n    background-color: transparent;\n    color: var(--tempest-text);\n    border-color: var(--tempest-border-strong);\n}\n\n/* Success */\n.success {\n    background-color: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n}\n.success.solid {\n    background-color: var(--tempest-success-solid);\n    color: var(--tempest-success-on-solid);\n}\n.success.outline {\n    background-color: transparent;\n    color: var(--tempest-success);\n    border-color: var(--tempest-success-border);\n}\n\n/* Warning */\n.warning {\n    background-color: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n}\n.warning.solid {\n    background-color: var(--tempest-warning-solid);\n    color: var(--tempest-warning-on-solid);\n}\n.warning.outline {\n    background-color: transparent;\n    color: var(--tempest-warning);\n    border-color: var(--tempest-warning-border);\n}\n\n/* Danger */\n.danger {\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n.danger.solid {\n    background-color: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n}\n.danger.outline {\n    background-color: transparent;\n    color: var(--tempest-danger);\n    border-color: var(--tempest-danger-border);\n}\n\n/* Info */\n.info {\n    background-color: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n}\n.info.solid {\n    background-color: var(--tempest-info-solid);\n    color: var(--tempest-info-on-solid);\n}\n.info.outline {\n    background-color: transparent;\n    color: var(--tempest-info);\n    border-color: var(--tempest-info-border);\n}\n\n/* Primary */\n.primary {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n.primary.solid {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n.primary.outline {\n    background-color: transparent;\n    color: var(--tempest-primary);\n    border-color: var(--tempest-primary);\n}\n\n/* Status dot — small leading dot, color inherits from text. */\n.dot {\n    width: 6px;\n    height: 6px;\n    border-radius: var(--tempest-radius-full);\n    background-color: currentColor;\n    display: inline-block;\n    flex-shrink: 0;\n}\n"],"mappings":";"}
+{"version":3,"file":"Badge.module.cjs","names":["badge","sm","md","lg","square","neutral","solid","outline","success","warning","danger","info","primary","dot","Badge_module_default"],"sources":["../../../src/components/Badge/Badge.module.css"],"sourcesContent":[".badge {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: 2px var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-full);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-semibold);\n    line-height: var(--tempest-leading-snug);\n    letter-spacing: var(--tempest-tracking-normal);\n    white-space: nowrap;\n}\n\n/* ============================================================\n * Sizes\n * ============================================================ */\n.sm {\n    padding: 1px var(--tempest-space-2);\n    font-size: var(--tempest-text-2xs);\n}\n.md {\n    padding: 2px var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n.lg {\n    padding: 3px var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n/* ============================================================\n * Shapes — pill is the default (border-radius-full).\n * `square` flips to a small radius for chip-style badges.\n * ============================================================ */\n.square {\n    border-radius: var(--tempest-radius-sm);\n}\n\n/* ============================================================\n * Tone × Style matrix.\n * Soft (default) = tinted bg + colored fg.\n * Solid = filled colored bg + white fg.\n * Outline = transparent bg + colored fg + colored border.\n * ============================================================ */\n\n/* Neutral */\n.neutral {\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n}\n.neutral.solid {\n    background-color: var(--tempest-gray-700);\n    color: var(--tempest-neutral-on-solid);\n}\n.neutral.outline {\n    background-color: transparent;\n    color: var(--tempest-text);\n    border-color: var(--tempest-border-strong);\n}\n\n/* Success */\n.success {\n    background-color: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n}\n.success.solid {\n    background-color: var(--tempest-success-solid);\n    color: var(--tempest-success-on-solid);\n}\n.success.outline {\n    background-color: transparent;\n    color: var(--tempest-success);\n    border-color: var(--tempest-success-border);\n}\n\n/* Warning */\n.warning {\n    background-color: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n}\n.warning.solid {\n    background-color: var(--tempest-warning-solid);\n    color: var(--tempest-warning-on-solid);\n}\n.warning.outline {\n    background-color: transparent;\n    color: var(--tempest-warning);\n    border-color: var(--tempest-warning-border);\n}\n\n/* Danger */\n.danger {\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n.danger.solid {\n    background-color: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n}\n.danger.outline {\n    background-color: transparent;\n    color: var(--tempest-danger);\n    border-color: var(--tempest-danger-border);\n}\n\n/* Info */\n.info {\n    background-color: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n}\n.info.solid {\n    background-color: var(--tempest-info-solid);\n    color: var(--tempest-info-on-solid);\n}\n.info.outline {\n    background-color: transparent;\n    color: var(--tempest-info);\n    border-color: var(--tempest-info-border);\n}\n\n/* Primary */\n.primary {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n.primary.solid {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n.primary.outline {\n    background-color: transparent;\n    color: var(--tempest-primary);\n    border-color: var(--tempest-primary);\n}\n\n/* Status dot — small leading dot, color inherits from text. */\n.dot {\n    width: 6px;\n    height: 6px;\n    border-radius: var(--tempest-radius-full);\n    background-color: currentColor;\n    display: inline-block;\n    flex-shrink: 0;\n}\n"],"mappings":";"}

package/dist/components/Badge/Badge.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.module.js","names":[],"sources":["../../../src/components/Badge/Badge.module.css"],"sourcesContent":[".badge {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: 2px var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-full);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-semibold);\n    line-height: var(--tempest-leading-snug);\n    letter-spacing: var(--tempest-tracking-normal);\n    white-space: nowrap;\n}\n\n/* ============================================================\n * Sizes\n * ============================================================ */\n.sm {\n    padding: 1px var(--tempest-space-2);\n    font-size: var(--tempest-text-2xs);\n}\n.md {\n    padding: 2px var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n.lg {\n    padding: 3px var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n/* ============================================================\n * Shapes — pill is the default (border-radius-full).\n * `square` flips to a small radius for chip-style badges.\n * ============================================================ */\n.square {\n    border-radius: var(--tempest-radius-sm);\n}\n\n/* ============================================================\n * Tone × Style matrix.\n * Soft (default) = tinted bg + colored fg.\n * Solid = filled colored bg + white fg.\n * Outline = transparent bg + colored fg + colored border.\n * ============================================================ */\n\n/* Neutral */\n.neutral {\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n}\n.neutral.solid {\n    background-color: var(--tempest-gray-700);\n    color: var(--tempest-neutral-on-solid);\n}\n.neutral.outline {\n    background-color: transparent;\n    color: var(--tempest-text);\n    border-color: var(--tempest-border-strong);\n}\n\n/* Success */\n.success {\n    background-color: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n}\n.success.solid {\n    background-color: var(--tempest-success-solid);\n    color: var(--tempest-success-on-solid);\n}\n.success.outline {\n    background-color: transparent;\n    color: var(--tempest-success);\n    border-color: var(--tempest-success-border);\n}\n\n/* Warning */\n.warning {\n    background-color: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n}\n.warning.solid {\n    background-color: var(--tempest-warning-solid);\n    color: var(--tempest-warning-on-solid);\n}\n.warning.outline {\n    background-color: transparent;\n    color: var(--tempest-warning);\n    border-color: var(--tempest-warning-border);\n}\n\n/* Danger */\n.danger {\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n.danger.solid {\n    background-color: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n}\n.danger.outline {\n    background-color: transparent;\n    color: var(--tempest-danger);\n    border-color: var(--tempest-danger-border);\n}\n\n/* Info */\n.info {\n    background-color: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n}\n.info.solid {\n    background-color: var(--tempest-info-solid);\n    color: var(--tempest-info-on-solid);\n}\n.info.outline {\n    background-color: transparent;\n    color: var(--tempest-info);\n    border-color: var(--tempest-info-border);\n}\n\n/* Primary */\n.primary {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n.primary.solid {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n.primary.outline {\n    background-color: transparent;\n    color: var(--tempest-primary);\n    border-color: var(--tempest-primary);\n}\n\n/* Status dot — small leading dot, color inherits from text. */\n.dot {\n    width: 6px;\n    height: 6px;\n    border-radius: var(--tempest-radius-full);\n    background-color: currentColor;\n    display: inline-block;\n    flex-shrink: 0;\n}\n"],"mappings":";"}
+{"version":3,"file":"Badge.module.js","names":["badge","sm","md","lg","square","neutral","solid","outline","success","warning","danger","info","primary","dot","Badge_module_default"],"sources":["../../../src/components/Badge/Badge.module.css"],"sourcesContent":[".badge {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: 2px var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-full);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-semibold);\n    line-height: var(--tempest-leading-snug);\n    letter-spacing: var(--tempest-tracking-normal);\n    white-space: nowrap;\n}\n\n/* ============================================================\n * Sizes\n * ============================================================ */\n.sm {\n    padding: 1px var(--tempest-space-2);\n    font-size: var(--tempest-text-2xs);\n}\n.md {\n    padding: 2px var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n.lg {\n    padding: 3px var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n/* ============================================================\n * Shapes — pill is the default (border-radius-full).\n * `square` flips to a small radius for chip-style badges.\n * ============================================================ */\n.square {\n    border-radius: var(--tempest-radius-sm);\n}\n\n/* ============================================================\n * Tone × Style matrix.\n * Soft (default) = tinted bg + colored fg.\n * Solid = filled colored bg + white fg.\n * Outline = transparent bg + colored fg + colored border.\n * ============================================================ */\n\n/* Neutral */\n.neutral {\n    background-color: var(--tempest-surface-2);\n    color: var(--tempest-text);\n}\n.neutral.solid {\n    background-color: var(--tempest-gray-700);\n    color: var(--tempest-neutral-on-solid);\n}\n.neutral.outline {\n    background-color: transparent;\n    color: var(--tempest-text);\n    border-color: var(--tempest-border-strong);\n}\n\n/* Success */\n.success {\n    background-color: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n}\n.success.solid {\n    background-color: var(--tempest-success-solid);\n    color: var(--tempest-success-on-solid);\n}\n.success.outline {\n    background-color: transparent;\n    color: var(--tempest-success);\n    border-color: var(--tempest-success-border);\n}\n\n/* Warning */\n.warning {\n    background-color: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n}\n.warning.solid {\n    background-color: var(--tempest-warning-solid);\n    color: var(--tempest-warning-on-solid);\n}\n.warning.outline {\n    background-color: transparent;\n    color: var(--tempest-warning);\n    border-color: var(--tempest-warning-border);\n}\n\n/* Danger */\n.danger {\n    background-color: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n}\n.danger.solid {\n    background-color: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n}\n.danger.outline {\n    background-color: transparent;\n    color: var(--tempest-danger);\n    border-color: var(--tempest-danger-border);\n}\n\n/* Info */\n.info {\n    background-color: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n}\n.info.solid {\n    background-color: var(--tempest-info-solid);\n    color: var(--tempest-info-on-solid);\n}\n.info.outline {\n    background-color: transparent;\n    color: var(--tempest-info);\n    border-color: var(--tempest-info-border);\n}\n\n/* Primary */\n.primary {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n.primary.solid {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n.primary.outline {\n    background-color: transparent;\n    color: var(--tempest-primary);\n    border-color: var(--tempest-primary);\n}\n\n/* Status dot — small leading dot, color inherits from text. */\n.dot {\n    width: 6px;\n    height: 6px;\n    border-radius: var(--tempest-radius-full);\n    background-color: currentColor;\n    display: inline-block;\n    flex-shrink: 0;\n}\n"],"mappings":";"}

package/dist/components/Banner/Banner.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.cjs","names":[],"sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Banner.module.css\";\n\nexport type BannerVariant = \"info\" | \"success\" | \"warning\" | \"danger\";\n\nexport interface BannerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n    /** Visual variant. Default `\"info\"`. */\n    variant?: BannerVariant;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n    /** Optional title displayed before description. */\n    title?: ReactNode;\n    /** Optional action button rendered on the right side. */\n    action?: ReactNode;\n    /** Show a dismiss button on the right. */\n    dismissible?: boolean;\n    /** Callback fired when the dismiss button is clicked. */\n    onDismiss?: () => void;\n    children?: ReactNode;\n}\n\n/**\n * Top-of-page persistent notice. Use for environment indicators\n * (\"Você está em sandbox\"), maintenance windows, account warnings.\n * Different from `Alert` (inline near a field) and `Toast` (transient).\n *\n * @example\n * <Banner variant=\"warning\" dismissible onDismiss={() => setOpen(false)}>\n *     Sua assinatura expira em 3 dias.\n * </Banner>\n */\nexport function Banner({\n    variant = \"info\",\n    icon,\n    title,\n    action,\n    dismissible = false,\n    onDismiss,\n    className,\n    children,\n    ...props\n}: BannerProps) {\n    const [open, setOpen] = useState(true);\n    if (!open) return null;\n    return (\n        <div className={cn(styles.banner, styles[variant], className)} role=\"status\" {...props}>\n            {icon && <span className={styles.icon}>{icon}</span>}\n            <div className={styles.body}>\n                {title && <p className={styles.title}>{title}</p>}\n                {children && <p className={styles.description}>{children}</p>}\n            </div>\n            {action && <div className={styles.action}>{action}</div>}\n            {dismissible && (\n                <button\n                    type=\"button\"\n                    className={styles.close}\n                    aria-label=\"Fechar\"\n                    onClick={() => {\n                        setOpen(false);\n                        onDismiss?.();\n                    }}\n                >\n                    ×\n                </button>\n            )}\n        </div>\n    );\n}\n"],"mappings":"6HAiCA,SAAgB,EAAO,CACnB,UAAU,OACV,OACA,QACA,SACA,cAAc,GACd,YACA,YACA,WACA,GAAG,GACS,CACZ,GAAM,CAAC,EAAM,IAAA,EAAW,EAAA,SAAA,CAAS,EAAI,EAErC,OADK,GAED,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,OAAQ,EAAA,QAAO,GAAU,CAAS,EAAG,KAAK,SAAS,GAAI,EAAjF,SAAA,CACK,IAAQ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAO,SAAA,CAAW,CAAA,GACnD,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAvB,SAAA,CACK,IAAS,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAW,EAAA,QAAO,MAAQ,SAAA,CAAS,CAAA,EAC/C,IAAY,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAW,EAAA,QAAO,YAAc,UAAY,CAAA,CAC3D,IACJ,IAAU,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,OAAS,SAAA,CAAY,CAAA,EACtD,IACG,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,MAClB,aAAW,SACX,YAAe,CACX,EAAQ,EAAK,EACb,IAAY,CAChB,EACH,SAAA,GAEO,CAAA,CAEX,IAtBS,IAwBtB"}
+{"version":3,"file":"Banner.cjs","names":["useState","cn","styles","require_cn","require_Banner_module","react","react_jsx_runtime","Banner","props","open","setOpen","variant","className","icon","title","children","action","dismissible","onDismiss"],"sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Banner.module.css\";\n\nexport type BannerVariant = \"info\" | \"success\" | \"warning\" | \"danger\";\n\nexport interface BannerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n    /** Visual variant. Default `\"info\"`. */\n    variant?: BannerVariant;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n    /** Optional title displayed before description. */\n    title?: ReactNode;\n    /** Optional action button rendered on the right side. */\n    action?: ReactNode;\n    /** Show a dismiss button on the right. */\n    dismissible?: boolean;\n    /** Callback fired when the dismiss button is clicked. */\n    onDismiss?: () => void;\n    children?: ReactNode;\n}\n\n/**\n * Top-of-page persistent notice. Use for environment indicators\n * (\"Você está em sandbox\"), maintenance windows, account warnings.\n * Different from `Alert` (inline near a field) and `Toast` (transient).\n *\n * @example\n * <Banner variant=\"warning\" dismissible onDismiss={() => setOpen(false)}>\n *     Sua assinatura expira em 3 dias.\n * </Banner>\n */\nexport function Banner({\n    variant = \"info\",\n    icon,\n    title,\n    action,\n    dismissible = false,\n    onDismiss,\n    className,\n    children,\n    ...props\n}: BannerProps) {\n    const [open, setOpen] = useState(true);\n    if (!open) return null;\n    return (\n        <div className={cn(styles.banner, styles[variant], className)} role=\"status\" {...props}>\n            {icon && <span className={styles.icon}>{icon}</span>}\n            <div className={styles.body}>\n                {title && <p className={styles.title}>{title}</p>}\n                {children && <p className={styles.description}>{children}</p>}\n            </div>\n            {action && <div className={styles.action}>{action}</div>}\n            {dismissible && (\n                <button\n                    type=\"button\"\n                    className={styles.close}\n                    aria-label=\"Fechar\"\n                    onClick={() => {\n                        setOpen(false);\n                        onDismiss?.();\n                    }}\n                >\n                    ×\n                </button>\n            )}\n        </div>\n    );\n}\n"],"mappings":"A,6HAiCA,SAAgBO,EAAO,CACnB,UAAU,OACV,OACA,QACA,SACA,cAAc,GACd,YACA,YACA,WACA,GAAGC,GACS,CACZ,GAAM,CAACC,EAAMC,IAAA,EAAWV,EAAAA,SAAAA,CAAS,EAAI,EAErC,OADKS,GAED,EAAAH,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWL,EAAAA,GAAGC,EAAAA,QAAO,OAAQA,EAAAA,QAAOS,GAAUC,CAAS,EAAG,KAAK,SAAS,GAAIJ,EAAjF,SAAA,CACKK,IAAQ,EAAAP,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWJ,EAAAA,QAAO,KAAO,SAAAW,CAAW,CAAA,GACnD,EAAAP,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,QAAO,KAAvB,SAAA,CACKY,IAAS,EAAAR,EAAA,IAAA,CAAC,IAAD,CAAG,UAAWJ,EAAAA,QAAO,MAAQ,SAAAY,CAAS,CAAA,EAC/CC,IAAY,EAAAT,EAAA,IAAA,CAAC,IAAD,CAAG,UAAWJ,EAAAA,QAAO,YAAc,UAAY,CAAA,CAC3D,C,GACJc,IAAU,EAAAV,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,QAAO,OAAS,SAAAc,CAAY,CAAA,EACtDC,IACG,EAAAX,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAWJ,EAAAA,QAAO,MAClB,aAAW,SACX,YAAe,CACXQ,EAAQ,EAAK,EACbQ,IAAY,CAChB,EACH,SAAA,GAEO,CAAA,CAEX,C,GAtBS,IAwBtB,C"}

package/dist/components/Banner/Banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","names":[],"sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Banner.module.css\";\n\nexport type BannerVariant = \"info\" | \"success\" | \"warning\" | \"danger\";\n\nexport interface BannerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n    /** Visual variant. Default `\"info\"`. */\n    variant?: BannerVariant;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n    /** Optional title displayed before description. */\n    title?: ReactNode;\n    /** Optional action button rendered on the right side. */\n    action?: ReactNode;\n    /** Show a dismiss button on the right. */\n    dismissible?: boolean;\n    /** Callback fired when the dismiss button is clicked. */\n    onDismiss?: () => void;\n    children?: ReactNode;\n}\n\n/**\n * Top-of-page persistent notice. Use for environment indicators\n * (\"Você está em sandbox\"), maintenance windows, account warnings.\n * Different from `Alert` (inline near a field) and `Toast` (transient).\n *\n * @example\n * <Banner variant=\"warning\" dismissible onDismiss={() => setOpen(false)}>\n *     Sua assinatura expira em 3 dias.\n * </Banner>\n */\nexport function Banner({\n    variant = \"info\",\n    icon,\n    title,\n    action,\n    dismissible = false,\n    onDismiss,\n    className,\n    children,\n    ...props\n}: BannerProps) {\n    const [open, setOpen] = useState(true);\n    if (!open) return null;\n    return (\n        <div className={cn(styles.banner, styles[variant], className)} role=\"status\" {...props}>\n            {icon && <span className={styles.icon}>{icon}</span>}\n            <div className={styles.body}>\n                {title && <p className={styles.title}>{title}</p>}\n                {children && <p className={styles.description}>{children}</p>}\n            </div>\n            {action && <div className={styles.action}>{action}</div>}\n            {dismissible && (\n                <button\n                    type=\"button\"\n                    className={styles.close}\n                    aria-label=\"Fechar\"\n                    onClick={() => {\n                        setOpen(false);\n                        onDismiss?.();\n                    }}\n                >\n                    ×\n                </button>\n            )}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAiCA,SAAgB,EAAO,EACnB,aAAU,QACV,SACA,UACA,WACA,iBAAc,IACd,cACA,cACA,aACA,GAAG,KACS;CACZ,IAAM,CAAC,GAAM,KAAW,EAAS,EAAI;CAErC,OADK,IAED,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,QAAQ,EAAO,IAAU,CAAS;EAAG,MAAK;EAAS,GAAI;EAAjF,UAAA;GACK,KAAQ,kBAAC,QAAD;IAAM,WAAW,EAAO;IAAO,UAAA;GAAW,CAAA;GACnD,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAvB,UAAA,CACK,KAAS,kBAAC,KAAD;KAAG,WAAW,EAAO;KAAQ,UAAA;IAAS,CAAA,GAC/C,KAAY,kBAAC,KAAD;KAAG,WAAW,EAAO;KAAc;IAAY,CAAA,CAC3D;;GACJ,KAAU,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAS,UAAA;GAAY,CAAA;GACtD,KACG,kBAAC,UAAD;IACI,MAAK;IACL,WAAW,EAAO;IAClB,cAAW;IACX,eAAe;KAEX,AADA,EAAQ,EAAK,GACb,IAAY;IAChB;IACH,UAAA;GAEO,CAAA;EAEX;MAtBS;AAwBtB"}
+{"version":3,"file":"Banner.js","names":["styles","Banner_module_default","Banner","props","open","setOpen","useState","cn","variant","className","icon","title","children","action","dismissible","onDismiss"],"sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Banner.module.css\";\n\nexport type BannerVariant = \"info\" | \"success\" | \"warning\" | \"danger\";\n\nexport interface BannerProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n    /** Visual variant. Default `\"info\"`. */\n    variant?: BannerVariant;\n    /** Optional leading icon. */\n    icon?: ReactNode;\n    /** Optional title displayed before description. */\n    title?: ReactNode;\n    /** Optional action button rendered on the right side. */\n    action?: ReactNode;\n    /** Show a dismiss button on the right. */\n    dismissible?: boolean;\n    /** Callback fired when the dismiss button is clicked. */\n    onDismiss?: () => void;\n    children?: ReactNode;\n}\n\n/**\n * Top-of-page persistent notice. Use for environment indicators\n * (\"Você está em sandbox\"), maintenance windows, account warnings.\n * Different from `Alert` (inline near a field) and `Toast` (transient).\n *\n * @example\n * <Banner variant=\"warning\" dismissible onDismiss={() => setOpen(false)}>\n *     Sua assinatura expira em 3 dias.\n * </Banner>\n */\nexport function Banner({\n    variant = \"info\",\n    icon,\n    title,\n    action,\n    dismissible = false,\n    onDismiss,\n    className,\n    children,\n    ...props\n}: BannerProps) {\n    const [open, setOpen] = useState(true);\n    if (!open) return null;\n    return (\n        <div className={cn(styles.banner, styles[variant], className)} role=\"status\" {...props}>\n            {icon && <span className={styles.icon}>{icon}</span>}\n            <div className={styles.body}>\n                {title && <p className={styles.title}>{title}</p>}\n                {children && <p className={styles.description}>{children}</p>}\n            </div>\n            {action && <div className={styles.action}>{action}</div>}\n            {dismissible && (\n                <button\n                    type=\"button\"\n                    className={styles.close}\n                    aria-label=\"Fechar\"\n                    onClick={() => {\n                        setOpen(false);\n                        onDismiss?.();\n                    }}\n                >\n                    ×\n                </button>\n            )}\n        </div>\n    );\n}\n"],"mappings":";;;;;AAiCA,SAAgBE,EAAO,EACnB,aAAU,QACV,SACA,UACA,WACA,iBAAc,IACd,cACA,cACA,aACA,GAAGC,KACS;CACZ,IAAM,CAACC,GAAMC,KAAWC,EAAS,EAAI;CAErC,OADKF,IAED,kBAAC,OAAD;EAAK,WAAWG,EAAGP,EAAO,QAAQA,EAAOQ,IAAUC,CAAS;EAAG,MAAK;EAAS,GAAIN;EAAjF,UAAA;GACKO,KAAQ,kBAAC,QAAD;IAAM,WAAWV,EAAO;IAAO,UAAAU;GAAW,CAAA;GACnD,kBAAC,OAAD;IAAK,WAAWV,EAAO;IAAvB,UAAA,CACKW,KAAS,kBAAC,KAAD;KAAG,WAAWX,EAAO;KAAQ,UAAAW;IAAS,CAAA,GAC/CC,KAAY,kBAAC,KAAD;KAAG,WAAWZ,EAAO;KAAc;IAAY,CAAA,CAC3D;;GACJa,KAAU,kBAAC,OAAD;IAAK,WAAWb,EAAO;IAAS,UAAAa;GAAY,CAAA;GACtDC,KACG,kBAAC,UAAD;IACI,MAAK;IACL,WAAWd,EAAO;IAClB,cAAW;IACX,eAAe;KAEX,AADAK,EAAQ,EAAK,GACbU,IAAY;IAChB;IACH,UAAA;GAEO,CAAA;EAEX;C,KAtBS;AAwBtB"}

package/dist/components/Banner/Banner.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.module.cjs","names":[],"sources":["../../../src/components/Banner/Banner.module.css"],"sourcesContent":[".banner {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-md);\n    border: 1px solid;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.banner.info {\n    background: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n    border-color: var(--tempest-info-border);\n}\n\n.banner.success {\n    background: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n    border-color: var(--tempest-success-border);\n}\n\n.banner.warning {\n    background: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n    border-color: var(--tempest-warning-border);\n}\n\n.banner.danger {\n    background: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n    border-color: var(--tempest-danger-border);\n}\n\n.icon {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    line-height: 1;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.title {\n    margin: 0 0 var(--tempest-space-1);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.description {\n    margin: 0;\n}\n\n.action {\n    flex: 0 0 auto;\n}\n\n.close {\n    flex: 0 0 auto;\n    background: none;\n    border: 0;\n    color: currentColor;\n    font-size: 20px;\n    line-height: 1;\n    cursor: pointer;\n    padding: 0;\n    width: 24px;\n    height: 24px;\n    border-radius: var(--tempest-radius-sm);\n}\n\n.close:hover {\n    background: color-mix(in srgb, currentColor 10%, transparent);\n}\n"],"mappings":";"}
+{"version":3,"file":"Banner.module.cjs","names":["banner","info","success","warning","danger","icon","body","title","description","action","close","Banner_module_default"],"sources":["../../../src/components/Banner/Banner.module.css"],"sourcesContent":[".banner {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-md);\n    border: 1px solid;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.banner.info {\n    background: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n    border-color: var(--tempest-info-border);\n}\n\n.banner.success {\n    background: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n    border-color: var(--tempest-success-border);\n}\n\n.banner.warning {\n    background: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n    border-color: var(--tempest-warning-border);\n}\n\n.banner.danger {\n    background: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n    border-color: var(--tempest-danger-border);\n}\n\n.icon {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    line-height: 1;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.title {\n    margin: 0 0 var(--tempest-space-1);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.description {\n    margin: 0;\n}\n\n.action {\n    flex: 0 0 auto;\n}\n\n.close {\n    flex: 0 0 auto;\n    background: none;\n    border: 0;\n    color: currentColor;\n    font-size: 20px;\n    line-height: 1;\n    cursor: pointer;\n    padding: 0;\n    width: 24px;\n    height: 24px;\n    border-radius: var(--tempest-radius-sm);\n}\n\n.close:hover {\n    background: color-mix(in srgb, currentColor 10%, transparent);\n}\n"],"mappings":";"}

package/dist/components/Banner/Banner.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"Banner.module.js","names":[],"sources":["../../../src/components/Banner/Banner.module.css"],"sourcesContent":[".banner {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-md);\n    border: 1px solid;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.banner.info {\n    background: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n    border-color: var(--tempest-info-border);\n}\n\n.banner.success {\n    background: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n    border-color: var(--tempest-success-border);\n}\n\n.banner.warning {\n    background: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n    border-color: var(--tempest-warning-border);\n}\n\n.banner.danger {\n    background: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n    border-color: var(--tempest-danger-border);\n}\n\n.icon {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    line-height: 1;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.title {\n    margin: 0 0 var(--tempest-space-1);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.description {\n    margin: 0;\n}\n\n.action {\n    flex: 0 0 auto;\n}\n\n.close {\n    flex: 0 0 auto;\n    background: none;\n    border: 0;\n    color: currentColor;\n    font-size: 20px;\n    line-height: 1;\n    cursor: pointer;\n    padding: 0;\n    width: 24px;\n    height: 24px;\n    border-radius: var(--tempest-radius-sm);\n}\n\n.close:hover {\n    background: color-mix(in srgb, currentColor 10%, transparent);\n}\n"],"mappings":";"}
+{"version":3,"file":"Banner.module.js","names":["banner","info","success","warning","danger","icon","body","title","description","action","close","Banner_module_default"],"sources":["../../../src/components/Banner/Banner.module.css"],"sourcesContent":[".banner {\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-md);\n    border: 1px solid;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.banner.info {\n    background: var(--tempest-info-bg);\n    color: var(--tempest-info-fg);\n    border-color: var(--tempest-info-border);\n}\n\n.banner.success {\n    background: var(--tempest-success-bg);\n    color: var(--tempest-success-fg);\n    border-color: var(--tempest-success-border);\n}\n\n.banner.warning {\n    background: var(--tempest-warning-bg);\n    color: var(--tempest-warning-fg);\n    border-color: var(--tempest-warning-border);\n}\n\n.banner.danger {\n    background: var(--tempest-danger-bg);\n    color: var(--tempest-danger-fg);\n    border-color: var(--tempest-danger-border);\n}\n\n.icon {\n    flex: 0 0 auto;\n    display: inline-flex;\n    align-items: center;\n    line-height: 1;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.title {\n    margin: 0 0 var(--tempest-space-1);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.description {\n    margin: 0;\n}\n\n.action {\n    flex: 0 0 auto;\n}\n\n.close {\n    flex: 0 0 auto;\n    background: none;\n    border: 0;\n    color: currentColor;\n    font-size: 20px;\n    line-height: 1;\n    cursor: pointer;\n    padding: 0;\n    width: 24px;\n    height: 24px;\n    border-radius: var(--tempest-radius-sm);\n}\n\n.close:hover {\n    background: color-mix(in srgb, currentColor 10%, transparent);\n}\n"],"mappings":";"}

package/dist/components/BarList/BarList.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BarList.cjs","names":[],"sources":["../../../src/components/BarList/BarList.tsx"],"sourcesContent":["import { useMemo, type HTMLAttributes } from \"react\";\n\nimport { useChartColors } from \"@/charts/use-chart-colors\";\nimport { cn } from \"@/utils/cn\";\n\nimport { buildBarListRows, type BarListItem, type BarListSort } from \"./bar-list-model\";\nimport styles from \"./BarList.module.css\";\n\nexport type { BarListItem, BarListSort } from \"./bar-list-model\";\n\nexport interface BarListProps extends Omit<HTMLAttributes<HTMLUListElement>, \"children\"> {\n    /** The rows. Entries whose value is not finite are dropped. */\n    items: readonly BarListItem[];\n    /** Render the number. Defaults to the value as-is. */\n    valueFormatter?: (value: number) => string;\n    /** Show each row's share of the total next to its value. Default `false`. */\n    showPercentage?: boolean;\n    /** Ordering. Default `\"desc\"`, which is what a ranking means. */\n    sort?: BarListSort;\n    /** Keep at most this many rows. */\n    max?: number;\n    /**\n     * Label for one aggregated row holding everything `max` cut off.\n     *\n     * Without it, `max` simply truncates. The aggregate row only appears when more\n     * than one row was cut — collapsing a single row into \"others\" hides its name\n     * for nothing.\n     */\n    otherLabel?: string;\n}\n\n/**\n * A ranked distribution: label, proportional bar, value, optional share.\n *\n * The most common chart on an admin panel, and the one the SDK kept sending\n * people to write by hand — `Progress` is a single bar and `Sparkline` is a time\n * series, so a \"users per plan\" block ended up reimplemented per screen, each\n * with its own CSS and its own `.sort()`.\n *\n * It is a **list**, not a picture: `<ul>` / `<li>` with the value written as\n * text, the bar `aria-hidden` behind it. A screen reader reads \"Free, 128, 62%\"\n * because that text is there, not because an `aria-label` restates a drawing.\n * Which is also why the label never sits on top of the bar — text over a tinted\n * fill has to be re-verified against that fill, and the SDK has been caught by\n * that twice.\n *\n * Bar width is relative to the **largest** row, so the biggest bar fills the\n * track; the percentage is the row's share of the **total**. They are different\n * numbers on purpose: a width scaled by the total leaves every bar short in a\n * long list, which is when the chart is needed most.\n *\n * Colors come from {@link useChartColors}, the same resolver every chart in the\n * SDK uses, so a theme that declares fewer series than the eight\n * `--tempest-chart-*` slots cycles within its own palette. Reading the tokens\n * through CSS `var()` could not do that: the count lives in\n * `--tempest-chart-count`, which CSS cannot use as a modulus, so a six-color\n * brand palette got the SDK's leftover defaults in rows seven and eight — the\n * exact regression that token exists to prevent. `palette.ts` imports nothing,\n * so this pulls no chart library into the slice.\n *\n * @example\n * <BarList\n *     items={[{ label: \"Free\", value: 128 }, { label: \"Pro\", value: 32 }]}\n *     valueFormatter={(n) => `${n} ativos`}\n *     showPercentage\n *     max={5}\n *     otherLabel=\"Outros\"\n * />\n *\n * @param props - Items plus presentation.\n * @returns The list.\n */\nexport function BarList({\n    items,\n    valueFormatter,\n    showPercentage = false,\n    sort = \"desc\",\n    max,\n    otherLabel,\n    className,\n    ...rest\n}: BarListProps) {\n    const rows = useMemo(\n        () => buildBarListRows({ items, sort, max, otherLabel }),\n        [items, sort, max, otherLabel],\n    );\n    const palette = useChartColors();\n\n    return (\n        <ul className={cn(styles.list, className)} {...rest}>\n            {rows.map((row) => (\n                <li key={`${row.label}-${row.index}`} className={styles.item}>\n                    <div className={styles.line}>\n                        <span className={styles.label}>{row.label}</span>\n                        <span className={styles.value}>\n                            {valueFormatter ? valueFormatter(row.value) : row.value}\n                            {showPercentage && (\n                                <span className={styles.percentage}>\n                                    {Math.round(row.percentage)}%\n                                </span>\n                            )}\n                        </span>\n                    </div>\n                    <div className={styles.track} aria-hidden=\"true\">\n                        <div\n                            className={styles.fill}\n                            style={{\n                                width: `${row.width}%`,\n                                backgroundColor: row.color ?? palette[row.index % palette.length],\n                            }}\n                        />\n                    </div>\n                </li>\n            ))}\n        </ul>\n    );\n}\n"],"mappings":"+MAwEA,SAAgB,EAAQ,CACpB,QACA,iBACA,iBAAiB,GACjB,OAAO,OACP,MACA,aACA,YACA,GAAG,GACU,CACb,IAAM,GAAA,EAAO,EAAA,QAAA,KACH,EAAA,iBAAiB,CAAE,QAAO,OAAM,MAAK,YAAW,CAAC,EACvD,CAAC,EAAO,EAAM,EAAK,CAAU,CACjC,EACM,EAAU,EAAA,eAAe,EAE/B,OACI,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,CAAS,EAAG,GAAI,EAC1C,SAAA,EAAK,IAAK,IACP,EAAA,EAAA,KAAA,CAAC,KAAD,CAAsC,UAAW,EAAA,QAAO,KAAxD,SAAA,EACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAvB,SAAA,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAI,KAAY,CAAA,GAChD,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAxB,SAAA,CACK,EAAiB,EAAe,EAAI,KAAK,EAAI,EAAI,MACjD,IACG,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,WAAxB,SAAA,CACK,KAAK,MAAM,EAAI,UAAU,EAAE,GAC1B,CAER,CAAA,CAAA,CACL,CAAA,CAAA,CACL,CAAA,GAAA,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,MAAO,cAAY,OACtC,UAAA,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,QAAO,KAClB,MAAO,CACH,MAAO,GAAG,EAAI,MAAM,GACpB,gBAAiB,EAAI,OAAS,EAAQ,EAAI,MAAQ,EAAQ,OAC9D,CACH,CAAA,CACA,CAAA,CACL,CArBK,EAAA,GAAG,EAAI,MAAM,GAAG,EAAI,OAqBzB,CACP,CACD,CAAA,CAEZ"}
+{"version":3,"file":"BarList.cjs","names":["useMemo","buildBarListRows","useChartColors","cn","styles","require_cn","require_use_chart_colors","require_bar_list_model","require_BarList_module","react","react_jsx_runtime","BarList","rest","rows","items","sort","max","otherLabel","palette","className","row","valueFormatter","showPercentage"],"sources":["../../../src/components/BarList/BarList.tsx"],"sourcesContent":["import { useMemo, type HTMLAttributes } from \"react\";\n\nimport { useChartColors } from \"@/charts/use-chart-colors\";\nimport { cn } from \"@/utils/cn\";\n\nimport { buildBarListRows, type BarListItem, type BarListSort } from \"./bar-list-model\";\nimport styles from \"./BarList.module.css\";\n\nexport type { BarListItem, BarListSort } from \"./bar-list-model\";\n\nexport interface BarListProps extends Omit<HTMLAttributes<HTMLUListElement>, \"children\"> {\n    /** The rows. Entries whose value is not finite are dropped. */\n    items: readonly BarListItem[];\n    /** Render the number. Defaults to the value as-is. */\n    valueFormatter?: (value: number) => string;\n    /** Show each row's share of the total next to its value. Default `false`. */\n    showPercentage?: boolean;\n    /** Ordering. Default `\"desc\"`, which is what a ranking means. */\n    sort?: BarListSort;\n    /** Keep at most this many rows. */\n    max?: number;\n    /**\n     * Label for one aggregated row holding everything `max` cut off.\n     *\n     * Without it, `max` simply truncates. The aggregate row only appears when more\n     * than one row was cut — collapsing a single row into \"others\" hides its name\n     * for nothing.\n     */\n    otherLabel?: string;\n}\n\n/**\n * A ranked distribution: label, proportional bar, value, optional share.\n *\n * The most common chart on an admin panel, and the one the SDK kept sending\n * people to write by hand — `Progress` is a single bar and `Sparkline` is a time\n * series, so a \"users per plan\" block ended up reimplemented per screen, each\n * with its own CSS and its own `.sort()`.\n *\n * It is a **list**, not a picture: `<ul>` / `<li>` with the value written as\n * text, the bar `aria-hidden` behind it. A screen reader reads \"Free, 128, 62%\"\n * because that text is there, not because an `aria-label` restates a drawing.\n * Which is also why the label never sits on top of the bar — text over a tinted\n * fill has to be re-verified against that fill, and the SDK has been caught by\n * that twice.\n *\n * Bar width is relative to the **largest** row, so the biggest bar fills the\n * track; the percentage is the row's share of the **total**. They are different\n * numbers on purpose: a width scaled by the total leaves every bar short in a\n * long list, which is when the chart is needed most.\n *\n * Colors come from {@link useChartColors}, the same resolver every chart in the\n * SDK uses, so a theme that declares fewer series than the eight\n * `--tempest-chart-*` slots cycles within its own palette. Reading the tokens\n * through CSS `var()` could not do that: the count lives in\n * `--tempest-chart-count`, which CSS cannot use as a modulus, so a six-color\n * brand palette got the SDK's leftover defaults in rows seven and eight — the\n * exact regression that token exists to prevent. `palette.ts` imports nothing,\n * so this pulls no chart library into the slice.\n *\n * @example\n * <BarList\n *     items={[{ label: \"Free\", value: 128 }, { label: \"Pro\", value: 32 }]}\n *     valueFormatter={(n) => `${n} ativos`}\n *     showPercentage\n *     max={5}\n *     otherLabel=\"Outros\"\n * />\n *\n * @param props - Items plus presentation.\n * @returns The list.\n */\nexport function BarList({\n    items,\n    valueFormatter,\n    showPercentage = false,\n    sort = \"desc\",\n    max,\n    otherLabel,\n    className,\n    ...rest\n}: BarListProps) {\n    const rows = useMemo(\n        () => buildBarListRows({ items, sort, max, otherLabel }),\n        [items, sort, max, otherLabel],\n    );\n    const palette = useChartColors();\n\n    return (\n        <ul className={cn(styles.list, className)} {...rest}>\n            {rows.map((row) => (\n                <li key={`${row.label}-${row.index}`} className={styles.item}>\n                    <div className={styles.line}>\n                        <span className={styles.label}>{row.label}</span>\n                        <span className={styles.value}>\n                            {valueFormatter ? valueFormatter(row.value) : row.value}\n                            {showPercentage && (\n                                <span className={styles.percentage}>\n                                    {Math.round(row.percentage)}%\n                                </span>\n                            )}\n                        </span>\n                    </div>\n                    <div className={styles.track} aria-hidden=\"true\">\n                        <div\n                            className={styles.fill}\n                            style={{\n                                width: `${row.width}%`,\n                                backgroundColor: row.color ?? palette[row.index % palette.length],\n                            }}\n                        />\n                    </div>\n                </li>\n            ))}\n        </ul>\n    );\n}\n"],"mappings":"A,+MAwEA,SAAgBW,EAAQ,CACpB,QACA,iBACA,iBAAiB,GACjB,OAAO,OACP,MACA,aACA,YACA,GAAGC,GACU,CACb,IAAMC,GAAA,EAAOb,EAAAA,QAAAA,KACHC,EAAAA,iBAAiB,CAAE,QAAO,OAAM,MAAK,YAAW,CAAC,EACvD,CAACa,EAAOC,EAAMC,EAAKC,CAAU,CACjC,EACMC,EAAUhB,EAAAA,eAAe,EAE/B,OACI,EAAAQ,EAAA,IAAA,CAAC,KAAD,CAAI,UAAWP,EAAAA,GAAGC,EAAAA,QAAO,KAAMe,CAAS,EAAG,GAAIP,EAC1C,SAAAC,EAAK,IAAK,IACP,EAAAH,EAAA,KAAA,CAAC,KAAD,CAAsC,UAAWN,EAAAA,QAAO,KAAxD,SAAA,EACI,EAAAM,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWN,EAAAA,QAAO,KAAvB,SAAA,EACI,EAAAM,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWN,EAAAA,QAAO,MAAQ,SAAAgB,EAAI,KAAY,CAAA,GAChD,EAAAV,EAAA,KAAA,CAAC,OAAD,CAAM,UAAWN,EAAAA,QAAO,MAAxB,SAAA,CACKiB,EAAiBA,EAAeD,EAAI,KAAK,EAAIA,EAAI,MACjDE,IACG,EAAAZ,EAAA,KAAA,CAAC,OAAD,CAAM,UAAWN,EAAAA,QAAO,WAAxB,SAAA,CACK,KAAK,MAAMgB,EAAI,UAAU,EAAE,GAC1B,CAER,CAAA,CAAA,CACL,CAAA,CAAA,CACL,CAAA,GAAA,EAAAV,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWN,EAAAA,QAAO,MAAO,cAAY,OACtC,UAAA,EAAAM,EAAA,IAAA,CAAC,MAAD,CACI,UAAWN,EAAAA,QAAO,KAClB,MAAO,CACH,MAAO,GAAGgB,EAAI,MAAM,GACpB,gBAAiBA,EAAI,OAASF,EAAQE,EAAI,MAAQF,EAAQ,OAC9D,CACH,CAAA,CACA,CAAA,CACL,CArBK,EAAA,GAAGE,EAAI,MAAM,GAAGA,EAAI,OAqBzB,CACP,CACD,CAAA,CAEZ,C"}

package/dist/components/BarList/BarList.js.map

@@ -1 +1 @@
-{"version":3,"file":"BarList.js","names":[],"sources":["../../../src/components/BarList/BarList.tsx"],"sourcesContent":["import { useMemo, type HTMLAttributes } from \"react\";\n\nimport { useChartColors } from \"@/charts/use-chart-colors\";\nimport { cn } from \"@/utils/cn\";\n\nimport { buildBarListRows, type BarListItem, type BarListSort } from \"./bar-list-model\";\nimport styles from \"./BarList.module.css\";\n\nexport type { BarListItem, BarListSort } from \"./bar-list-model\";\n\nexport interface BarListProps extends Omit<HTMLAttributes<HTMLUListElement>, \"children\"> {\n    /** The rows. Entries whose value is not finite are dropped. */\n    items: readonly BarListItem[];\n    /** Render the number. Defaults to the value as-is. */\n    valueFormatter?: (value: number) => string;\n    /** Show each row's share of the total next to its value. Default `false`. */\n    showPercentage?: boolean;\n    /** Ordering. Default `\"desc\"`, which is what a ranking means. */\n    sort?: BarListSort;\n    /** Keep at most this many rows. */\n    max?: number;\n    /**\n     * Label for one aggregated row holding everything `max` cut off.\n     *\n     * Without it, `max` simply truncates. The aggregate row only appears when more\n     * than one row was cut — collapsing a single row into \"others\" hides its name\n     * for nothing.\n     */\n    otherLabel?: string;\n}\n\n/**\n * A ranked distribution: label, proportional bar, value, optional share.\n *\n * The most common chart on an admin panel, and the one the SDK kept sending\n * people to write by hand — `Progress` is a single bar and `Sparkline` is a time\n * series, so a \"users per plan\" block ended up reimplemented per screen, each\n * with its own CSS and its own `.sort()`.\n *\n * It is a **list**, not a picture: `<ul>` / `<li>` with the value written as\n * text, the bar `aria-hidden` behind it. A screen reader reads \"Free, 128, 62%\"\n * because that text is there, not because an `aria-label` restates a drawing.\n * Which is also why the label never sits on top of the bar — text over a tinted\n * fill has to be re-verified against that fill, and the SDK has been caught by\n * that twice.\n *\n * Bar width is relative to the **largest** row, so the biggest bar fills the\n * track; the percentage is the row's share of the **total**. They are different\n * numbers on purpose: a width scaled by the total leaves every bar short in a\n * long list, which is when the chart is needed most.\n *\n * Colors come from {@link useChartColors}, the same resolver every chart in the\n * SDK uses, so a theme that declares fewer series than the eight\n * `--tempest-chart-*` slots cycles within its own palette. Reading the tokens\n * through CSS `var()` could not do that: the count lives in\n * `--tempest-chart-count`, which CSS cannot use as a modulus, so a six-color\n * brand palette got the SDK's leftover defaults in rows seven and eight — the\n * exact regression that token exists to prevent. `palette.ts` imports nothing,\n * so this pulls no chart library into the slice.\n *\n * @example\n * <BarList\n *     items={[{ label: \"Free\", value: 128 }, { label: \"Pro\", value: 32 }]}\n *     valueFormatter={(n) => `${n} ativos`}\n *     showPercentage\n *     max={5}\n *     otherLabel=\"Outros\"\n * />\n *\n * @param props - Items plus presentation.\n * @returns The list.\n */\nexport function BarList({\n    items,\n    valueFormatter,\n    showPercentage = false,\n    sort = \"desc\",\n    max,\n    otherLabel,\n    className,\n    ...rest\n}: BarListProps) {\n    const rows = useMemo(\n        () => buildBarListRows({ items, sort, max, otherLabel }),\n        [items, sort, max, otherLabel],\n    );\n    const palette = useChartColors();\n\n    return (\n        <ul className={cn(styles.list, className)} {...rest}>\n            {rows.map((row) => (\n                <li key={`${row.label}-${row.index}`} className={styles.item}>\n                    <div className={styles.line}>\n                        <span className={styles.label}>{row.label}</span>\n                        <span className={styles.value}>\n                            {valueFormatter ? valueFormatter(row.value) : row.value}\n                            {showPercentage && (\n                                <span className={styles.percentage}>\n                                    {Math.round(row.percentage)}%\n                                </span>\n                            )}\n                        </span>\n                    </div>\n                    <div className={styles.track} aria-hidden=\"true\">\n                        <div\n                            className={styles.fill}\n                            style={{\n                                width: `${row.width}%`,\n                                backgroundColor: row.color ?? palette[row.index % palette.length],\n                            }}\n                        />\n                    </div>\n                </li>\n            ))}\n        </ul>\n    );\n}\n"],"mappings":";;;;;;;AAwEA,SAAgB,EAAQ,EACpB,UACA,mBACA,oBAAiB,IACjB,UAAO,QACP,QACA,eACA,cACA,GAAG,KACU;CACb,IAAM,IAAO,QACH,EAAiB;EAAE;EAAO;EAAM;EAAK;CAAW,CAAC,GACvD;EAAC;EAAO;EAAM;EAAK;CAAU,CACjC,GACM,IAAU,EAAe;CAE/B,OACI,kBAAC,MAAD;EAAI,WAAW,EAAG,EAAO,MAAM,CAAS;EAAG,GAAI;EAC1C,UAAA,EAAK,KAAK,MACP,kBAAC,MAAD;GAAsC,WAAW,EAAO;GAAxD,UAAA,CACI,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAvB,UAAA,CACI,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAQ,UAAA,EAAI;IAAY,CAAA,GAChD,kBAAC,QAAD;KAAM,WAAW,EAAO;KAAxB,UAAA,CACK,IAAiB,EAAe,EAAI,KAAK,IAAI,EAAI,OACjD,KACG,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAxB,UAAA,CACK,KAAK,MAAM,EAAI,UAAU,GAAE,GAC1B;KAER,CAAA,CAAA;IACL,CAAA,CAAA;GACL,CAAA,GAAA,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAO,eAAY;IACtC,UAAA,kBAAC,OAAD;KACI,WAAW,EAAO;KAClB,OAAO;MACH,OAAO,GAAG,EAAI,MAAM;MACpB,iBAAiB,EAAI,SAAS,EAAQ,EAAI,QAAQ,EAAQ;KAC9D;IACH,CAAA;GACA,CAAA,CACL;EArBK,GAAA,GAAG,EAAI,MAAM,GAAG,EAAI,OAqBzB,CACP;CACD,CAAA;AAEZ"}
+{"version":3,"file":"BarList.js","names":["styles","BarList_module_default","BarList","rest","rows","useMemo","buildBarListRows","items","sort","max","otherLabel","palette","useChartColors","cn","className","row","valueFormatter","showPercentage"],"sources":["../../../src/components/BarList/BarList.tsx"],"sourcesContent":["import { useMemo, type HTMLAttributes } from \"react\";\n\nimport { useChartColors } from \"@/charts/use-chart-colors\";\nimport { cn } from \"@/utils/cn\";\n\nimport { buildBarListRows, type BarListItem, type BarListSort } from \"./bar-list-model\";\nimport styles from \"./BarList.module.css\";\n\nexport type { BarListItem, BarListSort } from \"./bar-list-model\";\n\nexport interface BarListProps extends Omit<HTMLAttributes<HTMLUListElement>, \"children\"> {\n    /** The rows. Entries whose value is not finite are dropped. */\n    items: readonly BarListItem[];\n    /** Render the number. Defaults to the value as-is. */\n    valueFormatter?: (value: number) => string;\n    /** Show each row's share of the total next to its value. Default `false`. */\n    showPercentage?: boolean;\n    /** Ordering. Default `\"desc\"`, which is what a ranking means. */\n    sort?: BarListSort;\n    /** Keep at most this many rows. */\n    max?: number;\n    /**\n     * Label for one aggregated row holding everything `max` cut off.\n     *\n     * Without it, `max` simply truncates. The aggregate row only appears when more\n     * than one row was cut — collapsing a single row into \"others\" hides its name\n     * for nothing.\n     */\n    otherLabel?: string;\n}\n\n/**\n * A ranked distribution: label, proportional bar, value, optional share.\n *\n * The most common chart on an admin panel, and the one the SDK kept sending\n * people to write by hand — `Progress` is a single bar and `Sparkline` is a time\n * series, so a \"users per plan\" block ended up reimplemented per screen, each\n * with its own CSS and its own `.sort()`.\n *\n * It is a **list**, not a picture: `<ul>` / `<li>` with the value written as\n * text, the bar `aria-hidden` behind it. A screen reader reads \"Free, 128, 62%\"\n * because that text is there, not because an `aria-label` restates a drawing.\n * Which is also why the label never sits on top of the bar — text over a tinted\n * fill has to be re-verified against that fill, and the SDK has been caught by\n * that twice.\n *\n * Bar width is relative to the **largest** row, so the biggest bar fills the\n * track; the percentage is the row's share of the **total**. They are different\n * numbers on purpose: a width scaled by the total leaves every bar short in a\n * long list, which is when the chart is needed most.\n *\n * Colors come from {@link useChartColors}, the same resolver every chart in the\n * SDK uses, so a theme that declares fewer series than the eight\n * `--tempest-chart-*` slots cycles within its own palette. Reading the tokens\n * through CSS `var()` could not do that: the count lives in\n * `--tempest-chart-count`, which CSS cannot use as a modulus, so a six-color\n * brand palette got the SDK's leftover defaults in rows seven and eight — the\n * exact regression that token exists to prevent. `palette.ts` imports nothing,\n * so this pulls no chart library into the slice.\n *\n * @example\n * <BarList\n *     items={[{ label: \"Free\", value: 128 }, { label: \"Pro\", value: 32 }]}\n *     valueFormatter={(n) => `${n} ativos`}\n *     showPercentage\n *     max={5}\n *     otherLabel=\"Outros\"\n * />\n *\n * @param props - Items plus presentation.\n * @returns The list.\n */\nexport function BarList({\n    items,\n    valueFormatter,\n    showPercentage = false,\n    sort = \"desc\",\n    max,\n    otherLabel,\n    className,\n    ...rest\n}: BarListProps) {\n    const rows = useMemo(\n        () => buildBarListRows({ items, sort, max, otherLabel }),\n        [items, sort, max, otherLabel],\n    );\n    const palette = useChartColors();\n\n    return (\n        <ul className={cn(styles.list, className)} {...rest}>\n            {rows.map((row) => (\n                <li key={`${row.label}-${row.index}`} className={styles.item}>\n                    <div className={styles.line}>\n                        <span className={styles.label}>{row.label}</span>\n                        <span className={styles.value}>\n                            {valueFormatter ? valueFormatter(row.value) : row.value}\n                            {showPercentage && (\n                                <span className={styles.percentage}>\n                                    {Math.round(row.percentage)}%\n                                </span>\n                            )}\n                        </span>\n                    </div>\n                    <div className={styles.track} aria-hidden=\"true\">\n                        <div\n                            className={styles.fill}\n                            style={{\n                                width: `${row.width}%`,\n                                backgroundColor: row.color ?? palette[row.index % palette.length],\n                            }}\n                        />\n                    </div>\n                </li>\n            ))}\n        </ul>\n    );\n}\n"],"mappings":";;;;;;;AAwEA,SAAgBE,EAAQ,EACpB,UACA,mBACA,oBAAiB,IACjB,UAAO,QACP,QACA,eACA,cACA,GAAGC,KACU;CACb,IAAMC,IAAOC,QACHC,EAAiB;EAAE;EAAO;EAAM;EAAK;CAAW,CAAC,GACvD;EAACC;EAAOC;EAAMC;EAAKC;CAAU,CACjC,GACMC,IAAUC,EAAe;CAE/B,OACI,kBAAC,MAAD;EAAI,WAAWC,EAAGb,EAAO,MAAMc,CAAS;EAAG,GAAIX;EAC1C,UAAAC,EAAK,KAAK,MACP,kBAAC,MAAD;GAAsC,WAAWJ,EAAO;GAAxD,UAAA,CACI,kBAAC,OAAD;IAAK,WAAWA,EAAO;IAAvB,UAAA,CACI,kBAAC,QAAD;KAAM,WAAWA,EAAO;KAAQ,UAAAe,EAAI;IAAY,CAAA,GAChD,kBAAC,QAAD;KAAM,WAAWf,EAAO;KAAxB,UAAA,CACKgB,IAAiBA,EAAeD,EAAI,KAAK,IAAIA,EAAI,OACjDE,KACG,kBAAC,QAAD;MAAM,WAAWjB,EAAO;MAAxB,UAAA,CACK,KAAK,MAAMe,EAAI,UAAU,GAAE,GAC1B;KAER,CAAA,CAAA;IACL,CAAA,CAAA;GACL,CAAA,GAAA,kBAAC,OAAD;IAAK,WAAWf,EAAO;IAAO,eAAY;IACtC,UAAA,kBAAC,OAAD;KACI,WAAWA,EAAO;KAClB,OAAO;MACH,OAAO,GAAGe,EAAI,MAAM;MACpB,iBAAiBA,EAAI,SAASJ,EAAQI,EAAI,QAAQJ,EAAQ;KAC9D;IACH,CAAA;GACA,CAAA,CACL;EArBK,GAAA,GAAGI,EAAI,MAAM,GAAGA,EAAI,OAqBzB,CACP;CACD,CAAA;AAEZ"}