tempest-react-sdk 0.56.0 → 0.58.0

package/dist/components/AudioRecorder/AudioRecorder.js

@@ -71,7 +71,7 @@ function b({ onRecorded: b, maxDurationMs: x, deviceId: S, format: C = "native",
 		onError: k
 	}), [W, G] = u(!1);
 	l(() => {
-		!W || !U.ready || U.status !== "idle" || (G(!1), U.start());
+		W && U.ready && U.status === "idle" && (G(!1), U.start());
 	}, [
 		W,
 		U.ready,

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,CAAC,KAAS,CAAC,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":[],"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":"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"}

package/dist/components/Chat/Chat.cjs

@@ -1,2 +1,2 @@
-const e=require("../../utils/cn.cjs"),t=require("../EmptyState/EmptyState.cjs"),n=require("../VisuallyHidden/VisuallyHidden.cjs"),r=require("./chat-groups.cjs"),i=require("./Chat.module.cjs"),a=require("./ChatComposer.cjs");let o=require("react"),s=require("react/jsx-runtime");var c={sending:`◌`,sent:`✓`,read:`✓✓`,failed:`!`};function l({messages:l,currentUserId:u,onSend:d,onRetry:f,typing:p=[],renderAvatar:m,header:h,emptyState:g,groupWindowMs:_,locale:v=`pt-BR`,now:y,placeholder:b,composerActions:x,composerDisabled:S,onSendError:C,className:w,...T}){let E=r.chatStrings(v),D=r.groupMessages({messages:l,currentUserId:u,windowMs:_}),O=(0,o.useRef)(null),k=(0,o.useRef)(null),A=(0,o.useRef)(!0),j=()=>{let e=k.current;if(!e)return;let t=e.scrollHeight-e.scrollTop-e.clientHeight;A.current=t<48};(0,o.useLayoutEffect)(()=>{let e=k.current;!e||!A.current||(e.scrollTop=e.scrollHeight)},[l,p]),(0,o.useEffect)(()=>{let e=k.current;e&&(e.scrollTop=e.scrollHeight)},[]);let M=r.typingLabel(p,v);return(0,s.jsxs)(`div`,{className:e.cn(i.default.panel,w),...T,children:[h&&(0,s.jsx)(`header`,{className:i.default.header,children:h}),(0,s.jsx)(`div`,{ref:k,className:i.default.thread,onScroll:j,role:`log`,"aria-live":`polite`,"aria-relevant":`additions text`,tabIndex:0,"aria-label":E.thread,children:l.length===0?g??(0,s.jsx)(t.EmptyState,{title:E.empty}):D.map(t=>t.kind===`day`?(0,s.jsx)(`div`,{className:i.default.day,children:(0,s.jsx)(`span`,{className:i.default.dayLabel,children:r.dayLabel(t.date,{locale:v,now:y})})},t.key):(0,s.jsxs)(`div`,{className:e.cn(i.default.run,t.own&&i.default.ownRun),children:[m&&(0,s.jsx)(`div`,{className:i.default.avatar,"aria-hidden":`true`,children:m(t.messages[0])}),(0,s.jsxs)(`div`,{className:i.default.runBody,children:[(0,s.jsx)(`span`,{className:i.default.author,children:t.own?E.you:t.authorName??t.authorId}),(0,s.jsx)(`ul`,{className:i.default.bubbles,children:t.messages.map(a=>(0,s.jsxs)(`li`,{className:i.default.bubbleRow,children:[(0,s.jsxs)(`div`,{className:e.cn(i.default.bubble,t.own&&i.default.ownBubble,a.status===`failed`&&i.default.failedBubble),children:[(0,s.jsx)(`div`,{className:i.default.body,children:a.body}),(0,s.jsxs)(`div`,{className:i.default.meta,children:[(0,s.jsx)(`time`,{dateTime:new Date(a.sentAt).toISOString(),children:r.timeLabel(a.sentAt,v)}),t.own&&a.status&&(0,s.jsxs)(`span`,{className:e.cn(i.default.status,a.status===`failed`&&i.default.statusFailed),title:E[a.status],children:[(0,s.jsx)(`span`,{"aria-hidden":`true`,children:c[a.status]}),(0,s.jsx)(n.VisuallyHidden,{children:E[a.status]})]})]})]}),a.status===`failed`&&f&&(0,s.jsx)(`button`,{type:`button`,className:i.default.retry,onClick:()=>f(a),children:E.retry})]},a.id))})]})]},t.key))}),M&&(0,s.jsx)(`p`,{className:i.default.typing,"aria-live":`polite`,children:M}),d&&(0,s.jsx)(a.ChatComposer,{ref:O,onSend:d,locale:v,placeholder:b,actions:x,disabled:S,onError:C})]})}exports.Chat=l;
+const e=require("../../utils/cn.cjs"),t=require("../EmptyState/EmptyState.cjs"),n=require("../VisuallyHidden/VisuallyHidden.cjs"),r=require("./chat-groups.cjs"),i=require("./Chat.module.cjs"),a=require("./ChatComposer.cjs");let o=require("react"),s=require("react/jsx-runtime");var c={sending:`◌`,sent:`✓`,read:`✓✓`,failed:`!`};function l({messages:l,currentUserId:u,onSend:d,onRetry:f,typing:p=[],renderAvatar:m,header:h,emptyState:g,groupWindowMs:_,locale:v=`pt-BR`,now:y,placeholder:b,composerActions:x,composerDisabled:S,onSendError:C,className:w,...T}){let E=r.chatStrings(v),D=r.groupMessages({messages:l,currentUserId:u,windowMs:_}),O=(0,o.useRef)(null),k=(0,o.useRef)(null),A=(0,o.useRef)(!0),j=()=>{let e=k.current;if(!e)return;let t=e.scrollHeight-e.scrollTop-e.clientHeight;A.current=t<48};(0,o.useLayoutEffect)(()=>{let e=k.current;e&&A.current&&(e.scrollTop=e.scrollHeight)},[l,p]),(0,o.useEffect)(()=>{let e=k.current;e&&(e.scrollTop=e.scrollHeight)},[]);let M=r.typingLabel(p,v);return(0,s.jsxs)(`div`,{className:e.cn(i.default.panel,w),...T,children:[h&&(0,s.jsx)(`header`,{className:i.default.header,children:h}),(0,s.jsx)(`div`,{ref:k,className:i.default.thread,onScroll:j,role:`log`,"aria-live":`polite`,"aria-relevant":`additions text`,tabIndex:0,"aria-label":E.thread,children:l.length===0?g??(0,s.jsx)(t.EmptyState,{title:E.empty}):D.map(t=>t.kind===`day`?(0,s.jsx)(`div`,{className:i.default.day,children:(0,s.jsx)(`span`,{className:i.default.dayLabel,children:r.dayLabel(t.date,{locale:v,now:y})})},t.key):(0,s.jsxs)(`div`,{className:e.cn(i.default.run,t.own&&i.default.ownRun),children:[m&&(0,s.jsx)(`div`,{className:i.default.avatar,"aria-hidden":`true`,children:m(t.messages[0])}),(0,s.jsxs)(`div`,{className:i.default.runBody,children:[(0,s.jsx)(`span`,{className:i.default.author,children:t.own?E.you:t.authorName??t.authorId}),(0,s.jsx)(`ul`,{className:i.default.bubbles,children:t.messages.map(a=>(0,s.jsxs)(`li`,{className:i.default.bubbleRow,children:[(0,s.jsxs)(`div`,{className:e.cn(i.default.bubble,t.own&&i.default.ownBubble,a.status===`failed`&&i.default.failedBubble),children:[(0,s.jsx)(`div`,{className:i.default.body,children:a.body}),(0,s.jsxs)(`div`,{className:i.default.meta,children:[(0,s.jsx)(`time`,{dateTime:new Date(a.sentAt).toISOString(),children:r.timeLabel(a.sentAt,v)}),t.own&&a.status&&(0,s.jsxs)(`span`,{className:e.cn(i.default.status,a.status===`failed`&&i.default.statusFailed),title:E[a.status],children:[(0,s.jsx)(`span`,{"aria-hidden":`true`,children:c[a.status]}),(0,s.jsx)(n.VisuallyHidden,{children:E[a.status]})]})]})]}),a.status===`failed`&&f&&(0,s.jsx)(`button`,{type:`button`,className:i.default.retry,onClick:()=>f(a),children:E.retry})]},a.id))})]})]},t.key))}),M&&(0,s.jsx)(`p`,{className:i.default.typing,"aria-live":`polite`,children:M}),d&&(0,s.jsx)(a.ChatComposer,{ref:O,onSend:d,locale:v,placeholder:b,actions:x,disabled:S,onError:C})]})}exports.Chat=l;
 //# sourceMappingURL=Chat.cjs.map

package/dist/components/Chat/Chat.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Chat.cjs","names":[],"sources":["../../../src/components/Chat/Chat.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — message grouping needs\n * more context than a list does: currentUserId to decide sides, groupWindowMs and\n * now to decide where a bubble group breaks, typing for the indicator. The remaining\n * props are the composer's (placeholder, composerActions, composerDisabled, onSend,\n * onSendError) and the slots (renderAvatar, header, emptyState).\n */\nimport { useEffect, useLayoutEffect, useRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { EmptyState } from \"../EmptyState\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { ChatComposer, type ChatComposerHandle } from \"./ChatComposer\";\nimport {\n    chatStrings,\n    dayLabel,\n    groupMessages,\n    timeLabel,\n    typingLabel,\n    type ChatMessage,\n} from \"./chat-groups\";\nimport styles from \"./Chat.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onSubmit\";\n\nexport interface ChatProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** The thread, **oldest first**. Never reordered by the component. */\n    messages: readonly ChatMessage[];\n    /** Author id treated as \"own\" — decides side, colour and status ticks. */\n    currentUserId?: string;\n    /** Renders the composer when given. Receives the trimmed text. */\n    onSend?: (text: string) => void | Promise<void>;\n    /** Enables the retry control on a `\"failed\"` message. */\n    onRetry?: (message: ChatMessage) => void;\n    /** Names currently typing. One, two or a count is phrased for you. */\n    typing?: readonly string[];\n    /** Avatar for the first message of a run — an `<Avatar>`, an `<Icon>`. */\n    renderAvatar?: (message: ChatMessage) => ReactNode;\n    /** Rendered above the thread, inside the panel. */\n    header?: ReactNode;\n    /** Shown when there are no messages. */\n    emptyState?: ReactNode;\n    /** Gap that still keeps consecutive messages in one run. Default 5 min. */\n    groupWindowMs?: number;\n    /** Locale for labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Reference instant for \"Hoje\"/\"Ontem\". Default: now, at render time. */\n    now?: number;\n    /** Placeholder for the composer. */\n    placeholder?: string;\n    /** Extra controls inside the composer, before the send button. */\n    composerActions?: ReactNode;\n    /** Disable the composer — no permission, thread archived, offline. */\n    composerDisabled?: boolean;\n    /** Called when `onSend` rejects. The draft stays in the field either way. */\n    onSendError?: (error: unknown) => void;\n}\n\n/** Status glyph and label for an outgoing message. */\nconst STATUS_GLYPH: Record<NonNullable<ChatMessage[\"status\"]>, string> = {\n    sending: \"◌\",\n    sent: \"✓\",\n    read: \"✓✓\",\n    failed: \"!\",\n};\n\n/**\n * A message thread: grouped by author and by day, own messages on one side, with\n * delivery state, a typing indicator and an optional composer.\n *\n * Presentational and controlled, like the rest of the SDK: it takes a list and\n * emits intent (`onSend`, `onRetry`). Where messages come from — REST, the SDK's\n * `createWebSocket`, an SSE stream — and how an optimistic insert is done stay with\n * the app, because those differ per backend and a component that assumed one would\n * be wrong for most.\n *\n * It works as a comment thread too: that is the same component with\n * `currentUserId` set and no `typing`.\n *\n * @example\n * <Chat\n *     messages={messages}\n *     currentUserId={me.id}\n *     typing={typingNames}\n *     onSend={(text) => send({ text })}\n *     onRetry={(message) => resend(message.id)}\n * />\n */\nexport function Chat({\n    messages,\n    currentUserId,\n    onSend,\n    onRetry,\n    typing = [],\n    renderAvatar,\n    header,\n    emptyState,\n    groupWindowMs,\n    locale = \"pt-BR\",\n    now,\n    placeholder,\n    composerActions,\n    composerDisabled,\n    onSendError,\n    className,\n    ...rest\n}: ChatProps) {\n    const strings = chatStrings(locale);\n    const sections = groupMessages({ messages, currentUserId, windowMs: groupWindowMs });\n    const composer = useRef<ChatComposerHandle | null>(null);\n    const thread = useRef<HTMLDivElement | null>(null);\n    const stuckToBottom = useRef(true);\n\n    /**\n     * Remember whether the reader is at the bottom, before the next batch lands.\n     *\n     * A thread that always scrolls to the newest message yanks somebody out of the\n     * history they were reading, every time anyone types. So the jump only happens\n     * when they were already at the bottom — the same rule every chat app converges\n     * on. The 48px slack covers a partially visible last row.\n     */\n    const trackPosition = (): void => {\n        const node = thread.current;\n        if (!node) return;\n        const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n        stuckToBottom.current = distance < 48;\n    };\n\n    useLayoutEffect(() => {\n        const node = thread.current;\n        if (!node || !stuckToBottom.current) return;\n        node.scrollTop = node.scrollHeight;\n    }, [messages, typing]);\n\n    useEffect(() => {\n        const node = thread.current;\n        if (!node) return;\n        node.scrollTop = node.scrollHeight;\n        // Mount lands on the newest message; from then on `trackPosition` decides.\n    }, []);\n\n    const typingText = typingLabel(typing, locale);\n\n    return (\n        <div className={cn(styles.panel, className)} {...rest}>\n            {header && <header className={styles.header}>{header}</header>}\n\n            <div\n                ref={thread}\n                className={styles.thread}\n                onScroll={trackPosition}\n                role=\"log\"\n                aria-live=\"polite\"\n                aria-relevant=\"additions text\"\n                tabIndex={0}\n                aria-label={strings.thread}\n            >\n                {messages.length === 0\n                    ? (emptyState ?? <EmptyState title={strings.empty} />)\n                    : sections.map((section) =>\n                          section.kind === \"day\" ? (\n                              <div key={section.key} className={styles.day}>\n                                  <span className={styles.dayLabel}>\n                                      {dayLabel(section.date, { locale, now })}\n                                  </span>\n                              </div>\n                          ) : (\n                              <div\n                                  key={section.key}\n                                  className={cn(styles.run, section.own && styles.ownRun)}\n                              >\n                                  {renderAvatar && (\n                                      <div className={styles.avatar} aria-hidden=\"true\">\n                                          {renderAvatar(section.messages[0])}\n                                      </div>\n                                  )}\n                                  <div className={styles.runBody}>\n                                      <span className={styles.author}>\n                                          {section.own\n                                              ? strings.you\n                                              : (section.authorName ?? section.authorId)}\n                                      </span>\n                                      <ul className={styles.bubbles}>\n                                          {section.messages.map((message) => (\n                                              <li key={message.id} className={styles.bubbleRow}>\n                                                  <div\n                                                      className={cn(\n                                                          styles.bubble,\n                                                          section.own && styles.ownBubble,\n                                                          message.status === \"failed\" &&\n                                                              styles.failedBubble,\n                                                      )}\n                                                  >\n                                                      <div className={styles.body}>\n                                                          {message.body}\n                                                      </div>\n                                                      <div className={styles.meta}>\n                                                          <time\n                                                              dateTime={new Date(\n                                                                  message.sentAt,\n                                                              ).toISOString()}\n                                                          >\n                                                              {timeLabel(message.sentAt, locale)}\n                                                          </time>\n                                                          {section.own && message.status && (\n                                                              <span\n                                                                  className={cn(\n                                                                      styles.status,\n                                                                      message.status === \"failed\" &&\n                                                                          styles.statusFailed,\n                                                                  )}\n                                                                  title={strings[message.status]}\n                                                              >\n                                                                  <span aria-hidden=\"true\">\n                                                                      {STATUS_GLYPH[message.status]}\n                                                                  </span>\n                                                                  <VisuallyHidden>\n                                                                      {strings[message.status]}\n                                                                  </VisuallyHidden>\n                                                              </span>\n                                                          )}\n                                                      </div>\n                                                  </div>\n                                                  {message.status === \"failed\" && onRetry && (\n                                                      <button\n                                                          type=\"button\"\n                                                          className={styles.retry}\n                                                          onClick={() => onRetry(message)}\n                                                      >\n                                                          {strings.retry}\n                                                      </button>\n                                                  )}\n                                              </li>\n                                          ))}\n                                      </ul>\n                                  </div>\n                              </div>\n                          ),\n                      )}\n            </div>\n\n            {typingText && (\n                <p className={styles.typing} aria-live=\"polite\">\n                    {typingText}\n                </p>\n            )}\n\n            {onSend && (\n                <ChatComposer\n                    ref={composer}\n                    onSend={onSend}\n                    locale={locale}\n                    placeholder={placeholder}\n                    actions={composerActions}\n                    disabled={composerDisabled}\n                    onError={onSendError}\n                />\n            )}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Chat.cjs","names":[],"sources":["../../../src/components/Chat/Chat.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — message grouping needs\n * more context than a list does: currentUserId to decide sides, groupWindowMs and\n * now to decide where a bubble group breaks, typing for the indicator. The remaining\n * props are the composer's (placeholder, composerActions, composerDisabled, onSend,\n * onSendError) and the slots (renderAvatar, header, emptyState).\n */\nimport { useEffect, useLayoutEffect, useRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { EmptyState } from \"../EmptyState\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { ChatComposer, type ChatComposerHandle } from \"./ChatComposer\";\nimport {\n    chatStrings,\n    dayLabel,\n    groupMessages,\n    timeLabel,\n    typingLabel,\n    type ChatMessage,\n} from \"./chat-groups\";\nimport styles from \"./Chat.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onSubmit\";\n\nexport interface ChatProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** The thread, **oldest first**. Never reordered by the component. */\n    messages: readonly ChatMessage[];\n    /** Author id treated as \"own\" — decides side, colour and status ticks. */\n    currentUserId?: string;\n    /** Renders the composer when given. Receives the trimmed text. */\n    onSend?: (text: string) => void | Promise<void>;\n    /** Enables the retry control on a `\"failed\"` message. */\n    onRetry?: (message: ChatMessage) => void;\n    /** Names currently typing. One, two or a count is phrased for you. */\n    typing?: readonly string[];\n    /** Avatar for the first message of a run — an `<Avatar>`, an `<Icon>`. */\n    renderAvatar?: (message: ChatMessage) => ReactNode;\n    /** Rendered above the thread, inside the panel. */\n    header?: ReactNode;\n    /** Shown when there are no messages. */\n    emptyState?: ReactNode;\n    /** Gap that still keeps consecutive messages in one run. Default 5 min. */\n    groupWindowMs?: number;\n    /** Locale for labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Reference instant for \"Hoje\"/\"Ontem\". Default: now, at render time. */\n    now?: number;\n    /** Placeholder for the composer. */\n    placeholder?: string;\n    /** Extra controls inside the composer, before the send button. */\n    composerActions?: ReactNode;\n    /** Disable the composer — no permission, thread archived, offline. */\n    composerDisabled?: boolean;\n    /** Called when `onSend` rejects. The draft stays in the field either way. */\n    onSendError?: (error: unknown) => void;\n}\n\n/** Status glyph and label for an outgoing message. */\nconst STATUS_GLYPH: Record<NonNullable<ChatMessage[\"status\"]>, string> = {\n    sending: \"◌\",\n    sent: \"✓\",\n    read: \"✓✓\",\n    failed: \"!\",\n};\n\n/**\n * A message thread: grouped by author and by day, own messages on one side, with\n * delivery state, a typing indicator and an optional composer.\n *\n * Presentational and controlled, like the rest of the SDK: it takes a list and\n * emits intent (`onSend`, `onRetry`). Where messages come from — REST, the SDK's\n * `createWebSocket`, an SSE stream — and how an optimistic insert is done stay with\n * the app, because those differ per backend and a component that assumed one would\n * be wrong for most.\n *\n * It works as a comment thread too: that is the same component with\n * `currentUserId` set and no `typing`.\n *\n * @example\n * <Chat\n *     messages={messages}\n *     currentUserId={me.id}\n *     typing={typingNames}\n *     onSend={(text) => send({ text })}\n *     onRetry={(message) => resend(message.id)}\n * />\n */\nexport function Chat({\n    messages,\n    currentUserId,\n    onSend,\n    onRetry,\n    typing = [],\n    renderAvatar,\n    header,\n    emptyState,\n    groupWindowMs,\n    locale = \"pt-BR\",\n    now,\n    placeholder,\n    composerActions,\n    composerDisabled,\n    onSendError,\n    className,\n    ...rest\n}: ChatProps) {\n    const strings = chatStrings(locale);\n    const sections = groupMessages({ messages, currentUserId, windowMs: groupWindowMs });\n    const composer = useRef<ChatComposerHandle | null>(null);\n    const thread = useRef<HTMLDivElement | null>(null);\n    const stuckToBottom = useRef(true);\n\n    /**\n     * Remember whether the reader is at the bottom, before the next batch lands.\n     *\n     * A thread that always scrolls to the newest message yanks somebody out of the\n     * history they were reading, every time anyone types. So the jump only happens\n     * when they were already at the bottom — the same rule every chat app converges\n     * on. The 48px slack covers a partially visible last row.\n     */\n    const trackPosition = (): void => {\n        const node = thread.current;\n        if (!node) return;\n        const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n        stuckToBottom.current = distance < 48;\n    };\n\n    useLayoutEffect(() => {\n        const node = thread.current;\n        if (!node || !stuckToBottom.current) return;\n        node.scrollTop = node.scrollHeight;\n    }, [messages, typing]);\n\n    useEffect(() => {\n        const node = thread.current;\n        if (!node) return;\n        node.scrollTop = node.scrollHeight;\n        // Mount lands on the newest message; from then on `trackPosition` decides.\n    }, []);\n\n    const typingText = typingLabel(typing, locale);\n\n    return (\n        <div className={cn(styles.panel, className)} {...rest}>\n            {header && <header className={styles.header}>{header}</header>}\n\n            <div\n                ref={thread}\n                className={styles.thread}\n                onScroll={trackPosition}\n                role=\"log\"\n                aria-live=\"polite\"\n                aria-relevant=\"additions text\"\n                tabIndex={0}\n                aria-label={strings.thread}\n            >\n                {messages.length === 0\n                    ? (emptyState ?? <EmptyState title={strings.empty} />)\n                    : sections.map((section) =>\n                          section.kind === \"day\" ? (\n                              <div key={section.key} className={styles.day}>\n                                  <span className={styles.dayLabel}>\n                                      {dayLabel(section.date, { locale, now })}\n                                  </span>\n                              </div>\n                          ) : (\n                              <div\n                                  key={section.key}\n                                  className={cn(styles.run, section.own && styles.ownRun)}\n                              >\n                                  {renderAvatar && (\n                                      <div className={styles.avatar} aria-hidden=\"true\">\n                                          {renderAvatar(section.messages[0])}\n                                      </div>\n                                  )}\n                                  <div className={styles.runBody}>\n                                      <span className={styles.author}>\n                                          {section.own\n                                              ? strings.you\n                                              : (section.authorName ?? section.authorId)}\n                                      </span>\n                                      <ul className={styles.bubbles}>\n                                          {section.messages.map((message) => (\n                                              <li key={message.id} className={styles.bubbleRow}>\n                                                  <div\n                                                      className={cn(\n                                                          styles.bubble,\n                                                          section.own && styles.ownBubble,\n                                                          message.status === \"failed\" &&\n                                                              styles.failedBubble,\n                                                      )}\n                                                  >\n                                                      <div className={styles.body}>\n                                                          {message.body}\n                                                      </div>\n                                                      <div className={styles.meta}>\n                                                          <time\n                                                              dateTime={new Date(\n                                                                  message.sentAt,\n                                                              ).toISOString()}\n                                                          >\n                                                              {timeLabel(message.sentAt, locale)}\n                                                          </time>\n                                                          {section.own && message.status && (\n                                                              <span\n                                                                  className={cn(\n                                                                      styles.status,\n                                                                      message.status === \"failed\" &&\n                                                                          styles.statusFailed,\n                                                                  )}\n                                                                  title={strings[message.status]}\n                                                              >\n                                                                  <span aria-hidden=\"true\">\n                                                                      {STATUS_GLYPH[message.status]}\n                                                                  </span>\n                                                                  <VisuallyHidden>\n                                                                      {strings[message.status]}\n                                                                  </VisuallyHidden>\n                                                              </span>\n                                                          )}\n                                                      </div>\n                                                  </div>\n                                                  {message.status === \"failed\" && onRetry && (\n                                                      <button\n                                                          type=\"button\"\n                                                          className={styles.retry}\n                                                          onClick={() => onRetry(message)}\n                                                      >\n                                                          {strings.retry}\n                                                      </button>\n                                                  )}\n                                              </li>\n                                          ))}\n                                      </ul>\n                                  </div>\n                              </div>\n                          ),\n                      )}\n            </div>\n\n            {typingText && (\n                <p className={styles.typing} aria-live=\"polite\">\n                    {typingText}\n                </p>\n            )}\n\n            {onSend && (\n                <ChatComposer\n                    ref={composer}\n                    onSend={onSend}\n                    locale={locale}\n                    placeholder={placeholder}\n                    actions={composerActions}\n                    disabled={composerDisabled}\n                    onError={onSendError}\n                />\n            )}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Chat/Chat.js

@@ -26,7 +26,7 @@ function g({ messages: g, currentUserId: _, onSend: v, onRetry: y, typing: b = [
 	};
 	d(() => {
 		let e = I.current;
-		!e || !L.current || (e.scrollTop = e.scrollHeight);
+		e && L.current && (e.scrollTop = e.scrollHeight);
 	}, [g, b]), u(() => {
 		let e = I.current;
 		e && (e.scrollTop = e.scrollHeight);

package/dist/components/Chat/Chat.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chat.js","names":[],"sources":["../../../src/components/Chat/Chat.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — message grouping needs\n * more context than a list does: currentUserId to decide sides, groupWindowMs and\n * now to decide where a bubble group breaks, typing for the indicator. The remaining\n * props are the composer's (placeholder, composerActions, composerDisabled, onSend,\n * onSendError) and the slots (renderAvatar, header, emptyState).\n */\nimport { useEffect, useLayoutEffect, useRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { EmptyState } from \"../EmptyState\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { ChatComposer, type ChatComposerHandle } from \"./ChatComposer\";\nimport {\n    chatStrings,\n    dayLabel,\n    groupMessages,\n    timeLabel,\n    typingLabel,\n    type ChatMessage,\n} from \"./chat-groups\";\nimport styles from \"./Chat.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onSubmit\";\n\nexport interface ChatProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** The thread, **oldest first**. Never reordered by the component. */\n    messages: readonly ChatMessage[];\n    /** Author id treated as \"own\" — decides side, colour and status ticks. */\n    currentUserId?: string;\n    /** Renders the composer when given. Receives the trimmed text. */\n    onSend?: (text: string) => void | Promise<void>;\n    /** Enables the retry control on a `\"failed\"` message. */\n    onRetry?: (message: ChatMessage) => void;\n    /** Names currently typing. One, two or a count is phrased for you. */\n    typing?: readonly string[];\n    /** Avatar for the first message of a run — an `<Avatar>`, an `<Icon>`. */\n    renderAvatar?: (message: ChatMessage) => ReactNode;\n    /** Rendered above the thread, inside the panel. */\n    header?: ReactNode;\n    /** Shown when there are no messages. */\n    emptyState?: ReactNode;\n    /** Gap that still keeps consecutive messages in one run. Default 5 min. */\n    groupWindowMs?: number;\n    /** Locale for labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Reference instant for \"Hoje\"/\"Ontem\". Default: now, at render time. */\n    now?: number;\n    /** Placeholder for the composer. */\n    placeholder?: string;\n    /** Extra controls inside the composer, before the send button. */\n    composerActions?: ReactNode;\n    /** Disable the composer — no permission, thread archived, offline. */\n    composerDisabled?: boolean;\n    /** Called when `onSend` rejects. The draft stays in the field either way. */\n    onSendError?: (error: unknown) => void;\n}\n\n/** Status glyph and label for an outgoing message. */\nconst STATUS_GLYPH: Record<NonNullable<ChatMessage[\"status\"]>, string> = {\n    sending: \"◌\",\n    sent: \"✓\",\n    read: \"✓✓\",\n    failed: \"!\",\n};\n\n/**\n * A message thread: grouped by author and by day, own messages on one side, with\n * delivery state, a typing indicator and an optional composer.\n *\n * Presentational and controlled, like the rest of the SDK: it takes a list and\n * emits intent (`onSend`, `onRetry`). Where messages come from — REST, the SDK's\n * `createWebSocket`, an SSE stream — and how an optimistic insert is done stay with\n * the app, because those differ per backend and a component that assumed one would\n * be wrong for most.\n *\n * It works as a comment thread too: that is the same component with\n * `currentUserId` set and no `typing`.\n *\n * @example\n * <Chat\n *     messages={messages}\n *     currentUserId={me.id}\n *     typing={typingNames}\n *     onSend={(text) => send({ text })}\n *     onRetry={(message) => resend(message.id)}\n * />\n */\nexport function Chat({\n    messages,\n    currentUserId,\n    onSend,\n    onRetry,\n    typing = [],\n    renderAvatar,\n    header,\n    emptyState,\n    groupWindowMs,\n    locale = \"pt-BR\",\n    now,\n    placeholder,\n    composerActions,\n    composerDisabled,\n    onSendError,\n    className,\n    ...rest\n}: ChatProps) {\n    const strings = chatStrings(locale);\n    const sections = groupMessages({ messages, currentUserId, windowMs: groupWindowMs });\n    const composer = useRef<ChatComposerHandle | null>(null);\n    const thread = useRef<HTMLDivElement | null>(null);\n    const stuckToBottom = useRef(true);\n\n    /**\n     * Remember whether the reader is at the bottom, before the next batch lands.\n     *\n     * A thread that always scrolls to the newest message yanks somebody out of the\n     * history they were reading, every time anyone types. So the jump only happens\n     * when they were already at the bottom — the same rule every chat app converges\n     * on. The 48px slack covers a partially visible last row.\n     */\n    const trackPosition = (): void => {\n        const node = thread.current;\n        if (!node) return;\n        const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n        stuckToBottom.current = distance < 48;\n    };\n\n    useLayoutEffect(() => {\n        const node = thread.current;\n        if (!node || !stuckToBottom.current) return;\n        node.scrollTop = node.scrollHeight;\n    }, [messages, typing]);\n\n    useEffect(() => {\n        const node = thread.current;\n        if (!node) return;\n        node.scrollTop = node.scrollHeight;\n        // Mount lands on the newest message; from then on `trackPosition` decides.\n    }, []);\n\n    const typingText = typingLabel(typing, locale);\n\n    return (\n        <div className={cn(styles.panel, className)} {...rest}>\n            {header && <header className={styles.header}>{header}</header>}\n\n            <div\n                ref={thread}\n                className={styles.thread}\n                onScroll={trackPosition}\n                role=\"log\"\n                aria-live=\"polite\"\n                aria-relevant=\"additions text\"\n                tabIndex={0}\n                aria-label={strings.thread}\n            >\n                {messages.length === 0\n                    ? (emptyState ?? <EmptyState title={strings.empty} />)\n                    : sections.map((section) =>\n                          section.kind === \"day\" ? (\n                              <div key={section.key} className={styles.day}>\n                                  <span className={styles.dayLabel}>\n                                      {dayLabel(section.date, { locale, now })}\n                                  </span>\n                              </div>\n                          ) : (\n                              <div\n                                  key={section.key}\n                                  className={cn(styles.run, section.own && styles.ownRun)}\n                              >\n                                  {renderAvatar && (\n                                      <div className={styles.avatar} aria-hidden=\"true\">\n                                          {renderAvatar(section.messages[0])}\n                                      </div>\n                                  )}\n                                  <div className={styles.runBody}>\n                                      <span className={styles.author}>\n                                          {section.own\n                                              ? strings.you\n                                              : (section.authorName ?? section.authorId)}\n                                      </span>\n                                      <ul className={styles.bubbles}>\n                                          {section.messages.map((message) => (\n                                              <li key={message.id} className={styles.bubbleRow}>\n                                                  <div\n                                                      className={cn(\n                                                          styles.bubble,\n                                                          section.own && styles.ownBubble,\n                                                          message.status === \"failed\" &&\n                                                              styles.failedBubble,\n                                                      )}\n                                                  >\n                                                      <div className={styles.body}>\n                                                          {message.body}\n                                                      </div>\n                                                      <div className={styles.meta}>\n                                                          <time\n                                                              dateTime={new Date(\n                                                                  message.sentAt,\n                                                              ).toISOString()}\n                                                          >\n                                                              {timeLabel(message.sentAt, locale)}\n                                                          </time>\n                                                          {section.own && message.status && (\n                                                              <span\n                                                                  className={cn(\n                                                                      styles.status,\n                                                                      message.status === \"failed\" &&\n                                                                          styles.statusFailed,\n                                                                  )}\n                                                                  title={strings[message.status]}\n                                                              >\n                                                                  <span aria-hidden=\"true\">\n                                                                      {STATUS_GLYPH[message.status]}\n                                                                  </span>\n                                                                  <VisuallyHidden>\n                                                                      {strings[message.status]}\n                                                                  </VisuallyHidden>\n                                                              </span>\n                                                          )}\n                                                      </div>\n                                                  </div>\n                                                  {message.status === \"failed\" && onRetry && (\n                                                      <button\n                                                          type=\"button\"\n                                                          className={styles.retry}\n                                                          onClick={() => onRetry(message)}\n                                                      >\n                                                          {strings.retry}\n                                                      </button>\n                                                  )}\n                                              </li>\n                                          ))}\n                                      </ul>\n                                  </div>\n                              </div>\n                          ),\n                      )}\n            </div>\n\n            {typingText && (\n                <p className={styles.typing} aria-live=\"polite\">\n                    {typingText}\n                </p>\n            )}\n\n            {onSend && (\n                <ChatComposer\n                    ref={composer}\n                    onSend={onSend}\n                    locale={locale}\n                    placeholder={placeholder}\n                    actions={composerActions}\n                    disabled={composerDisabled}\n                    onError={onSendError}\n                />\n            )}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Chat.js","names":[],"sources":["../../../src/components/Chat/Chat.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — message grouping needs\n * more context than a list does: currentUserId to decide sides, groupWindowMs and\n * now to decide where a bubble group breaks, typing for the indicator. The remaining\n * props are the composer's (placeholder, composerActions, composerDisabled, onSend,\n * onSendError) and the slots (renderAvatar, header, emptyState).\n */\nimport { useEffect, useLayoutEffect, useRef, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { EmptyState } from \"../EmptyState\";\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport { ChatComposer, type ChatComposerHandle } from \"./ChatComposer\";\nimport {\n    chatStrings,\n    dayLabel,\n    groupMessages,\n    timeLabel,\n    typingLabel,\n    type ChatMessage,\n} from \"./chat-groups\";\nimport styles from \"./Chat.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onSubmit\";\n\nexport interface ChatProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** The thread, **oldest first**. Never reordered by the component. */\n    messages: readonly ChatMessage[];\n    /** Author id treated as \"own\" — decides side, colour and status ticks. */\n    currentUserId?: string;\n    /** Renders the composer when given. Receives the trimmed text. */\n    onSend?: (text: string) => void | Promise<void>;\n    /** Enables the retry control on a `\"failed\"` message. */\n    onRetry?: (message: ChatMessage) => void;\n    /** Names currently typing. One, two or a count is phrased for you. */\n    typing?: readonly string[];\n    /** Avatar for the first message of a run — an `<Avatar>`, an `<Icon>`. */\n    renderAvatar?: (message: ChatMessage) => ReactNode;\n    /** Rendered above the thread, inside the panel. */\n    header?: ReactNode;\n    /** Shown when there are no messages. */\n    emptyState?: ReactNode;\n    /** Gap that still keeps consecutive messages in one run. Default 5 min. */\n    groupWindowMs?: number;\n    /** Locale for labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Reference instant for \"Hoje\"/\"Ontem\". Default: now, at render time. */\n    now?: number;\n    /** Placeholder for the composer. */\n    placeholder?: string;\n    /** Extra controls inside the composer, before the send button. */\n    composerActions?: ReactNode;\n    /** Disable the composer — no permission, thread archived, offline. */\n    composerDisabled?: boolean;\n    /** Called when `onSend` rejects. The draft stays in the field either way. */\n    onSendError?: (error: unknown) => void;\n}\n\n/** Status glyph and label for an outgoing message. */\nconst STATUS_GLYPH: Record<NonNullable<ChatMessage[\"status\"]>, string> = {\n    sending: \"◌\",\n    sent: \"✓\",\n    read: \"✓✓\",\n    failed: \"!\",\n};\n\n/**\n * A message thread: grouped by author and by day, own messages on one side, with\n * delivery state, a typing indicator and an optional composer.\n *\n * Presentational and controlled, like the rest of the SDK: it takes a list and\n * emits intent (`onSend`, `onRetry`). Where messages come from — REST, the SDK's\n * `createWebSocket`, an SSE stream — and how an optimistic insert is done stay with\n * the app, because those differ per backend and a component that assumed one would\n * be wrong for most.\n *\n * It works as a comment thread too: that is the same component with\n * `currentUserId` set and no `typing`.\n *\n * @example\n * <Chat\n *     messages={messages}\n *     currentUserId={me.id}\n *     typing={typingNames}\n *     onSend={(text) => send({ text })}\n *     onRetry={(message) => resend(message.id)}\n * />\n */\nexport function Chat({\n    messages,\n    currentUserId,\n    onSend,\n    onRetry,\n    typing = [],\n    renderAvatar,\n    header,\n    emptyState,\n    groupWindowMs,\n    locale = \"pt-BR\",\n    now,\n    placeholder,\n    composerActions,\n    composerDisabled,\n    onSendError,\n    className,\n    ...rest\n}: ChatProps) {\n    const strings = chatStrings(locale);\n    const sections = groupMessages({ messages, currentUserId, windowMs: groupWindowMs });\n    const composer = useRef<ChatComposerHandle | null>(null);\n    const thread = useRef<HTMLDivElement | null>(null);\n    const stuckToBottom = useRef(true);\n\n    /**\n     * Remember whether the reader is at the bottom, before the next batch lands.\n     *\n     * A thread that always scrolls to the newest message yanks somebody out of the\n     * history they were reading, every time anyone types. So the jump only happens\n     * when they were already at the bottom — the same rule every chat app converges\n     * on. The 48px slack covers a partially visible last row.\n     */\n    const trackPosition = (): void => {\n        const node = thread.current;\n        if (!node) return;\n        const distance = node.scrollHeight - node.scrollTop - node.clientHeight;\n        stuckToBottom.current = distance < 48;\n    };\n\n    useLayoutEffect(() => {\n        const node = thread.current;\n        if (!node || !stuckToBottom.current) return;\n        node.scrollTop = node.scrollHeight;\n    }, [messages, typing]);\n\n    useEffect(() => {\n        const node = thread.current;\n        if (!node) return;\n        node.scrollTop = node.scrollHeight;\n        // Mount lands on the newest message; from then on `trackPosition` decides.\n    }, []);\n\n    const typingText = typingLabel(typing, locale);\n\n    return (\n        <div className={cn(styles.panel, className)} {...rest}>\n            {header && <header className={styles.header}>{header}</header>}\n\n            <div\n                ref={thread}\n                className={styles.thread}\n                onScroll={trackPosition}\n                role=\"log\"\n                aria-live=\"polite\"\n                aria-relevant=\"additions text\"\n                tabIndex={0}\n                aria-label={strings.thread}\n            >\n                {messages.length === 0\n                    ? (emptyState ?? <EmptyState title={strings.empty} />)\n                    : sections.map((section) =>\n                          section.kind === \"day\" ? (\n                              <div key={section.key} className={styles.day}>\n                                  <span className={styles.dayLabel}>\n                                      {dayLabel(section.date, { locale, now })}\n                                  </span>\n                              </div>\n                          ) : (\n                              <div\n                                  key={section.key}\n                                  className={cn(styles.run, section.own && styles.ownRun)}\n                              >\n                                  {renderAvatar && (\n                                      <div className={styles.avatar} aria-hidden=\"true\">\n                                          {renderAvatar(section.messages[0])}\n                                      </div>\n                                  )}\n                                  <div className={styles.runBody}>\n                                      <span className={styles.author}>\n                                          {section.own\n                                              ? strings.you\n                                              : (section.authorName ?? section.authorId)}\n                                      </span>\n                                      <ul className={styles.bubbles}>\n                                          {section.messages.map((message) => (\n                                              <li key={message.id} className={styles.bubbleRow}>\n                                                  <div\n                                                      className={cn(\n                                                          styles.bubble,\n                                                          section.own && styles.ownBubble,\n                                                          message.status === \"failed\" &&\n                                                              styles.failedBubble,\n                                                      )}\n                                                  >\n                                                      <div className={styles.body}>\n                                                          {message.body}\n                                                      </div>\n                                                      <div className={styles.meta}>\n                                                          <time\n                                                              dateTime={new Date(\n                                                                  message.sentAt,\n                                                              ).toISOString()}\n                                                          >\n                                                              {timeLabel(message.sentAt, locale)}\n                                                          </time>\n                                                          {section.own && message.status && (\n                                                              <span\n                                                                  className={cn(\n                                                                      styles.status,\n                                                                      message.status === \"failed\" &&\n                                                                          styles.statusFailed,\n                                                                  )}\n                                                                  title={strings[message.status]}\n                                                              >\n                                                                  <span aria-hidden=\"true\">\n                                                                      {STATUS_GLYPH[message.status]}\n                                                                  </span>\n                                                                  <VisuallyHidden>\n                                                                      {strings[message.status]}\n                                                                  </VisuallyHidden>\n                                                              </span>\n                                                          )}\n                                                      </div>\n                                                  </div>\n                                                  {message.status === \"failed\" && onRetry && (\n                                                      <button\n                                                          type=\"button\"\n                                                          className={styles.retry}\n                                                          onClick={() => onRetry(message)}\n                                                      >\n                                                          {strings.retry}\n                                                      </button>\n                                                  )}\n                                              </li>\n                                          ))}\n                                      </ul>\n                                  </div>\n                              </div>\n                          ),\n                      )}\n            </div>\n\n            {typingText && (\n                <p className={styles.typing} aria-live=\"polite\">\n                    {typingText}\n                </p>\n            )}\n\n            {onSend && (\n                <ChatComposer\n                    ref={composer}\n                    onSend={onSend}\n                    locale={locale}\n                    placeholder={placeholder}\n                    actions={composerActions}\n                    disabled={composerDisabled}\n                    onError={onSendError}\n                />\n            )}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/FilterBar/FilterBar.cjs

@@ -1,2 +1,2 @@
-const e=require("../../utils/cn.cjs"),t=require("../VisuallyHidden/VisuallyHidden.cjs"),n=require("./filter-model.cjs"),r=require("./FilterBar.module.cjs");let i=require("react"),a=require("react/jsx-runtime");function o(e){return{field:e.name,operator:n.defaultOperator(e),value:``,to:``}}function s(e){return n.isValueless(e.operator)?{field:e.field,operator:e.operator}:e.operator===`between`?{field:e.field,operator:e.operator,value:[e.value,e.to]}:n.isMulti(e.operator)?{field:e.field,operator:e.operator,value:e.value.split(`,`).map(e=>e.trim()).filter(Boolean)}:{field:e.field,operator:e.operator,value:e.value}}function c({fields:c,value:u,onChange:d,locale:f=`pt-BR`,actions:p,className:m,...h}){let g=n.filterStrings(f),_=(0,i.useId)(),[v,y]=(0,i.useState)(null),b=v?c.find(e=>e.name===v.field):void 0,x=v?s(v):null,S=x!==null&&n.isComplete(x),C=()=>{c.length>0&&y(o(c[0]))},w=()=>{!x||!S||(d([...u,x]),y(null))},T=e=>{d(u.filter((t,n)=>n!==e))};return(0,a.jsxs)(`div`,{className:e.cn(r.default.bar,m),...h,children:[(0,a.jsxs)(`ul`,{className:r.default.chips,children:[u.length===0&&!v&&(0,a.jsx)(`li`,{className:r.default.empty,children:g.empty}),u.map((e,t)=>{let i=n.describeFilter(e,c,f);return(0,a.jsxs)(`li`,{className:r.default.chip,children:[(0,a.jsx)(`span`,{children:i}),(0,a.jsx)(`button`,{type:`button`,className:r.default.remove,"aria-label":g.remove(i),onClick:()=>T(t),children:`×`})]},`${e.field}-${e.operator}-${t}`)})]}),v&&b?(0,a.jsxs)(`div`,{className:r.default.editor,role:`group`,"aria-label":g.add,children:[(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:g.field}),(0,a.jsx)(`select`,{className:r.default.select,value:v.field,onChange:e=>{let t=c.find(t=>t.name===e.target.value);t&&y(o(t))},children:c.map(e=>(0,a.jsx)(`option`,{value:e.name,children:e.label},e.name))})]}),(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:g.operator}),(0,a.jsx)(`select`,{className:r.default.select,value:v.operator,onChange:e=>y({...v,operator:e.target.value,value:``,to:``}),children:n.operatorsFor(b).map(e=>(0,a.jsx)(`option`,{value:e,children:n.operatorLabel(e,f)},e))})]}),!n.isValueless(v.operator)&&(0,a.jsx)(l,{id:`${_}-value`,field:b,draft:v,strings:g,onChange:y}),(0,a.jsx)(`button`,{type:`button`,className:r.default.primary,disabled:!S,onClick:w,children:g.apply}),(0,a.jsx)(`button`,{type:`button`,className:r.default.ghost,onClick:()=>y(null),children:g.cancel})]}):(0,a.jsxs)(`div`,{className:r.default.actions,children:[(0,a.jsxs)(`button`,{type:`button`,className:r.default.secondary,disabled:c.length===0,onClick:C,children:[`+ `,g.add]}),u.length>0&&(0,a.jsx)(`button`,{type:`button`,className:r.default.ghost,onClick:()=>d([]),children:g.clear}),p]}),(0,a.jsx)(t.VisuallyHidden,{"aria-live":`polite`,role:`status`,children:g.active(u.length)})]})}function l({id:e,field:i,draft:o,strings:s,onChange:c}){let l=i.type===`number`?`number`:i.type===`date`?`date`:`text`;return i.type===`select`&&!n.isMulti(o.operator)?(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.value}),(0,a.jsxs)(`select`,{id:e,className:r.default.select,value:o.value,onChange:e=>c({...o,value:e.target.value}),children:[(0,a.jsx)(`option`,{value:``,children:`—`}),i.options?.map(e=>(0,a.jsx)(`option`,{value:e.value,children:e.label},e.value))]})]}):i.type===`boolean`?(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.value}),(0,a.jsxs)(`select`,{id:e,className:r.default.select,value:o.value,onChange:e=>c({...o,value:e.target.value}),children:[(0,a.jsx)(`option`,{value:``,children:`—`}),(0,a.jsx)(`option`,{value:`true`,children:s.yes}),(0,a.jsx)(`option`,{value:`false`,children:s.no})]})]}):o.operator===`between`?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.from}),(0,a.jsx)(`input`,{id:e,className:r.default.input,type:l,value:o.value,placeholder:s.from,onChange:e=>c({...o,value:e.target.value})})]}),(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.to}),(0,a.jsx)(`input`,{className:r.default.input,type:l,value:o.to,placeholder:s.to,onChange:e=>c({...o,to:e.target.value})})]})]}):(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.value}),(0,a.jsx)(`input`,{id:e,className:r.default.input,type:l,value:o.value,placeholder:i.placeholder??s.value,onChange:e=>c({...o,value:e.target.value})})]})}exports.FilterBar=c;
+const e=require("../../utils/cn.cjs"),t=require("../VisuallyHidden/VisuallyHidden.cjs"),n=require("./filter-model.cjs"),r=require("./FilterBar.module.cjs");let i=require("react"),a=require("react/jsx-runtime");function o(e){return{field:e.name,operator:n.defaultOperator(e),value:``,to:``}}function s(e){return n.isValueless(e.operator)?{field:e.field,operator:e.operator}:e.operator===`between`?{field:e.field,operator:e.operator,value:[e.value,e.to]}:n.isMulti(e.operator)?{field:e.field,operator:e.operator,value:e.value.split(`,`).map(e=>e.trim()).filter(Boolean)}:{field:e.field,operator:e.operator,value:e.value}}function c({fields:c,value:u,onChange:d,locale:f=`pt-BR`,actions:p,className:m,...h}){let g=n.filterStrings(f),_=(0,i.useId)(),[v,y]=(0,i.useState)(null),b=v?c.find(e=>e.name===v.field):void 0,x=v?s(v):null,S=x!==null&&n.isComplete(x),C=()=>{c.length>0&&y(o(c[0]))},w=()=>{x&&S&&(d([...u,x]),y(null))},T=e=>{d(u.filter((t,n)=>n!==e))};return(0,a.jsxs)(`div`,{className:e.cn(r.default.bar,m),...h,children:[(0,a.jsxs)(`ul`,{className:r.default.chips,children:[u.length===0&&!v&&(0,a.jsx)(`li`,{className:r.default.empty,children:g.empty}),u.map((e,t)=>{let i=n.describeFilter(e,c,f);return(0,a.jsxs)(`li`,{className:r.default.chip,children:[(0,a.jsx)(`span`,{children:i}),(0,a.jsx)(`button`,{type:`button`,className:r.default.remove,"aria-label":g.remove(i),onClick:()=>T(t),children:`×`})]},`${e.field}-${e.operator}-${t}`)})]}),v&&b?(0,a.jsxs)(`div`,{className:r.default.editor,role:`group`,"aria-label":g.add,children:[(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:g.field}),(0,a.jsx)(`select`,{className:r.default.select,value:v.field,onChange:e=>{let t=c.find(t=>t.name===e.target.value);t&&y(o(t))},children:c.map(e=>(0,a.jsx)(`option`,{value:e.name,children:e.label},e.name))})]}),(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:g.operator}),(0,a.jsx)(`select`,{className:r.default.select,value:v.operator,onChange:e=>y({...v,operator:e.target.value,value:``,to:``}),children:n.operatorsFor(b).map(e=>(0,a.jsx)(`option`,{value:e,children:n.operatorLabel(e,f)},e))})]}),!n.isValueless(v.operator)&&(0,a.jsx)(l,{id:`${_}-value`,field:b,draft:v,strings:g,onChange:y}),(0,a.jsx)(`button`,{type:`button`,className:r.default.primary,disabled:!S,onClick:w,children:g.apply}),(0,a.jsx)(`button`,{type:`button`,className:r.default.ghost,onClick:()=>y(null),children:g.cancel})]}):(0,a.jsxs)(`div`,{className:r.default.actions,children:[(0,a.jsxs)(`button`,{type:`button`,className:r.default.secondary,disabled:c.length===0,onClick:C,children:[`+ `,g.add]}),u.length>0&&(0,a.jsx)(`button`,{type:`button`,className:r.default.ghost,onClick:()=>d([]),children:g.clear}),p]}),(0,a.jsx)(t.VisuallyHidden,{"aria-live":`polite`,role:`status`,children:g.active(u.length)})]})}function l({id:e,field:i,draft:o,strings:s,onChange:c}){let l=i.type===`number`?`number`:i.type===`date`?`date`:`text`;return i.type===`select`&&!n.isMulti(o.operator)?(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.value}),(0,a.jsxs)(`select`,{id:e,className:r.default.select,value:o.value,onChange:e=>c({...o,value:e.target.value}),children:[(0,a.jsx)(`option`,{value:``,children:`—`}),i.options?.map(e=>(0,a.jsx)(`option`,{value:e.value,children:e.label},e.value))]})]}):i.type===`boolean`?(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.value}),(0,a.jsxs)(`select`,{id:e,className:r.default.select,value:o.value,onChange:e=>c({...o,value:e.target.value}),children:[(0,a.jsx)(`option`,{value:``,children:`—`}),(0,a.jsx)(`option`,{value:`true`,children:s.yes}),(0,a.jsx)(`option`,{value:`false`,children:s.no})]})]}):o.operator===`between`?(0,a.jsxs)(a.Fragment,{children:[(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.from}),(0,a.jsx)(`input`,{id:e,className:r.default.input,type:l,value:o.value,placeholder:s.from,onChange:e=>c({...o,value:e.target.value})})]}),(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.to}),(0,a.jsx)(`input`,{className:r.default.input,type:l,value:o.to,placeholder:s.to,onChange:e=>c({...o,to:e.target.value})})]})]}):(0,a.jsxs)(`label`,{className:r.default.control,children:[(0,a.jsx)(t.VisuallyHidden,{children:s.value}),(0,a.jsx)(`input`,{id:e,className:r.default.input,type:l,value:o.value,placeholder:i.placeholder??s.value,onChange:e=>c({...o,value:e.target.value})})]})}exports.FilterBar=c;
 //# sourceMappingURL=FilterBar.cjs.map

package/dist/components/FilterBar/FilterBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBar.cjs","names":[],"sources":["../../../src/components/FilterBar/FilterBar.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, function-lines — a filter bar renders a different\n * editor per filter kind — select, multi-select, range, date range, text — and the\n * body is that dispatch plus the chip summary, both reading the same value map.\n */\nimport { useId, useState, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport {\n    defaultOperator,\n    describeFilter,\n    filterStrings,\n    isComplete,\n    isMulti,\n    isValueless,\n    operatorLabel,\n    operatorsFor,\n    type Filter,\n    type FilterField,\n} from \"./filter-model\";\nimport styles from \"./FilterBar.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onChange\";\n\nexport interface FilterBarProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** Fields the user may filter by. */\n    fields: readonly FilterField[];\n    /** Applied filters. Controlled. */\n    value: readonly Filter[];\n    /** Next filter set. Combined with AND. */\n    onChange: (filters: Filter[]) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Rendered at the end of the bar — a \"save this view\" button, a counter. */\n    actions?: ReactNode;\n}\n\n/** The draft filter being built in the editor. */\ninterface Draft {\n    field: string;\n    operator: Filter[\"operator\"];\n    value: string;\n    to: string;\n}\n\n/** A fresh draft for a field. */\nfunction draftFor(field: FilterField): Draft {\n    return { field: field.name, operator: defaultOperator(field), value: \"\", to: \"\" };\n}\n\n/** Turn a draft into a filter. */\nfunction toFilter(draft: Draft): Filter {\n    if (isValueless(draft.operator)) return { field: draft.field, operator: draft.operator };\n    if (draft.operator === \"between\") {\n        return { field: draft.field, operator: draft.operator, value: [draft.value, draft.to] };\n    }\n    if (isMulti(draft.operator)) {\n        return {\n            field: draft.field,\n            operator: draft.operator,\n            value: draft.value\n                .split(\",\")\n                .map((part) => part.trim())\n                .filter(Boolean),\n        };\n    }\n    return { field: draft.field, operator: draft.operator, value: draft.value };\n}\n\n/**\n * A row of applied filters, and a small editor to add another.\n *\n * Filters are combined with **AND**, flat — no nested `(a OR b) AND c` groups. That\n * is the shape of nearly every admin list (\"status is paid, created after March,\n * text contains nota\"), and it is what serializes into a URL somebody can send to a\n * colleague. Nested groups need a tree UI with per-node operators and a different\n * serialization; a component trying to be both is clumsy at the common case.\n *\n * Controlled, like the rest of the SDK: it holds the half-typed draft in the editor\n * and nothing else. The applied set is the app's, which is what lets it come from —\n * and go back into — the URL.\n *\n * @example\n * const [filters, setFilters] = useState<Filter[]>(() =>\n *     filtersFromSearchParams(new URLSearchParams(location.search), FIELDS),\n * );\n *\n * <FilterBar fields={FIELDS} value={filters} onChange={setFilters} />\n */\nexport function FilterBar({\n    fields,\n    value,\n    onChange,\n    locale = \"pt-BR\",\n    actions,\n    className,\n    ...rest\n}: FilterBarProps) {\n    const strings = filterStrings(locale);\n    const baseId = useId();\n    const [draft, setDraft] = useState<Draft | null>(null);\n\n    const field = draft ? fields.find((candidate) => candidate.name === draft.field) : undefined;\n    const pending = draft ? toFilter(draft) : null;\n    const ready = pending !== null && isComplete(pending);\n\n    const open = (): void => {\n        if (fields.length > 0) setDraft(draftFor(fields[0]));\n    };\n\n    const apply = (): void => {\n        if (!pending || !ready) return;\n        onChange([...value, pending]);\n        setDraft(null);\n    };\n\n    const removeAt = (index: number): void => {\n        onChange(value.filter((_, position) => position !== index));\n    };\n\n    return (\n        <div className={cn(styles.bar, className)} {...rest}>\n            <ul className={styles.chips}>\n                {value.length === 0 && !draft && <li className={styles.empty}>{strings.empty}</li>}\n                {value.map((filter, index) => {\n                    const description = describeFilter(filter, fields, locale);\n                    return (\n                        <li\n                            key={`${filter.field}-${filter.operator}-${index}`}\n                            className={styles.chip}\n                        >\n                            <span>{description}</span>\n                            <button\n                                type=\"button\"\n                                className={styles.remove}\n                                aria-label={strings.remove(description)}\n                                onClick={() => removeAt(index)}\n                            >\n                                ×\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n\n            {draft && field ? (\n                <div className={styles.editor} role=\"group\" aria-label={strings.add}>\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.field}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.field}\n                            onChange={(event) => {\n                                const next = fields.find(\n                                    (candidate) => candidate.name === event.target.value,\n                                );\n                                if (next) setDraft(draftFor(next));\n                            }}\n                        >\n                            {fields.map((candidate) => (\n                                <option key={candidate.name} value={candidate.name}>\n                                    {candidate.label}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.operator}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.operator}\n                            onChange={(event) =>\n                                setDraft({\n                                    ...draft,\n                                    operator: event.target.value as Filter[\"operator\"],\n                                    value: \"\",\n                                    to: \"\",\n                                })\n                            }\n                        >\n                            {operatorsFor(field).map((operator) => (\n                                <option key={operator} value={operator}>\n                                    {operatorLabel(operator, locale)}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    {!isValueless(draft.operator) && (\n                        <ValueInput\n                            id={`${baseId}-value`}\n                            field={field}\n                            draft={draft}\n                            strings={strings}\n                            onChange={setDraft}\n                        />\n                    )}\n\n                    <button\n                        type=\"button\"\n                        className={styles.primary}\n                        disabled={!ready}\n                        onClick={apply}\n                    >\n                        {strings.apply}\n                    </button>\n                    <button type=\"button\" className={styles.ghost} onClick={() => setDraft(null)}>\n                        {strings.cancel}\n                    </button>\n                </div>\n            ) : (\n                <div className={styles.actions}>\n                    <button\n                        type=\"button\"\n                        className={styles.secondary}\n                        disabled={fields.length === 0}\n                        onClick={open}\n                    >\n                        + {strings.add}\n                    </button>\n                    {value.length > 0 && (\n                        <button type=\"button\" className={styles.ghost} onClick={() => onChange([])}>\n                            {strings.clear}\n                        </button>\n                    )}\n                    {actions}\n                </div>\n            )}\n\n            <VisuallyHidden aria-live=\"polite\" role=\"status\">\n                {strings.active(value.length)}\n            </VisuallyHidden>\n        </div>\n    );\n}\n\n/**\n * The value input for the draft.\n *\n * The input type follows the **field**, not the operator: a date field gets a date\n * picker even under `between`, where two of them are needed. Typing a date into a\n * text box is the fastest way to produce a filter the backend cannot parse.\n */\nfunction ValueInput({\n    id,\n    field,\n    draft,\n    strings,\n    onChange,\n}: {\n    id: string;\n    field: FilterField;\n    draft: Draft;\n    strings: ReturnType<typeof filterStrings>;\n    onChange: (draft: Draft) => void;\n}) {\n    const type = field.type === \"number\" ? \"number\" : field.type === \"date\" ? \"date\" : \"text\";\n\n    if (field.type === \"select\" && !isMulti(draft.operator)) {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    {field.options?.map((option) => (\n                        <option key={option.value} value={option.value}>\n                            {option.label}\n                        </option>\n                    ))}\n                </select>\n            </label>\n        );\n    }\n\n    if (field.type === \"boolean\") {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    <option value=\"true\">{strings.yes}</option>\n                    <option value=\"false\">{strings.no}</option>\n                </select>\n            </label>\n        );\n    }\n\n    if (draft.operator === \"between\") {\n        return (\n            <>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.from}</VisuallyHidden>\n                    <input\n                        id={id}\n                        className={styles.input}\n                        type={type}\n                        value={draft.value}\n                        placeholder={strings.from}\n                        onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                    />\n                </label>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.to}</VisuallyHidden>\n                    <input\n                        className={styles.input}\n                        type={type}\n                        value={draft.to}\n                        placeholder={strings.to}\n                        onChange={(event) => onChange({ ...draft, to: event.target.value })}\n                    />\n                </label>\n            </>\n        );\n    }\n\n    return (\n        <label className={styles.control}>\n            <VisuallyHidden>{strings.value}</VisuallyHidden>\n            <input\n                id={id}\n                className={styles.input}\n                type={type}\n                value={draft.value}\n                placeholder={field.placeholder ?? strings.value}\n                onChange={(event) => onChange({ ...draft, value: event.target.value })}\n            />\n        </label>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"FilterBar.cjs","names":[],"sources":["../../../src/components/FilterBar/FilterBar.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, function-lines — a filter bar renders a different\n * editor per filter kind — select, multi-select, range, date range, text — and the\n * body is that dispatch plus the chip summary, both reading the same value map.\n */\nimport { useId, useState, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport {\n    defaultOperator,\n    describeFilter,\n    filterStrings,\n    isComplete,\n    isMulti,\n    isValueless,\n    operatorLabel,\n    operatorsFor,\n    type Filter,\n    type FilterField,\n} from \"./filter-model\";\nimport styles from \"./FilterBar.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onChange\";\n\nexport interface FilterBarProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** Fields the user may filter by. */\n    fields: readonly FilterField[];\n    /** Applied filters. Controlled. */\n    value: readonly Filter[];\n    /** Next filter set. Combined with AND. */\n    onChange: (filters: Filter[]) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Rendered at the end of the bar — a \"save this view\" button, a counter. */\n    actions?: ReactNode;\n}\n\n/** The draft filter being built in the editor. */\ninterface Draft {\n    field: string;\n    operator: Filter[\"operator\"];\n    value: string;\n    to: string;\n}\n\n/** A fresh draft for a field. */\nfunction draftFor(field: FilterField): Draft {\n    return { field: field.name, operator: defaultOperator(field), value: \"\", to: \"\" };\n}\n\n/** Turn a draft into a filter. */\nfunction toFilter(draft: Draft): Filter {\n    if (isValueless(draft.operator)) return { field: draft.field, operator: draft.operator };\n    if (draft.operator === \"between\") {\n        return { field: draft.field, operator: draft.operator, value: [draft.value, draft.to] };\n    }\n    if (isMulti(draft.operator)) {\n        return {\n            field: draft.field,\n            operator: draft.operator,\n            value: draft.value\n                .split(\",\")\n                .map((part) => part.trim())\n                .filter(Boolean),\n        };\n    }\n    return { field: draft.field, operator: draft.operator, value: draft.value };\n}\n\n/**\n * A row of applied filters, and a small editor to add another.\n *\n * Filters are combined with **AND**, flat — no nested `(a OR b) AND c` groups. That\n * is the shape of nearly every admin list (\"status is paid, created after March,\n * text contains nota\"), and it is what serializes into a URL somebody can send to a\n * colleague. Nested groups need a tree UI with per-node operators and a different\n * serialization; a component trying to be both is clumsy at the common case.\n *\n * Controlled, like the rest of the SDK: it holds the half-typed draft in the editor\n * and nothing else. The applied set is the app's, which is what lets it come from —\n * and go back into — the URL.\n *\n * @example\n * const [filters, setFilters] = useState<Filter[]>(() =>\n *     filtersFromSearchParams(new URLSearchParams(location.search), FIELDS),\n * );\n *\n * <FilterBar fields={FIELDS} value={filters} onChange={setFilters} />\n */\nexport function FilterBar({\n    fields,\n    value,\n    onChange,\n    locale = \"pt-BR\",\n    actions,\n    className,\n    ...rest\n}: FilterBarProps) {\n    const strings = filterStrings(locale);\n    const baseId = useId();\n    const [draft, setDraft] = useState<Draft | null>(null);\n\n    const field = draft ? fields.find((candidate) => candidate.name === draft.field) : undefined;\n    const pending = draft ? toFilter(draft) : null;\n    const ready = pending !== null && isComplete(pending);\n\n    const open = (): void => {\n        if (fields.length > 0) setDraft(draftFor(fields[0]));\n    };\n\n    const apply = (): void => {\n        if (!pending || !ready) return;\n        onChange([...value, pending]);\n        setDraft(null);\n    };\n\n    const removeAt = (index: number): void => {\n        onChange(value.filter((_, position) => position !== index));\n    };\n\n    return (\n        <div className={cn(styles.bar, className)} {...rest}>\n            <ul className={styles.chips}>\n                {value.length === 0 && !draft && <li className={styles.empty}>{strings.empty}</li>}\n                {value.map((filter, index) => {\n                    const description = describeFilter(filter, fields, locale);\n                    return (\n                        <li\n                            key={`${filter.field}-${filter.operator}-${index}`}\n                            className={styles.chip}\n                        >\n                            <span>{description}</span>\n                            <button\n                                type=\"button\"\n                                className={styles.remove}\n                                aria-label={strings.remove(description)}\n                                onClick={() => removeAt(index)}\n                            >\n                                ×\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n\n            {draft && field ? (\n                <div className={styles.editor} role=\"group\" aria-label={strings.add}>\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.field}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.field}\n                            onChange={(event) => {\n                                const next = fields.find(\n                                    (candidate) => candidate.name === event.target.value,\n                                );\n                                if (next) setDraft(draftFor(next));\n                            }}\n                        >\n                            {fields.map((candidate) => (\n                                <option key={candidate.name} value={candidate.name}>\n                                    {candidate.label}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.operator}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.operator}\n                            onChange={(event) =>\n                                setDraft({\n                                    ...draft,\n                                    operator: event.target.value as Filter[\"operator\"],\n                                    value: \"\",\n                                    to: \"\",\n                                })\n                            }\n                        >\n                            {operatorsFor(field).map((operator) => (\n                                <option key={operator} value={operator}>\n                                    {operatorLabel(operator, locale)}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    {!isValueless(draft.operator) && (\n                        <ValueInput\n                            id={`${baseId}-value`}\n                            field={field}\n                            draft={draft}\n                            strings={strings}\n                            onChange={setDraft}\n                        />\n                    )}\n\n                    <button\n                        type=\"button\"\n                        className={styles.primary}\n                        disabled={!ready}\n                        onClick={apply}\n                    >\n                        {strings.apply}\n                    </button>\n                    <button type=\"button\" className={styles.ghost} onClick={() => setDraft(null)}>\n                        {strings.cancel}\n                    </button>\n                </div>\n            ) : (\n                <div className={styles.actions}>\n                    <button\n                        type=\"button\"\n                        className={styles.secondary}\n                        disabled={fields.length === 0}\n                        onClick={open}\n                    >\n                        + {strings.add}\n                    </button>\n                    {value.length > 0 && (\n                        <button type=\"button\" className={styles.ghost} onClick={() => onChange([])}>\n                            {strings.clear}\n                        </button>\n                    )}\n                    {actions}\n                </div>\n            )}\n\n            <VisuallyHidden aria-live=\"polite\" role=\"status\">\n                {strings.active(value.length)}\n            </VisuallyHidden>\n        </div>\n    );\n}\n\n/**\n * The value input for the draft.\n *\n * The input type follows the **field**, not the operator: a date field gets a date\n * picker even under `between`, where two of them are needed. Typing a date into a\n * text box is the fastest way to produce a filter the backend cannot parse.\n */\nfunction ValueInput({\n    id,\n    field,\n    draft,\n    strings,\n    onChange,\n}: {\n    id: string;\n    field: FilterField;\n    draft: Draft;\n    strings: ReturnType<typeof filterStrings>;\n    onChange: (draft: Draft) => void;\n}) {\n    const type = field.type === \"number\" ? \"number\" : field.type === \"date\" ? \"date\" : \"text\";\n\n    if (field.type === \"select\" && !isMulti(draft.operator)) {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    {field.options?.map((option) => (\n                        <option key={option.value} value={option.value}>\n                            {option.label}\n                        </option>\n                    ))}\n                </select>\n            </label>\n        );\n    }\n\n    if (field.type === \"boolean\") {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    <option value=\"true\">{strings.yes}</option>\n                    <option value=\"false\">{strings.no}</option>\n                </select>\n            </label>\n        );\n    }\n\n    if (draft.operator === \"between\") {\n        return (\n            <>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.from}</VisuallyHidden>\n                    <input\n                        id={id}\n                        className={styles.input}\n                        type={type}\n                        value={draft.value}\n                        placeholder={strings.from}\n                        onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                    />\n                </label>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.to}</VisuallyHidden>\n                    <input\n                        className={styles.input}\n                        type={type}\n                        value={draft.to}\n                        placeholder={strings.to}\n                        onChange={(event) => onChange({ ...draft, to: event.target.value })}\n                    />\n                </label>\n            </>\n        );\n    }\n\n    return (\n        <label className={styles.control}>\n            <VisuallyHidden>{strings.value}</VisuallyHidden>\n            <input\n                id={id}\n                className={styles.input}\n                type={type}\n                value={draft.value}\n                placeholder={field.placeholder ?? strings.value}\n                onChange={(event) => onChange({ ...draft, value: event.target.value })}\n            />\n        </label>\n    );\n}\n"],"mappings":"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"}

package/dist/components/FilterBar/FilterBar.js

@@ -35,7 +35,7 @@ function v({ fields: n, value: o, onChange: p, locale: v = "pt-BR", actions: b,
 	let C = i(v), w = d(), [T, E] = f(null), D = T ? n.find((e) => e.name === T.field) : void 0, O = T ? _(T) : null, k = O !== null && a(O), A = () => {
 		n.length > 0 && E(g(n[0]));
 	}, j = () => {
-		!O || !k || (p([...o, O]), E(null));
+		O && k && (p([...o, O]), E(null));
 	}, M = (e) => {
 		p(o.filter((t, n) => n !== e));
 	};

package/dist/components/FilterBar/FilterBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterBar.js","names":[],"sources":["../../../src/components/FilterBar/FilterBar.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, function-lines — a filter bar renders a different\n * editor per filter kind — select, multi-select, range, date range, text — and the\n * body is that dispatch plus the chip summary, both reading the same value map.\n */\nimport { useId, useState, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport {\n    defaultOperator,\n    describeFilter,\n    filterStrings,\n    isComplete,\n    isMulti,\n    isValueless,\n    operatorLabel,\n    operatorsFor,\n    type Filter,\n    type FilterField,\n} from \"./filter-model\";\nimport styles from \"./FilterBar.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onChange\";\n\nexport interface FilterBarProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** Fields the user may filter by. */\n    fields: readonly FilterField[];\n    /** Applied filters. Controlled. */\n    value: readonly Filter[];\n    /** Next filter set. Combined with AND. */\n    onChange: (filters: Filter[]) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Rendered at the end of the bar — a \"save this view\" button, a counter. */\n    actions?: ReactNode;\n}\n\n/** The draft filter being built in the editor. */\ninterface Draft {\n    field: string;\n    operator: Filter[\"operator\"];\n    value: string;\n    to: string;\n}\n\n/** A fresh draft for a field. */\nfunction draftFor(field: FilterField): Draft {\n    return { field: field.name, operator: defaultOperator(field), value: \"\", to: \"\" };\n}\n\n/** Turn a draft into a filter. */\nfunction toFilter(draft: Draft): Filter {\n    if (isValueless(draft.operator)) return { field: draft.field, operator: draft.operator };\n    if (draft.operator === \"between\") {\n        return { field: draft.field, operator: draft.operator, value: [draft.value, draft.to] };\n    }\n    if (isMulti(draft.operator)) {\n        return {\n            field: draft.field,\n            operator: draft.operator,\n            value: draft.value\n                .split(\",\")\n                .map((part) => part.trim())\n                .filter(Boolean),\n        };\n    }\n    return { field: draft.field, operator: draft.operator, value: draft.value };\n}\n\n/**\n * A row of applied filters, and a small editor to add another.\n *\n * Filters are combined with **AND**, flat — no nested `(a OR b) AND c` groups. That\n * is the shape of nearly every admin list (\"status is paid, created after March,\n * text contains nota\"), and it is what serializes into a URL somebody can send to a\n * colleague. Nested groups need a tree UI with per-node operators and a different\n * serialization; a component trying to be both is clumsy at the common case.\n *\n * Controlled, like the rest of the SDK: it holds the half-typed draft in the editor\n * and nothing else. The applied set is the app's, which is what lets it come from —\n * and go back into — the URL.\n *\n * @example\n * const [filters, setFilters] = useState<Filter[]>(() =>\n *     filtersFromSearchParams(new URLSearchParams(location.search), FIELDS),\n * );\n *\n * <FilterBar fields={FIELDS} value={filters} onChange={setFilters} />\n */\nexport function FilterBar({\n    fields,\n    value,\n    onChange,\n    locale = \"pt-BR\",\n    actions,\n    className,\n    ...rest\n}: FilterBarProps) {\n    const strings = filterStrings(locale);\n    const baseId = useId();\n    const [draft, setDraft] = useState<Draft | null>(null);\n\n    const field = draft ? fields.find((candidate) => candidate.name === draft.field) : undefined;\n    const pending = draft ? toFilter(draft) : null;\n    const ready = pending !== null && isComplete(pending);\n\n    const open = (): void => {\n        if (fields.length > 0) setDraft(draftFor(fields[0]));\n    };\n\n    const apply = (): void => {\n        if (!pending || !ready) return;\n        onChange([...value, pending]);\n        setDraft(null);\n    };\n\n    const removeAt = (index: number): void => {\n        onChange(value.filter((_, position) => position !== index));\n    };\n\n    return (\n        <div className={cn(styles.bar, className)} {...rest}>\n            <ul className={styles.chips}>\n                {value.length === 0 && !draft && <li className={styles.empty}>{strings.empty}</li>}\n                {value.map((filter, index) => {\n                    const description = describeFilter(filter, fields, locale);\n                    return (\n                        <li\n                            key={`${filter.field}-${filter.operator}-${index}`}\n                            className={styles.chip}\n                        >\n                            <span>{description}</span>\n                            <button\n                                type=\"button\"\n                                className={styles.remove}\n                                aria-label={strings.remove(description)}\n                                onClick={() => removeAt(index)}\n                            >\n                                ×\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n\n            {draft && field ? (\n                <div className={styles.editor} role=\"group\" aria-label={strings.add}>\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.field}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.field}\n                            onChange={(event) => {\n                                const next = fields.find(\n                                    (candidate) => candidate.name === event.target.value,\n                                );\n                                if (next) setDraft(draftFor(next));\n                            }}\n                        >\n                            {fields.map((candidate) => (\n                                <option key={candidate.name} value={candidate.name}>\n                                    {candidate.label}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.operator}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.operator}\n                            onChange={(event) =>\n                                setDraft({\n                                    ...draft,\n                                    operator: event.target.value as Filter[\"operator\"],\n                                    value: \"\",\n                                    to: \"\",\n                                })\n                            }\n                        >\n                            {operatorsFor(field).map((operator) => (\n                                <option key={operator} value={operator}>\n                                    {operatorLabel(operator, locale)}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    {!isValueless(draft.operator) && (\n                        <ValueInput\n                            id={`${baseId}-value`}\n                            field={field}\n                            draft={draft}\n                            strings={strings}\n                            onChange={setDraft}\n                        />\n                    )}\n\n                    <button\n                        type=\"button\"\n                        className={styles.primary}\n                        disabled={!ready}\n                        onClick={apply}\n                    >\n                        {strings.apply}\n                    </button>\n                    <button type=\"button\" className={styles.ghost} onClick={() => setDraft(null)}>\n                        {strings.cancel}\n                    </button>\n                </div>\n            ) : (\n                <div className={styles.actions}>\n                    <button\n                        type=\"button\"\n                        className={styles.secondary}\n                        disabled={fields.length === 0}\n                        onClick={open}\n                    >\n                        + {strings.add}\n                    </button>\n                    {value.length > 0 && (\n                        <button type=\"button\" className={styles.ghost} onClick={() => onChange([])}>\n                            {strings.clear}\n                        </button>\n                    )}\n                    {actions}\n                </div>\n            )}\n\n            <VisuallyHidden aria-live=\"polite\" role=\"status\">\n                {strings.active(value.length)}\n            </VisuallyHidden>\n        </div>\n    );\n}\n\n/**\n * The value input for the draft.\n *\n * The input type follows the **field**, not the operator: a date field gets a date\n * picker even under `between`, where two of them are needed. Typing a date into a\n * text box is the fastest way to produce a filter the backend cannot parse.\n */\nfunction ValueInput({\n    id,\n    field,\n    draft,\n    strings,\n    onChange,\n}: {\n    id: string;\n    field: FilterField;\n    draft: Draft;\n    strings: ReturnType<typeof filterStrings>;\n    onChange: (draft: Draft) => void;\n}) {\n    const type = field.type === \"number\" ? \"number\" : field.type === \"date\" ? \"date\" : \"text\";\n\n    if (field.type === \"select\" && !isMulti(draft.operator)) {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    {field.options?.map((option) => (\n                        <option key={option.value} value={option.value}>\n                            {option.label}\n                        </option>\n                    ))}\n                </select>\n            </label>\n        );\n    }\n\n    if (field.type === \"boolean\") {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    <option value=\"true\">{strings.yes}</option>\n                    <option value=\"false\">{strings.no}</option>\n                </select>\n            </label>\n        );\n    }\n\n    if (draft.operator === \"between\") {\n        return (\n            <>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.from}</VisuallyHidden>\n                    <input\n                        id={id}\n                        className={styles.input}\n                        type={type}\n                        value={draft.value}\n                        placeholder={strings.from}\n                        onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                    />\n                </label>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.to}</VisuallyHidden>\n                    <input\n                        className={styles.input}\n                        type={type}\n                        value={draft.to}\n                        placeholder={strings.to}\n                        onChange={(event) => onChange({ ...draft, to: event.target.value })}\n                    />\n                </label>\n            </>\n        );\n    }\n\n    return (\n        <label className={styles.control}>\n            <VisuallyHidden>{strings.value}</VisuallyHidden>\n            <input\n                id={id}\n                className={styles.input}\n                type={type}\n                value={draft.value}\n                placeholder={field.placeholder ?? strings.value}\n                onChange={(event) => onChange({ ...draft, value: event.target.value })}\n            />\n        </label>\n    );\n}\n"],"mappings":";;;;;;;AAiDA,SAAS,EAAS,GAA2B;CACzC,OAAO;EAAE,OAAO,EAAM;EAAM,UAAU,EAAgB,CAAK;EAAG,OAAO;EAAI,IAAI;CAAG;AACpF;AAGA,SAAS,EAAS,GAAsB;CAepC,OAdI,EAAY,EAAM,QAAQ,IAAU;EAAE,OAAO,EAAM;EAAO,UAAU,EAAM;CAAS,IACnF,EAAM,aAAa,YACZ;EAAE,OAAO,EAAM;EAAO,UAAU,EAAM;EAAU,OAAO,CAAC,EAAM,OAAO,EAAM,EAAE;CAAE,IAEtF,EAAQ,EAAM,QAAQ,IACf;EACH,OAAO,EAAM;EACb,UAAU,EAAM;EAChB,OAAO,EAAM,MACR,MAAM,GAAG,CAAC,CACV,KAAK,MAAS,EAAK,KAAK,CAAC,CAAC,CAC1B,OAAO,OAAO;CACvB,IAEG;EAAE,OAAO,EAAM;EAAO,UAAU,EAAM;EAAU,OAAO,EAAM;CAAM;AAC9E;AAsBA,SAAgB,EAAU,EACtB,WACA,UACA,aACA,YAAS,SACT,YACA,cACA,GAAG,KACY;CACf,IAAM,IAAU,EAAc,CAAM,GAC9B,IAAS,EAAM,GACf,CAAC,GAAO,KAAY,EAAuB,IAAI,GAE/C,IAAQ,IAAQ,EAAO,MAAM,MAAc,EAAU,SAAS,EAAM,KAAK,IAAI,KAAA,GAC7E,IAAU,IAAQ,EAAS,CAAK,IAAI,MACpC,IAAQ,MAAY,QAAQ,EAAW,CAAO,GAE9C,UAAmB;EACrB,AAAI,EAAO,SAAS,KAAG,EAAS,EAAS,EAAO,EAAE,CAAC;CACvD,GAEM,UAAoB;EAClB,CAAC,KAAW,CAAC,MACjB,EAAS,CAAC,GAAG,GAAO,CAAO,CAAC,GAC5B,EAAS,IAAI;CACjB,GAEM,KAAY,MAAwB;EACtC,EAAS,EAAM,QAAQ,GAAG,MAAa,MAAa,CAAK,CAAC;CAC9D;CAEA,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,KAAK,CAAS;EAAG,GAAI;EAA/C,UAAA;GACI,kBAAC,MAAD;IAAI,WAAW,EAAO;IAAtB,UAAA,CACK,EAAM,WAAW,KAAK,CAAC,KAAS,kBAAC,MAAD;KAAI,WAAW,EAAO;KAAQ,UAAA,EAAQ;IAAU,CAAA,GAChF,EAAM,KAAK,GAAQ,MAAU;KAC1B,IAAM,IAAc,EAAe,GAAQ,GAAQ,CAAM;KACzD,OACI,kBAAC,MAAD;MAEI,WAAW,EAAO;MAFtB,UAAA,CAII,kBAAC,QAAD,EAAA,UAAO,EAAkB,CAAA,GACzB,kBAAC,UAAD;OACI,MAAK;OACL,WAAW,EAAO;OAClB,cAAY,EAAQ,OAAO,CAAW;OACtC,eAAe,EAAS,CAAK;OAChC,UAAA;MAEO,CAAA,CACR;KAZK,GAAA,GAAG,EAAO,MAAM,GAAG,EAAO,SAAS,GAAG,GAY3C;IAEZ,CAAC,CACD;;GAEH,KAAS,IACN,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAQ,MAAK;IAAQ,cAAY,EAAQ;IAAhE,UAAA;KACI,kBAAC,SAAD;MAAO,WAAW,EAAO;MAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,MAAsB,CAAA,GAC/C,kBAAC,UAAD;OACI,WAAW,EAAO;OAClB,OAAO,EAAM;OACb,WAAW,MAAU;QACjB,IAAM,IAAO,EAAO,MACf,MAAc,EAAU,SAAS,EAAM,OAAO,KACnD;QACA,AAAI,KAAM,EAAS,EAAS,CAAI,CAAC;OACrC;OAEC,UAAA,EAAO,KAAK,MACT,kBAAC,UAAD;QAA6B,OAAO,EAAU;QACzC,UAAA,EAAU;OACP,GAFK,EAAU,IAEf,CACX;MACG,CAAA,CACL;;KAEP,kBAAC,SAAD;MAAO,WAAW,EAAO;MAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,SAAyB,CAAA,GAClD,kBAAC,UAAD;OACI,WAAW,EAAO;OAClB,OAAO,EAAM;OACb,WAAW,MACP,EAAS;QACL,GAAG;QACH,UAAU,EAAM,OAAO;QACvB,OAAO;QACP,IAAI;OACR,CAAC;OAGJ,UAAA,EAAa,CAAK,CAAC,CAAC,KAAK,MACtB,kBAAC,UAAD;QAAuB,OAAO;QACzB,UAAA,EAAc,GAAU,CAAM;OAC3B,GAFK,CAEL,CACX;MACG,CAAA,CACL;;KAEN,CAAC,EAAY,EAAM,QAAQ,KACxB,kBAAC,GAAD;MACI,IAAI,GAAG,EAAO;MACP;MACA;MACE;MACT,UAAU;KACb,CAAA;KAGL,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,UAAU,CAAC;MACX,SAAS;MAER,UAAA,EAAQ;KACL,CAAA;KACR,kBAAC,UAAD;MAAQ,MAAK;MAAS,WAAW,EAAO;MAAO,eAAe,EAAS,IAAI;MACtE,UAAA,EAAQ;KACL,CAAA;IACP;GAEL,CAAA,IAAA,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAvB,UAAA;KACI,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAO;MAClB,UAAU,EAAO,WAAW;MAC5B,SAAS;MAJb,UAAA,CAKC,MACM,EAAQ,GACP;;KACP,EAAM,SAAS,KACZ,kBAAC,UAAD;MAAQ,MAAK;MAAS,WAAW,EAAO;MAAO,eAAe,EAAS,CAAC,CAAC;MACpE,UAAA,EAAQ;KACL,CAAA;KAEX;IACA;;GAGT,kBAAC,GAAD;IAAgB,aAAU;IAAS,MAAK;IACnC,UAAA,EAAQ,OAAO,EAAM,MAAM;GAChB,CAAA;EACf;;AAEb;AASA,SAAS,EAAW,EAChB,OACA,UACA,UACA,YACA,eAOD;CACC,IAAM,IAAO,EAAM,SAAS,WAAW,WAAW,EAAM,SAAS,SAAS,SAAS;CAqEnF,OAnEI,EAAM,SAAS,YAAY,CAAC,EAAQ,EAAM,QAAQ,IAE9C,kBAAC,SAAD;EAAO,WAAW,EAAO;EAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,MAAsB,CAAA,GAC/C,kBAAC,UAAD;GACQ;GACJ,WAAW,EAAO;GAClB,OAAO,EAAM;GACb,WAAW,MAAU,EAAS;IAAE,GAAG;IAAO,OAAO,EAAM,OAAO;GAAM,CAAC;GAJzE,UAAA,CAMI,kBAAC,UAAD;IAAQ,OAAM;IAAG,UAAA;GAAS,CAAA,GACzB,EAAM,SAAS,KAAK,MACjB,kBAAC,UAAD;IAA2B,OAAO,EAAO;IACpC,UAAA,EAAO;GACJ,GAFK,EAAO,KAEZ,CACX,CACG;EACL,CAAA,CAAA;MAIX,EAAM,SAAS,YAEX,kBAAC,SAAD;EAAO,WAAW,EAAO;EAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,MAAsB,CAAA,GAC/C,kBAAC,UAAD;GACQ;GACJ,WAAW,EAAO;GAClB,OAAO,EAAM;GACb,WAAW,MAAU,EAAS;IAAE,GAAG;IAAO,OAAO,EAAM,OAAO;GAAM,CAAC;GAJzE,UAAA;IAMI,kBAAC,UAAD;KAAQ,OAAM;KAAG,UAAA;IAAS,CAAA;IAC1B,kBAAC,UAAD;KAAQ,OAAM;KAAQ,UAAA,EAAQ;IAAY,CAAA;IAC1C,kBAAC,UAAD;KAAQ,OAAM;KAAS,UAAA,EAAQ;IAAW,CAAA;GACtC;EACL,CAAA,CAAA;MAIX,EAAM,aAAa,YAEf,kBAAA,GAAA,EAAA,UAAA,CACI,kBAAC,SAAD;EAAO,WAAW,EAAO;EAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,KAAqB,CAAA,GAC9C,kBAAC,SAAD;GACQ;GACJ,WAAW,EAAO;GACZ;GACN,OAAO,EAAM;GACb,aAAa,EAAQ;GACrB,WAAW,MAAU,EAAS;IAAE,GAAG;IAAO,OAAO,EAAM,OAAO;GAAM,CAAC;EACxE,CAAA,CACE;CACP,CAAA,GAAA,kBAAC,SAAD;EAAO,WAAW,EAAO;EAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,GAAmB,CAAA,GAC5C,kBAAC,SAAD;GACI,WAAW,EAAO;GACZ;GACN,OAAO,EAAM;GACb,aAAa,EAAQ;GACrB,WAAW,MAAU,EAAS;IAAE,GAAG;IAAO,IAAI,EAAM,OAAO;GAAM,CAAC;EACrE,CAAA,CACE;CACT,CAAA,CAAA,EAAA,CAAA,IAKN,kBAAC,SAAD;EAAO,WAAW,EAAO;EAAzB,UAAA,CACI,kBAAC,GAAD,EAAA,UAAiB,EAAQ,MAAsB,CAAA,GAC/C,kBAAC,SAAD;GACQ;GACJ,WAAW,EAAO;GACZ;GACN,OAAO,EAAM;GACb,aAAa,EAAM,eAAe,EAAQ;GAC1C,WAAW,MAAU,EAAS;IAAE,GAAG;IAAO,OAAO,EAAM,OAAO;GAAM,CAAC;EACxE,CAAA,CACE;;AAEf"}
+{"version":3,"file":"FilterBar.js","names":[],"sources":["../../../src/components/FilterBar/FilterBar.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, function-lines — a filter bar renders a different\n * editor per filter kind — select, multi-select, range, date range, text — and the\n * body is that dispatch plus the chip summary, both reading the same value map.\n */\nimport { useId, useState, type HTMLAttributes, type ReactNode } from \"react\";\n\nimport { cn } from \"@/utils/cn\";\n\nimport { VisuallyHidden } from \"../VisuallyHidden\";\nimport {\n    defaultOperator,\n    describeFilter,\n    filterStrings,\n    isComplete,\n    isMulti,\n    isValueless,\n    operatorLabel,\n    operatorsFor,\n    type Filter,\n    type FilterField,\n} from \"./filter-model\";\nimport styles from \"./FilterBar.module.css\";\n\n/** DOM attributes this component redefines. */\ntype OverriddenDomProps = \"children\" | \"onChange\";\n\nexport interface FilterBarProps extends Omit<HTMLAttributes<HTMLDivElement>, OverriddenDomProps> {\n    /** Fields the user may filter by. */\n    fields: readonly FilterField[];\n    /** Applied filters. Controlled. */\n    value: readonly Filter[];\n    /** Next filter set. Combined with AND. */\n    onChange: (filters: Filter[]) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Rendered at the end of the bar — a \"save this view\" button, a counter. */\n    actions?: ReactNode;\n}\n\n/** The draft filter being built in the editor. */\ninterface Draft {\n    field: string;\n    operator: Filter[\"operator\"];\n    value: string;\n    to: string;\n}\n\n/** A fresh draft for a field. */\nfunction draftFor(field: FilterField): Draft {\n    return { field: field.name, operator: defaultOperator(field), value: \"\", to: \"\" };\n}\n\n/** Turn a draft into a filter. */\nfunction toFilter(draft: Draft): Filter {\n    if (isValueless(draft.operator)) return { field: draft.field, operator: draft.operator };\n    if (draft.operator === \"between\") {\n        return { field: draft.field, operator: draft.operator, value: [draft.value, draft.to] };\n    }\n    if (isMulti(draft.operator)) {\n        return {\n            field: draft.field,\n            operator: draft.operator,\n            value: draft.value\n                .split(\",\")\n                .map((part) => part.trim())\n                .filter(Boolean),\n        };\n    }\n    return { field: draft.field, operator: draft.operator, value: draft.value };\n}\n\n/**\n * A row of applied filters, and a small editor to add another.\n *\n * Filters are combined with **AND**, flat — no nested `(a OR b) AND c` groups. That\n * is the shape of nearly every admin list (\"status is paid, created after March,\n * text contains nota\"), and it is what serializes into a URL somebody can send to a\n * colleague. Nested groups need a tree UI with per-node operators and a different\n * serialization; a component trying to be both is clumsy at the common case.\n *\n * Controlled, like the rest of the SDK: it holds the half-typed draft in the editor\n * and nothing else. The applied set is the app's, which is what lets it come from —\n * and go back into — the URL.\n *\n * @example\n * const [filters, setFilters] = useState<Filter[]>(() =>\n *     filtersFromSearchParams(new URLSearchParams(location.search), FIELDS),\n * );\n *\n * <FilterBar fields={FIELDS} value={filters} onChange={setFilters} />\n */\nexport function FilterBar({\n    fields,\n    value,\n    onChange,\n    locale = \"pt-BR\",\n    actions,\n    className,\n    ...rest\n}: FilterBarProps) {\n    const strings = filterStrings(locale);\n    const baseId = useId();\n    const [draft, setDraft] = useState<Draft | null>(null);\n\n    const field = draft ? fields.find((candidate) => candidate.name === draft.field) : undefined;\n    const pending = draft ? toFilter(draft) : null;\n    const ready = pending !== null && isComplete(pending);\n\n    const open = (): void => {\n        if (fields.length > 0) setDraft(draftFor(fields[0]));\n    };\n\n    const apply = (): void => {\n        if (!pending || !ready) return;\n        onChange([...value, pending]);\n        setDraft(null);\n    };\n\n    const removeAt = (index: number): void => {\n        onChange(value.filter((_, position) => position !== index));\n    };\n\n    return (\n        <div className={cn(styles.bar, className)} {...rest}>\n            <ul className={styles.chips}>\n                {value.length === 0 && !draft && <li className={styles.empty}>{strings.empty}</li>}\n                {value.map((filter, index) => {\n                    const description = describeFilter(filter, fields, locale);\n                    return (\n                        <li\n                            key={`${filter.field}-${filter.operator}-${index}`}\n                            className={styles.chip}\n                        >\n                            <span>{description}</span>\n                            <button\n                                type=\"button\"\n                                className={styles.remove}\n                                aria-label={strings.remove(description)}\n                                onClick={() => removeAt(index)}\n                            >\n                                ×\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n\n            {draft && field ? (\n                <div className={styles.editor} role=\"group\" aria-label={strings.add}>\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.field}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.field}\n                            onChange={(event) => {\n                                const next = fields.find(\n                                    (candidate) => candidate.name === event.target.value,\n                                );\n                                if (next) setDraft(draftFor(next));\n                            }}\n                        >\n                            {fields.map((candidate) => (\n                                <option key={candidate.name} value={candidate.name}>\n                                    {candidate.label}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    <label className={styles.control}>\n                        <VisuallyHidden>{strings.operator}</VisuallyHidden>\n                        <select\n                            className={styles.select}\n                            value={draft.operator}\n                            onChange={(event) =>\n                                setDraft({\n                                    ...draft,\n                                    operator: event.target.value as Filter[\"operator\"],\n                                    value: \"\",\n                                    to: \"\",\n                                })\n                            }\n                        >\n                            {operatorsFor(field).map((operator) => (\n                                <option key={operator} value={operator}>\n                                    {operatorLabel(operator, locale)}\n                                </option>\n                            ))}\n                        </select>\n                    </label>\n\n                    {!isValueless(draft.operator) && (\n                        <ValueInput\n                            id={`${baseId}-value`}\n                            field={field}\n                            draft={draft}\n                            strings={strings}\n                            onChange={setDraft}\n                        />\n                    )}\n\n                    <button\n                        type=\"button\"\n                        className={styles.primary}\n                        disabled={!ready}\n                        onClick={apply}\n                    >\n                        {strings.apply}\n                    </button>\n                    <button type=\"button\" className={styles.ghost} onClick={() => setDraft(null)}>\n                        {strings.cancel}\n                    </button>\n                </div>\n            ) : (\n                <div className={styles.actions}>\n                    <button\n                        type=\"button\"\n                        className={styles.secondary}\n                        disabled={fields.length === 0}\n                        onClick={open}\n                    >\n                        + {strings.add}\n                    </button>\n                    {value.length > 0 && (\n                        <button type=\"button\" className={styles.ghost} onClick={() => onChange([])}>\n                            {strings.clear}\n                        </button>\n                    )}\n                    {actions}\n                </div>\n            )}\n\n            <VisuallyHidden aria-live=\"polite\" role=\"status\">\n                {strings.active(value.length)}\n            </VisuallyHidden>\n        </div>\n    );\n}\n\n/**\n * The value input for the draft.\n *\n * The input type follows the **field**, not the operator: a date field gets a date\n * picker even under `between`, where two of them are needed. Typing a date into a\n * text box is the fastest way to produce a filter the backend cannot parse.\n */\nfunction ValueInput({\n    id,\n    field,\n    draft,\n    strings,\n    onChange,\n}: {\n    id: string;\n    field: FilterField;\n    draft: Draft;\n    strings: ReturnType<typeof filterStrings>;\n    onChange: (draft: Draft) => void;\n}) {\n    const type = field.type === \"number\" ? \"number\" : field.type === \"date\" ? \"date\" : \"text\";\n\n    if (field.type === \"select\" && !isMulti(draft.operator)) {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    {field.options?.map((option) => (\n                        <option key={option.value} value={option.value}>\n                            {option.label}\n                        </option>\n                    ))}\n                </select>\n            </label>\n        );\n    }\n\n    if (field.type === \"boolean\") {\n        return (\n            <label className={styles.control}>\n                <VisuallyHidden>{strings.value}</VisuallyHidden>\n                <select\n                    id={id}\n                    className={styles.select}\n                    value={draft.value}\n                    onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                >\n                    <option value=\"\">—</option>\n                    <option value=\"true\">{strings.yes}</option>\n                    <option value=\"false\">{strings.no}</option>\n                </select>\n            </label>\n        );\n    }\n\n    if (draft.operator === \"between\") {\n        return (\n            <>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.from}</VisuallyHidden>\n                    <input\n                        id={id}\n                        className={styles.input}\n                        type={type}\n                        value={draft.value}\n                        placeholder={strings.from}\n                        onChange={(event) => onChange({ ...draft, value: event.target.value })}\n                    />\n                </label>\n                <label className={styles.control}>\n                    <VisuallyHidden>{strings.to}</VisuallyHidden>\n                    <input\n                        className={styles.input}\n                        type={type}\n                        value={draft.to}\n                        placeholder={strings.to}\n                        onChange={(event) => onChange({ ...draft, to: event.target.value })}\n                    />\n                </label>\n            </>\n        );\n    }\n\n    return (\n        <label className={styles.control}>\n            <VisuallyHidden>{strings.value}</VisuallyHidden>\n            <input\n                id={id}\n                className={styles.input}\n                type={type}\n                value={draft.value}\n                placeholder={field.placeholder ?? strings.value}\n                onChange={(event) => onChange({ ...draft, value: event.target.value })}\n            />\n        </label>\n    );\n}\n"],"mappings":"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"}

package/dist/components/FilterBar/filter-apply.cjs

@@ -1,2 +1,2 @@
-const e=require("./filter-model.cjs"),t=require("../../utils/format.cjs");var n=/^\d{4}-\d{2}-\d{2}$/,r=new Intl.Collator(void 0,{numeric:!0});function i(e,t){if(!(typeof e!=`object`||!e))return e[t]}function a(e){return e instanceof Date?t.formatDateForInput(e)||null:typeof e!=`string`||e.trim()===``?null:t.formatDateForInput(e)||null}function o(e,t){if(e==null)return null;if(typeof e==`number`){let n=Number(t);return Number.isNaN(n)?null:e-n}if(typeof e==`boolean`){let n=t===`true`||t!==`false`&&null;return n===null?null:Number(e)-Number(n)}if(n.test(t)){let n=a(e);return n===null?null:n.localeCompare(t)}return r.compare(String(e),t)}function s(e,t){if(e===t)return!0;let n=o(e,t);return n===null?String(e??``)===t:n===0}function c(e){return e==null?!0:typeof e==`string`?e.trim()===``:Array.isArray(e)?e.length===0:!1}function l(e){return e.value===void 0?[]:Array.isArray(e.value)?[...e.value]:[String(e.value)]}function u(e,t,n){switch(e){case`empty`:return c(t);case`notEmpty`:return!c(t);case`eq`:return s(t,n[0]??``);case`ne`:return!s(t,n[0]??``);case`contains`:return String(t??``).toLowerCase().includes((n[0]??``).toLowerCase());case`in`:return n.some(e=>s(t,e));case`between`:{let[e=``,r=``]=n,i=o(t,e),a=o(t,r);return i===null||a===null?!1:i>=0&&a<=0}default:{let r=o(t,n[0]??``);return r===null?!1:e===`gt`?r>0:e===`gte`?r>=0:e===`lt`?r<0:r<=0}}}function d(e){let[t=``,i=``]=e;if(n.test(t)&&n.test(i))return t<=i?[t,i]:[i,t];let a=Number(t),o=Number(i);return!Number.isNaN(a)&&!Number.isNaN(o)?a<=o?[t,i]:[i,t]:r.compare(t,i)<=0?[t,i]:[i,t]}function f(t,n){let r=n.filter(e.isComplete).map(e=>({field:e.field,operator:e.operator,values:e.operator===`between`?d(l(e)):l(e)}));return r.length===0?[...t]:t.filter(e=>r.every(({field:t,operator:n,values:r})=>u(n,i(e,t),r)))}exports.applyFilters=f,exports.orderRange=d;
+const e=require("./filter-model.cjs"),t=require("../../utils/format.cjs");var n=/^\d{4}-\d{2}-\d{2}$/,r=new Intl.Collator(void 0,{numeric:!0});function i(e,t){if(typeof e==`object`&&e)return e[t]}function a(e){return e instanceof Date?t.formatDateForInput(e)||null:typeof e!=`string`||e.trim()===``?null:t.formatDateForInput(e)||null}function o(e,t){if(e==null)return null;if(typeof e==`number`){let n=Number(t);return Number.isNaN(n)?null:e-n}if(typeof e==`boolean`){let n=t===`true`||t!==`false`&&null;return n===null?null:Number(e)-Number(n)}if(n.test(t)){let n=a(e);return n===null?null:n.localeCompare(t)}return r.compare(String(e),t)}function s(e,t){if(e===t)return!0;let n=o(e,t);return n===null?String(e??``)===t:n===0}function c(e){return e==null?!0:typeof e==`string`?e.trim()===``:Array.isArray(e)?e.length===0:!1}function l(e){return e.value===void 0?[]:Array.isArray(e.value)?[...e.value]:[String(e.value)]}function u(e,t,n){switch(e){case`empty`:return c(t);case`notEmpty`:return!c(t);case`eq`:return s(t,n[0]??``);case`ne`:return!s(t,n[0]??``);case`contains`:return String(t??``).toLowerCase().includes((n[0]??``).toLowerCase());case`in`:return n.some(e=>s(t,e));case`between`:{let[e=``,r=``]=n,i=o(t,e),a=o(t,r);return i===null||a===null?!1:i>=0&&a<=0}default:{let r=o(t,n[0]??``);return r===null?!1:e===`gt`?r>0:e===`gte`?r>=0:e===`lt`?r<0:r<=0}}}function d(e){let[t=``,i=``]=e;if(n.test(t)&&n.test(i))return t<=i?[t,i]:[i,t];let a=Number(t),o=Number(i);return!Number.isNaN(a)&&!Number.isNaN(o)?a<=o?[t,i]:[i,t]:r.compare(t,i)<=0?[t,i]:[i,t]}function f(t,n){let r=n.filter(e.isComplete).map(e=>({field:e.field,operator:e.operator,values:e.operator===`between`?d(l(e)):l(e)}));return r.length===0?[...t]:t.filter(e=>r.every(({field:t,operator:n,values:r})=>u(n,i(e,t),r)))}exports.applyFilters=f,exports.orderRange=d;
 //# sourceMappingURL=filter-apply.cjs.map

package/dist/components/FilterBar/filter-apply.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"filter-apply.cjs","names":[],"sources":["../../../src/components/FilterBar/filter-apply.ts"],"sourcesContent":["// The other half of the filter model: evaluating a `Filter[]` instead of only\n// describing it. `FilterBar` produces filters, `applyFilters` runs them over an\n// in-memory list, and `filtersToQueryParams` (filter-query.ts) hands the same set\n// to a paginated backend. Without these two the model stops one step short of\n// useful and every app writes the eleven operator branches again.\n\nimport { formatDateForInput } from \"@/utils/format\";\nimport type { Filter, FilterOperator } from \"./filter-model\";\nimport { isComplete } from \"./filter-model\";\n\n/** Matches a plain `yyyy-mm-dd`, the shape `<input type=\"date\">` produces. */\nconst DATE_ONLY = /^\\d{4}-\\d{2}-\\d{2}$/;\n\n/**\n * One collator for every text comparison in this module.\n *\n * `localeCompare(value, undefined, { numeric: true })` builds a collator on each\n * call — passing an options bag opts out of the engine's cached-default fast\n * path — and this comparison runs once per row per filter. Measured at 200k\n * comparisons: 453 ms through `localeCompare` against 25 ms through a hoisted\n * collator, i.e. ~23 ms of main thread per keystroke on a 10k-row list.\n */\nconst TEXT_COLLATOR = new Intl.Collator(undefined, { numeric: true });\n\n/**\n * Read a property off a row without asserting the row's shape.\n *\n * `Filter.field` is a string chosen by the app's field list, so it cannot be a\n * `keyof T`; the lookup goes through an index signature and a missing property\n * yields `undefined`, which the operators treat as an empty value.\n *\n * @param item - The row being tested.\n * @param field - Property name from the filter.\n * @returns The property value, or `undefined` when the row has no such key.\n */\nfunction readField(item: unknown, field: string): unknown {\n    if (item == null || typeof item !== \"object\") return undefined;\n    return (item as Record<string, unknown>)[field];\n}\n\n/**\n * Local `yyyy-mm-dd` for a value that represents a date, or `null`.\n *\n * Delegates the formatting to {@link formatDateForInput}, which owns the rule\n * that the key is built from the local calendar parts rather than `toISOString`.\n * This adds only the narrowing from `unknown` and maps \"not a date\" to `null`\n * instead of to the empty string a date input wants.\n *\n * @param value - A `Date`, a date-ish string, or anything else.\n * @returns The day key, or `null` when the value does not denote a date.\n */\nfunction dayKey(value: unknown): string | null {\n    if (value instanceof Date) return formatDateForInput(value) || null;\n    if (typeof value !== \"string\" || value.trim() === \"\") return null;\n    return formatDateForInput(value) || null;\n}\n\n/**\n * Compare a row value against a filter value, in the row value's own type.\n *\n * The filter always carries strings — it comes from form inputs and from the\n * URL — while the row carries whatever the API returned. Comparing them as text\n * gets the two common cases wrong: `10` would sort before `9`, and a date would\n * be compared by however it happens to be formatted. So the row value picks the\n * comparison, and the filter value is coerced into it.\n *\n * Dates compare by **day**, not by instant: a row stamped `2026-03-05T13:00:00Z`\n * is `>= 2026-03-05`, which is what the person picking a date in the UI means.\n *\n * @param left - The row value.\n * @param right - The raw filter value.\n * @returns Negative, zero or positive, or `null` when the two cannot be compared.\n */\nfunction compare(left: unknown, right: string): number | null {\n    if (left == null) return null;\n\n    if (typeof left === \"number\") {\n        const parsed = Number(right);\n        return Number.isNaN(parsed) ? null : left - parsed;\n    }\n\n    if (typeof left === \"boolean\") {\n        const parsed = right === \"true\" ? true : right === \"false\" ? false : null;\n        return parsed === null ? null : Number(left) - Number(parsed);\n    }\n\n    if (DATE_ONLY.test(right)) {\n        const key = dayKey(left);\n        return key === null ? null : key.localeCompare(right);\n    }\n\n    return TEXT_COLLATOR.compare(String(left), right);\n}\n\n/**\n * Equality in the row value's type, falling back to exact text.\n *\n * Case-sensitive on purpose: `eq` maps to a plain `WHERE column = value` on the\n * server side, so a case-insensitive client would quietly disagree with the\n * backend for the same filter. `contains` is the case-insensitive operator, and\n * it is also the default one for text fields, so the friendly behaviour is what\n * people get without asking.\n *\n * Identical strings take a fast path out, since the row value is text in the\n * common case and the collator is the expensive part.\n *\n * @param left - The row value.\n * @param right - The raw filter value.\n * @returns Whether the two are equal.\n */\nfunction equals(left: unknown, right: string): boolean {\n    if (left === right) return true;\n    const result = compare(left, right);\n    if (result !== null) return result === 0;\n    return String(left ?? \"\") === right;\n}\n\n/**\n * Is this row value empty?\n *\n * Empty means absent, blank text or an empty list — never falsy. `0` and `false`\n * are values somebody chose, and a filter that hid them would be reporting the\n * wrong count on every dashboard that tracks zeroes.\n *\n * @param value - The row value.\n * @returns Whether the value counts as empty.\n */\nfunction isEmptyValue(value: unknown): boolean {\n    if (value == null) return true;\n    if (typeof value === \"string\") return value.trim() === \"\";\n    if (Array.isArray(value)) return value.length === 0;\n    return false;\n}\n\n/**\n * The filter's value as a list, whatever arity the operator uses.\n *\n * @param filter - The filter to read.\n * @returns Its values, trimmed of nothing — a leading space may be meaningful text.\n */\nfunction valuesOf(filter: Filter): string[] {\n    if (filter.value === undefined) return [];\n    return Array.isArray(filter.value) ? [...filter.value] : [String(filter.value)];\n}\n\n/**\n * Evaluate one operator against one row value.\n *\n * @param operator - The comparison to make.\n * @param left - The row value.\n * @param values - The filter values (one, two for `between`, many for `in`).\n * @returns Whether the row value satisfies the operator.\n */\nfunction matchesOperator(operator: FilterOperator, left: unknown, values: string[]): boolean {\n    switch (operator) {\n        case \"empty\":\n            return isEmptyValue(left);\n        case \"notEmpty\":\n            return !isEmptyValue(left);\n        case \"eq\":\n            return equals(left, values[0] ?? \"\");\n        case \"ne\":\n            return !equals(left, values[0] ?? \"\");\n        case \"contains\":\n            return String(left ?? \"\")\n                .toLowerCase()\n                .includes((values[0] ?? \"\").toLowerCase());\n        case \"in\":\n            return values.some((value) => equals(left, value));\n        case \"between\": {\n            const [first = \"\", second = \"\"] = values;\n            const low = compare(left, first);\n            const high = compare(left, second);\n            if (low === null || high === null) return false;\n            return low >= 0 && high <= 0;\n        }\n        default: {\n            const result = compare(left, values[0] ?? \"\");\n            if (result === null) return false;\n            if (operator === \"gt\") return result > 0;\n            if (operator === \"gte\") return result >= 0;\n            if (operator === \"lt\") return result < 0;\n            return result <= 0;\n        }\n    }\n}\n\n/**\n * Order the two values of a `between` so the range is never empty by accident.\n *\n * A person who picks the later date first means the range between the two dates,\n * not \"no rows\". The server-side `BETWEEN` needs `(lo, hi)` in order too, which\n * is why the normalisation lives here and is shared by `filtersToQueryParams`.\n *\n * @param values - The raw pair.\n * @returns The pair, ascending.\n */\nexport function orderRange(values: readonly string[]): string[] {\n    const [first = \"\", second = \"\"] = values;\n    if (DATE_ONLY.test(first) && DATE_ONLY.test(second)) {\n        return first <= second ? [first, second] : [second, first];\n    }\n    const low = Number(first);\n    const high = Number(second);\n    if (!Number.isNaN(low) && !Number.isNaN(high)) {\n        return low <= high ? [first, second] : [second, first];\n    }\n    return TEXT_COLLATOR.compare(first, second) <= 0 ? [first, second] : [second, first];\n}\n\n/**\n * Run a filter set over an in-memory list.\n *\n * Closes the loop `FilterBar` opens: the bar produces `Filter[]`, this applies\n * them. Filters combine with `AND`, matching the flat model the bar builds, and\n * an incomplete filter is skipped rather than treated as a match of nothing — a\n * half-filled form should not empty the table underneath it.\n *\n * Comparison follows the row's type, not the filter's: numbers compare\n * numerically, dates compare by day, and everything else compares as text with\n * `numeric: true` so `\"item 2\"` lands before `\"item 10\"`.\n *\n * A few behaviours differ from the SQL the server-side twin produces, and the\n * difference is deliberate rather than accidental:\n *\n * - `ne` matches rows whose value is absent. In SQL, `column <> 'x'` is `NULL`\n *   for a `NULL` column and the row drops out. Here \"is not paid\" shows the rows\n *   with no status at all, which is what the chip claims.\n * - `empty` matches `NULL`, blank text and empty lists; `__isnull` on the server\n *   only matches `NULL`. A column that stores `\"\"` instead of `NULL` is where\n *   the two disagree.\n *\n * @example\n * const visible = applyFilters(orders, filters);\n *\n * Each filter's values are normalised once, before the scan, rather than inside\n * the per-row predicate: the arity, the `between` ordering and the value array\n * depend only on the filter, so deriving them per row multiplied that work by\n * the row count. `empty`/`notEmpty` ignore their values entirely, which is why\n * the prepared shape does not need to distinguish them.\n *\n * @param items - The full list.\n * @param filters - Applied filters; incomplete ones are ignored.\n * @returns A new array with the rows that satisfy every complete filter.\n */\nexport function applyFilters<T>(items: readonly T[], filters: readonly Filter[]): T[] {\n    const active = filters.filter(isComplete).map((filter) => ({\n        field: filter.field,\n        operator: filter.operator,\n        values: filter.operator === \"between\" ? orderRange(valuesOf(filter)) : valuesOf(filter),\n    }));\n    if (active.length === 0) return [...items];\n\n    return items.filter((item) =>\n        active.every(({ field, operator, values }) =>\n            matchesOperator(operator, readField(item, field), values),\n        ),\n    );\n}\n"],"mappings":"0EAWA,IAAM,EAAY,sBAWZ,EAAgB,IAAI,KAAK,SAAS,IAAA,GAAW,CAAE,QAAS,EAAK,CAAC,EAapE,SAAS,EAAU,EAAe,EAAwB,CAClD,KAAgB,OAAO,GAAS,WAAhC,GACJ,OAAQ,EAAiC,EAC7C,CAaA,SAAS,EAAO,EAA+B,CAG3C,OAFI,aAAiB,KAAa,EAAA,mBAAmB,CAAK,GAAK,KAC3D,OAAO,GAAU,UAAY,EAAM,KAAK,IAAM,GAAW,KACtD,EAAA,mBAAmB,CAAK,GAAK,IACxC,CAkBA,SAAS,EAAQ,EAAe,EAA8B,CAC1D,GAAI,GAAQ,KAAM,OAAO,KAEzB,GAAI,OAAO,GAAS,SAAU,CAC1B,IAAM,EAAS,OAAO,CAAK,EAC3B,OAAO,OAAO,MAAM,CAAM,EAAI,KAAO,EAAO,CAChD,CAEA,GAAI,OAAO,GAAS,UAAW,CAC3B,IAAM,EAAS,IAAU,QAAgB,IAAU,SAAkB,KACrE,OAAO,IAAW,KAAO,KAAO,OAAO,CAAI,EAAI,OAAO,CAAM,CAChE,CAEA,GAAI,EAAU,KAAK,CAAK,EAAG,CACvB,IAAM,EAAM,EAAO,CAAI,EACvB,OAAO,IAAQ,KAAO,KAAO,EAAI,cAAc,CAAK,CACxD,CAEA,OAAO,EAAc,QAAQ,OAAO,CAAI,EAAG,CAAK,CACpD,CAkBA,SAAS,EAAO,EAAe,EAAwB,CACnD,GAAI,IAAS,EAAO,MAAO,GAC3B,IAAM,EAAS,EAAQ,EAAM,CAAK,EAElC,OADI,IAAW,KACR,OAAO,GAAQ,EAAE,IAAM,EADF,IAAW,CAE3C,CAYA,SAAS,EAAa,EAAyB,CAI3C,OAHI,GAAS,KAAa,GACtB,OAAO,GAAU,SAAiB,EAAM,KAAK,IAAM,GACnD,MAAM,QAAQ,CAAK,EAAU,EAAM,SAAW,EAC3C,EACX,CAQA,SAAS,EAAS,EAA0B,CAExC,OADI,EAAO,QAAU,IAAA,GAAkB,CAAC,EACjC,MAAM,QAAQ,EAAO,KAAK,EAAI,CAAC,GAAG,EAAO,KAAK,EAAI,CAAC,OAAO,EAAO,KAAK,CAAC,CAClF,CAUA,SAAS,EAAgB,EAA0B,EAAe,EAA2B,CACzF,OAAQ,EAAR,CACI,IAAK,QACD,OAAO,EAAa,CAAI,EAC5B,IAAK,WACD,MAAO,CAAC,EAAa,CAAI,EAC7B,IAAK,KACD,OAAO,EAAO,EAAM,EAAO,IAAM,EAAE,EACvC,IAAK,KACD,MAAO,CAAC,EAAO,EAAM,EAAO,IAAM,EAAE,EACxC,IAAK,WACD,OAAO,OAAO,GAAQ,EAAE,CAAC,CACpB,YAAY,CAAC,CACb,UAAU,EAAO,IAAM,GAAA,CAAI,YAAY,CAAC,EACjD,IAAK,KACD,OAAO,EAAO,KAAM,GAAU,EAAO,EAAM,CAAK,CAAC,EACrD,IAAK,UAAW,CACZ,GAAM,CAAC,EAAQ,GAAI,EAAS,IAAM,EAC5B,EAAM,EAAQ,EAAM,CAAK,EACzB,EAAO,EAAQ,EAAM,CAAM,EAEjC,OADI,IAAQ,MAAQ,IAAS,KAAa,GACnC,GAAO,GAAK,GAAQ,CAC/B,CACA,QAAS,CACL,IAAM,EAAS,EAAQ,EAAM,EAAO,IAAM,EAAE,EAK5C,OAJI,IAAW,KAAa,GACxB,IAAa,KAAa,EAAS,EACnC,IAAa,MAAc,GAAU,EACrC,IAAa,KAAa,EAAS,EAChC,GAAU,CACrB,CACJ,CACJ,CAYA,SAAgB,EAAW,EAAqC,CAC5D,GAAM,CAAC,EAAQ,GAAI,EAAS,IAAM,EAClC,GAAI,EAAU,KAAK,CAAK,GAAK,EAAU,KAAK,CAAM,EAC9C,OAAO,GAAS,EAAS,CAAC,EAAO,CAAM,EAAI,CAAC,EAAQ,CAAK,EAE7D,IAAM,EAAM,OAAO,CAAK,EAClB,EAAO,OAAO,CAAM,EAI1B,MAHI,CAAC,OAAO,MAAM,CAAG,GAAK,CAAC,OAAO,MAAM,CAAI,EACjC,GAAO,EAAO,CAAC,EAAO,CAAM,EAAI,CAAC,EAAQ,CAAK,EAElD,EAAc,QAAQ,EAAO,CAAM,GAAK,EAAI,CAAC,EAAO,CAAM,EAAI,CAAC,EAAQ,CAAK,CACvF,CAqCA,SAAgB,EAAgB,EAAqB,EAAiC,CAClF,IAAM,EAAS,EAAQ,OAAO,EAAA,UAAU,CAAC,CAAC,IAAK,IAAY,CACvD,MAAO,EAAO,MACd,SAAU,EAAO,SACjB,OAAQ,EAAO,WAAa,UAAY,EAAW,EAAS,CAAM,CAAC,EAAI,EAAS,CAAM,CAC1F,EAAE,EAGF,OAFI,EAAO,SAAW,EAAU,CAAC,GAAG,CAAK,EAElC,EAAM,OAAQ,GACjB,EAAO,OAAO,CAAE,QAAO,WAAU,YAC7B,EAAgB,EAAU,EAAU,EAAM,CAAK,EAAG,CAAM,CAC5D,CACJ,CACJ"}
+{"version":3,"file":"filter-apply.cjs","names":[],"sources":["../../../src/components/FilterBar/filter-apply.ts"],"sourcesContent":["// The other half of the filter model: evaluating a `Filter[]` instead of only\n// describing it. `FilterBar` produces filters, `applyFilters` runs them over an\n// in-memory list, and `filtersToQueryParams` (filter-query.ts) hands the same set\n// to a paginated backend. Without these two the model stops one step short of\n// useful and every app writes the eleven operator branches again.\n\nimport { formatDateForInput } from \"@/utils/format\";\nimport type { Filter, FilterOperator } from \"./filter-model\";\nimport { isComplete } from \"./filter-model\";\n\n/** Matches a plain `yyyy-mm-dd`, the shape `<input type=\"date\">` produces. */\nconst DATE_ONLY = /^\\d{4}-\\d{2}-\\d{2}$/;\n\n/**\n * One collator for every text comparison in this module.\n *\n * `localeCompare(value, undefined, { numeric: true })` builds a collator on each\n * call — passing an options bag opts out of the engine's cached-default fast\n * path — and this comparison runs once per row per filter. Measured at 200k\n * comparisons: 453 ms through `localeCompare` against 25 ms through a hoisted\n * collator, i.e. ~23 ms of main thread per keystroke on a 10k-row list.\n */\nconst TEXT_COLLATOR = new Intl.Collator(undefined, { numeric: true });\n\n/**\n * Read a property off a row without asserting the row's shape.\n *\n * `Filter.field` is a string chosen by the app's field list, so it cannot be a\n * `keyof T`; the lookup goes through an index signature and a missing property\n * yields `undefined`, which the operators treat as an empty value.\n *\n * @param item - The row being tested.\n * @param field - Property name from the filter.\n * @returns The property value, or `undefined` when the row has no such key.\n */\nfunction readField(item: unknown, field: string): unknown {\n    if (item == null || typeof item !== \"object\") return undefined;\n    return (item as Record<string, unknown>)[field];\n}\n\n/**\n * Local `yyyy-mm-dd` for a value that represents a date, or `null`.\n *\n * Delegates the formatting to {@link formatDateForInput}, which owns the rule\n * that the key is built from the local calendar parts rather than `toISOString`.\n * This adds only the narrowing from `unknown` and maps \"not a date\" to `null`\n * instead of to the empty string a date input wants.\n *\n * @param value - A `Date`, a date-ish string, or anything else.\n * @returns The day key, or `null` when the value does not denote a date.\n */\nfunction dayKey(value: unknown): string | null {\n    if (value instanceof Date) return formatDateForInput(value) || null;\n    if (typeof value !== \"string\" || value.trim() === \"\") return null;\n    return formatDateForInput(value) || null;\n}\n\n/**\n * Compare a row value against a filter value, in the row value's own type.\n *\n * The filter always carries strings — it comes from form inputs and from the\n * URL — while the row carries whatever the API returned. Comparing them as text\n * gets the two common cases wrong: `10` would sort before `9`, and a date would\n * be compared by however it happens to be formatted. So the row value picks the\n * comparison, and the filter value is coerced into it.\n *\n * Dates compare by **day**, not by instant: a row stamped `2026-03-05T13:00:00Z`\n * is `>= 2026-03-05`, which is what the person picking a date in the UI means.\n *\n * @param left - The row value.\n * @param right - The raw filter value.\n * @returns Negative, zero or positive, or `null` when the two cannot be compared.\n */\nfunction compare(left: unknown, right: string): number | null {\n    if (left == null) return null;\n\n    if (typeof left === \"number\") {\n        const parsed = Number(right);\n        return Number.isNaN(parsed) ? null : left - parsed;\n    }\n\n    if (typeof left === \"boolean\") {\n        const parsed = right === \"true\" ? true : right === \"false\" ? false : null;\n        return parsed === null ? null : Number(left) - Number(parsed);\n    }\n\n    if (DATE_ONLY.test(right)) {\n        const key = dayKey(left);\n        return key === null ? null : key.localeCompare(right);\n    }\n\n    return TEXT_COLLATOR.compare(String(left), right);\n}\n\n/**\n * Equality in the row value's type, falling back to exact text.\n *\n * Case-sensitive on purpose: `eq` maps to a plain `WHERE column = value` on the\n * server side, so a case-insensitive client would quietly disagree with the\n * backend for the same filter. `contains` is the case-insensitive operator, and\n * it is also the default one for text fields, so the friendly behaviour is what\n * people get without asking.\n *\n * Identical strings take a fast path out, since the row value is text in the\n * common case and the collator is the expensive part.\n *\n * @param left - The row value.\n * @param right - The raw filter value.\n * @returns Whether the two are equal.\n */\nfunction equals(left: unknown, right: string): boolean {\n    if (left === right) return true;\n    const result = compare(left, right);\n    if (result !== null) return result === 0;\n    return String(left ?? \"\") === right;\n}\n\n/**\n * Is this row value empty?\n *\n * Empty means absent, blank text or an empty list — never falsy. `0` and `false`\n * are values somebody chose, and a filter that hid them would be reporting the\n * wrong count on every dashboard that tracks zeroes.\n *\n * @param value - The row value.\n * @returns Whether the value counts as empty.\n */\nfunction isEmptyValue(value: unknown): boolean {\n    if (value == null) return true;\n    if (typeof value === \"string\") return value.trim() === \"\";\n    if (Array.isArray(value)) return value.length === 0;\n    return false;\n}\n\n/**\n * The filter's value as a list, whatever arity the operator uses.\n *\n * @param filter - The filter to read.\n * @returns Its values, trimmed of nothing — a leading space may be meaningful text.\n */\nfunction valuesOf(filter: Filter): string[] {\n    if (filter.value === undefined) return [];\n    return Array.isArray(filter.value) ? [...filter.value] : [String(filter.value)];\n}\n\n/**\n * Evaluate one operator against one row value.\n *\n * @param operator - The comparison to make.\n * @param left - The row value.\n * @param values - The filter values (one, two for `between`, many for `in`).\n * @returns Whether the row value satisfies the operator.\n */\nfunction matchesOperator(operator: FilterOperator, left: unknown, values: string[]): boolean {\n    switch (operator) {\n        case \"empty\":\n            return isEmptyValue(left);\n        case \"notEmpty\":\n            return !isEmptyValue(left);\n        case \"eq\":\n            return equals(left, values[0] ?? \"\");\n        case \"ne\":\n            return !equals(left, values[0] ?? \"\");\n        case \"contains\":\n            return String(left ?? \"\")\n                .toLowerCase()\n                .includes((values[0] ?? \"\").toLowerCase());\n        case \"in\":\n            return values.some((value) => equals(left, value));\n        case \"between\": {\n            const [first = \"\", second = \"\"] = values;\n            const low = compare(left, first);\n            const high = compare(left, second);\n            if (low === null || high === null) return false;\n            return low >= 0 && high <= 0;\n        }\n        default: {\n            const result = compare(left, values[0] ?? \"\");\n            if (result === null) return false;\n            if (operator === \"gt\") return result > 0;\n            if (operator === \"gte\") return result >= 0;\n            if (operator === \"lt\") return result < 0;\n            return result <= 0;\n        }\n    }\n}\n\n/**\n * Order the two values of a `between` so the range is never empty by accident.\n *\n * A person who picks the later date first means the range between the two dates,\n * not \"no rows\". The server-side `BETWEEN` needs `(lo, hi)` in order too, which\n * is why the normalisation lives here and is shared by `filtersToQueryParams`.\n *\n * @param values - The raw pair.\n * @returns The pair, ascending.\n */\nexport function orderRange(values: readonly string[]): string[] {\n    const [first = \"\", second = \"\"] = values;\n    if (DATE_ONLY.test(first) && DATE_ONLY.test(second)) {\n        return first <= second ? [first, second] : [second, first];\n    }\n    const low = Number(first);\n    const high = Number(second);\n    if (!Number.isNaN(low) && !Number.isNaN(high)) {\n        return low <= high ? [first, second] : [second, first];\n    }\n    return TEXT_COLLATOR.compare(first, second) <= 0 ? [first, second] : [second, first];\n}\n\n/**\n * Run a filter set over an in-memory list.\n *\n * Closes the loop `FilterBar` opens: the bar produces `Filter[]`, this applies\n * them. Filters combine with `AND`, matching the flat model the bar builds, and\n * an incomplete filter is skipped rather than treated as a match of nothing — a\n * half-filled form should not empty the table underneath it.\n *\n * Comparison follows the row's type, not the filter's: numbers compare\n * numerically, dates compare by day, and everything else compares as text with\n * `numeric: true` so `\"item 2\"` lands before `\"item 10\"`.\n *\n * A few behaviours differ from the SQL the server-side twin produces, and the\n * difference is deliberate rather than accidental:\n *\n * - `ne` matches rows whose value is absent. In SQL, `column <> 'x'` is `NULL`\n *   for a `NULL` column and the row drops out. Here \"is not paid\" shows the rows\n *   with no status at all, which is what the chip claims.\n * - `empty` matches `NULL`, blank text and empty lists; `__isnull` on the server\n *   only matches `NULL`. A column that stores `\"\"` instead of `NULL` is where\n *   the two disagree.\n *\n * @example\n * const visible = applyFilters(orders, filters);\n *\n * Each filter's values are normalised once, before the scan, rather than inside\n * the per-row predicate: the arity, the `between` ordering and the value array\n * depend only on the filter, so deriving them per row multiplied that work by\n * the row count. `empty`/`notEmpty` ignore their values entirely, which is why\n * the prepared shape does not need to distinguish them.\n *\n * @param items - The full list.\n * @param filters - Applied filters; incomplete ones are ignored.\n * @returns A new array with the rows that satisfy every complete filter.\n */\nexport function applyFilters<T>(items: readonly T[], filters: readonly Filter[]): T[] {\n    const active = filters.filter(isComplete).map((filter) => ({\n        field: filter.field,\n        operator: filter.operator,\n        values: filter.operator === \"between\" ? orderRange(valuesOf(filter)) : valuesOf(filter),\n    }));\n    if (active.length === 0) return [...items];\n\n    return items.filter((item) =>\n        active.every(({ field, operator, values }) =>\n            matchesOperator(operator, readField(item, field), values),\n        ),\n    );\n}\n"],"mappings":"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"}