tempest-react-sdk 0.38.3 → 0.39.1

package/dist/components/TimePicker/TimePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.js","names":[],"sources":["../../../src/components/TimePicker/TimePicker.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — minuteStep and\n * use12Hours change both the list of options and how a typed value parses, so the\n * body holds parsing, formatting and the option list together; the remaining props\n * are the shared field contract.\n */\nimport { useId, useMemo } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./TimePicker.module.css\";\n\nexport interface TimePickerProps {\n    /** Selected time as a 24h `\"HH:MM\"` string (e.g. `\"14:30\"`). May be `\"\"` for none. */\n    value: string;\n    /** Fired with the new 24h `\"HH:MM\"` string whenever a cell is picked. */\n    onChange: (value: string) => void;\n    /** Granularity of the minute column. Defaults to `5`. */\n    minuteStep?: number;\n    /** When true, show a 1–12 hour column plus an AM/PM column (still emits 24h). */\n    use12Hours?: boolean;\n    label?: string;\n    helperText?: string;\n    disabled?: boolean;\n    className?: string;\n}\n\ntype Period = \"AM\" | \"PM\";\n\ninterface ParsedTime {\n    hour24: number | null;\n    minute: number | null;\n}\n\nfunction pad2(value: number): string {\n    return value.toString().padStart(2, \"0\");\n}\n\n/** Parse a 24h `\"HH:MM\"` string into hour/minute numbers, or nulls when empty/invalid. */\nfunction parseValue(value: string): ParsedTime {\n    const match = /^(\\d{1,2}):(\\d{1,2})$/.exec(value.trim());\n    if (!match) return { hour24: null, minute: null };\n    const hour24 = Number(match[1]);\n    const minute = Number(match[2]);\n    if (hour24 < 0 || hour24 > 23 || minute < 0 || minute > 59) {\n        return { hour24: null, minute: null };\n    }\n    return { hour24, minute };\n}\n\n/** Convert a 24h hour into its 12h display hour (1–12). */\nfunction to12Hour(hour24: number): number {\n    const mod = hour24 % 12;\n    return mod === 0 ? 12 : mod;\n}\n\n/** Convert a 12h display hour + period into a 24h hour (0–23). */\nfunction to24Hour(hour12: number, period: Period): number {\n    const base = hour12 % 12;\n    return period === \"PM\" ? base + 12 : base;\n}\n\n/**\n * TimePicker — inline, dependency-free time picker with Material \"spinner column\" styling.\n *\n * Renders scrollable columns of selectable cells (hours, minutes, and AM/PM when\n * `use12Hours`). Always emits a 24h `\"HH:MM\"` string via `onChange`, regardless of\n * whether the 12h display is enabled.\n */\nexport function TimePicker({\n    value,\n    onChange,\n    minuteStep = 5,\n    use12Hours = false,\n    label,\n    helperText,\n    disabled,\n    className,\n}: TimePickerProps) {\n    const id = useId();\n    const { hour24, minute } = useMemo(() => parseValue(value), [value]);\n\n    const period: Period = hour24 !== null && hour24 >= 12 ? \"PM\" : \"AM\";\n\n    const hourCells = useMemo<number[]>(() => {\n        if (use12Hours) {\n            return Array.from({ length: 12 }, (_, index) => index + 1);\n        }\n        return Array.from({ length: 24 }, (_, index) => index);\n    }, [use12Hours]);\n\n    const minuteCells = useMemo<number[]>(() => {\n        const step = minuteStep > 0 ? minuteStep : 1;\n        const cells: number[] = [];\n        for (let current = 0; current < 60; current += step) {\n            cells.push(current);\n        }\n        return cells;\n    }, [minuteStep]);\n\n    const selectedHourDisplay = hour24 === null ? null : use12Hours ? to12Hour(hour24) : hour24;\n\n    const emit = (nextHour24: number, nextMinute: number): void => {\n        onChange(`${pad2(nextHour24)}:${pad2(nextMinute)}`);\n    };\n\n    const handleHour = (displayHour: number): void => {\n        if (disabled) return;\n        const nextMinute = minute ?? 0;\n        const nextHour24 = use12Hours ? to24Hour(displayHour, period) : displayHour;\n        emit(nextHour24, nextMinute);\n    };\n\n    const handleMinute = (nextMinute: number): void => {\n        if (disabled) return;\n        const baseHour24 = hour24 ?? (use12Hours ? to24Hour(12, \"AM\") : 0);\n        emit(baseHour24, nextMinute);\n    };\n\n    const handlePeriod = (nextPeriod: Period): void => {\n        if (disabled) return;\n        const displayHour = selectedHourDisplay ?? 12;\n        const nextMinute = minute ?? 0;\n        emit(to24Hour(displayHour, nextPeriod), nextMinute);\n    };\n\n    return (\n        <div className={cn(styles.wrapper, disabled && styles.disabled, className)}>\n            {label && (\n                <span id={`${id}-label`} className={styles.label}>\n                    {label}\n                </span>\n            )}\n            <div className={styles.columns}>\n                <ul role=\"listbox\" aria-label=\"Horas\" className={styles.column}>\n                    {hourCells.map((cell) => {\n                        const active = cell === selectedHourDisplay;\n                        return (\n                            <li key={cell} className={styles.cellWrapper}>\n                                <button\n                                    type=\"button\"\n                                    role=\"option\"\n                                    aria-selected={active}\n                                    disabled={disabled}\n                                    className={cn(styles.cell, active && styles.active)}\n                                    onClick={() => handleHour(cell)}\n                                >\n                                    {use12Hours ? cell : pad2(cell)}\n                                </button>\n                            </li>\n                        );\n                    })}\n                </ul>\n                <ul role=\"listbox\" aria-label=\"Minutos\" className={styles.column}>\n                    {minuteCells.map((cell) => {\n                        const active = cell === minute;\n                        return (\n                            <li key={cell} className={styles.cellWrapper}>\n                                <button\n                                    type=\"button\"\n                                    role=\"option\"\n                                    aria-selected={active}\n                                    disabled={disabled}\n                                    className={cn(styles.cell, active && styles.active)}\n                                    onClick={() => handleMinute(cell)}\n                                >\n                                    {pad2(cell)}\n                                </button>\n                            </li>\n                        );\n                    })}\n                </ul>\n                {use12Hours && (\n                    <ul role=\"listbox\" aria-label=\"Período\" className={styles.column}>\n                        {([\"AM\", \"PM\"] as Period[]).map((cell) => {\n                            const active = selectedHourDisplay !== null && cell === period;\n                            return (\n                                <li key={cell} className={styles.cellWrapper}>\n                                    <button\n                                        type=\"button\"\n                                        role=\"option\"\n                                        aria-selected={active}\n                                        disabled={disabled}\n                                        className={cn(styles.cell, active && styles.active)}\n                                        onClick={() => handlePeriod(cell)}\n                                    >\n                                        {cell}\n                                    </button>\n                                </li>\n                            );\n                        })}\n                    </ul>\n                )}\n            </div>\n            {helperText && <span className={styles.helper}>{helperText}</span>}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"TimePicker.js","names":[],"sources":["../../../src/components/TimePicker/TimePicker.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — minuteStep and\n * use12Hours change both the list of options and how a typed value parses, so the\n * body holds parsing, formatting and the option list together; the remaining props\n * are the shared field contract.\n */\nimport { useId, useMemo } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./TimePicker.module.css\";\n\nexport interface TimePickerProps {\n    /** Selected time as a 24h `\"HH:MM\"` string (e.g. `\"14:30\"`). May be `\"\"` for none. */\n    value: string;\n    /** Fired with the new 24h `\"HH:MM\"` string whenever a cell is picked. */\n    onChange: (value: string) => void;\n    /** Granularity of the minute column. Defaults to `5`. */\n    minuteStep?: number;\n    /** When true, show a 1–12 hour column plus an AM/PM column (still emits 24h). */\n    use12Hours?: boolean;\n    label?: string;\n    helperText?: string;\n    disabled?: boolean;\n    className?: string;\n}\n\ntype Period = \"AM\" | \"PM\";\n\ninterface ParsedTime {\n    hour24: number | null;\n    minute: number | null;\n}\n\nfunction pad2(value: number): string {\n    return value.toString().padStart(2, \"0\");\n}\n\n/** Parse a 24h `\"HH:MM\"` string into hour/minute numbers, or nulls when empty/invalid. */\nfunction parseValue(value: string): ParsedTime {\n    const match = /^(\\d{1,2}):(\\d{1,2})$/.exec(value.trim());\n    if (!match) return { hour24: null, minute: null };\n    const hour24 = Number(match[1]);\n    const minute = Number(match[2]);\n    if (hour24 < 0 || hour24 > 23 || minute < 0 || minute > 59) {\n        return { hour24: null, minute: null };\n    }\n    return { hour24, minute };\n}\n\n/** Convert a 24h hour into its 12h display hour (1–12). */\nfunction to12Hour(hour24: number): number {\n    const mod = hour24 % 12;\n    return mod === 0 ? 12 : mod;\n}\n\n/** Convert a 12h display hour + period into a 24h hour (0–23). */\nfunction to24Hour(hour12: number, period: Period): number {\n    const base = hour12 % 12;\n    return period === \"PM\" ? base + 12 : base;\n}\n\n/**\n * TimePicker — inline, dependency-free time picker with Material \"spinner column\" styling.\n *\n * Renders scrollable columns of selectable cells (hours, minutes, and AM/PM when\n * `use12Hours`). Always emits a 24h `\"HH:MM\"` string via `onChange`, regardless of\n * whether the 12h display is enabled.\n */\nexport function TimePicker({\n    value,\n    onChange,\n    minuteStep = 5,\n    use12Hours = false,\n    label,\n    helperText,\n    disabled,\n    className,\n}: TimePickerProps) {\n    const id = useId();\n    const { hour24, minute } = useMemo(() => parseValue(value), [value]);\n\n    const period: Period = hour24 !== null && hour24 >= 12 ? \"PM\" : \"AM\";\n\n    const hourCells = useMemo<number[]>(() => {\n        if (use12Hours) {\n            return Array.from({ length: 12 }, (_, index) => index + 1);\n        }\n        return Array.from({ length: 24 }, (_, index) => index);\n    }, [use12Hours]);\n\n    const minuteCells = useMemo<number[]>(() => {\n        const step = minuteStep > 0 ? minuteStep : 1;\n        const cells: number[] = [];\n        for (let current = 0; current < 60; current += step) {\n            cells.push(current);\n        }\n        return cells;\n    }, [minuteStep]);\n\n    const selectedHourDisplay = hour24 === null ? null : use12Hours ? to12Hour(hour24) : hour24;\n\n    const emit = (nextHour24: number, nextMinute: number): void => {\n        onChange(`${pad2(nextHour24)}:${pad2(nextMinute)}`);\n    };\n\n    const handleHour = (displayHour: number): void => {\n        if (disabled) return;\n        const nextMinute = minute ?? 0;\n        const nextHour24 = use12Hours ? to24Hour(displayHour, period) : displayHour;\n        emit(nextHour24, nextMinute);\n    };\n\n    const handleMinute = (nextMinute: number): void => {\n        if (disabled) return;\n        const baseHour24 = hour24 ?? (use12Hours ? to24Hour(12, \"AM\") : 0);\n        emit(baseHour24, nextMinute);\n    };\n\n    const handlePeriod = (nextPeriod: Period): void => {\n        if (disabled) return;\n        const displayHour = selectedHourDisplay ?? 12;\n        const nextMinute = minute ?? 0;\n        emit(to24Hour(displayHour, nextPeriod), nextMinute);\n    };\n\n    return (\n        <div className={cn(styles.wrapper, disabled && styles.disabled, className)}>\n            {label && (\n                <span id={`${id}-label`} className={styles.label}>\n                    {label}\n                </span>\n            )}\n            <div className={styles.columns}>\n                <ul role=\"listbox\" aria-label=\"Horas\" className={styles.column}>\n                    {hourCells.map((cell) => {\n                        const active = cell === selectedHourDisplay;\n                        return (\n                            <li key={cell} className={styles.cellWrapper}>\n                                <button\n                                    type=\"button\"\n                                    role=\"option\"\n                                    aria-selected={active}\n                                    disabled={disabled}\n                                    className={cn(styles.cell, active && styles.active)}\n                                    onClick={() => handleHour(cell)}\n                                >\n                                    {use12Hours ? cell : pad2(cell)}\n                                </button>\n                            </li>\n                        );\n                    })}\n                </ul>\n                <ul role=\"listbox\" aria-label=\"Minutos\" className={styles.column}>\n                    {minuteCells.map((cell) => {\n                        const active = cell === minute;\n                        return (\n                            <li key={cell} className={styles.cellWrapper}>\n                                <button\n                                    type=\"button\"\n                                    role=\"option\"\n                                    aria-selected={active}\n                                    disabled={disabled}\n                                    className={cn(styles.cell, active && styles.active)}\n                                    onClick={() => handleMinute(cell)}\n                                >\n                                    {pad2(cell)}\n                                </button>\n                            </li>\n                        );\n                    })}\n                </ul>\n                {use12Hours && (\n                    <ul role=\"listbox\" aria-label=\"Período\" className={styles.column}>\n                        {([\"AM\", \"PM\"] as Period[]).map((cell) => {\n                            const active = selectedHourDisplay !== null && cell === period;\n                            return (\n                                <li key={cell} className={styles.cellWrapper}>\n                                    <button\n                                        type=\"button\"\n                                        role=\"option\"\n                                        aria-selected={active}\n                                        disabled={disabled}\n                                        className={cn(styles.cell, active && styles.active)}\n                                        onClick={() => handlePeriod(cell)}\n                                    >\n                                        {cell}\n                                    </button>\n                                </li>\n                            );\n                        })}\n                    </ul>\n                )}\n            </div>\n            {helperText && <span className={styles.helper}>{helperText}</span>}\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Timeline/Timeline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.cjs","names":[],"sources":["../../../src/components/Timeline/Timeline.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Timeline.module.css\";\n\nexport type TimelineMarker = \"primary\" | \"success\" | \"warning\" | \"danger\" | \"neutral\";\n\nexport interface TimelineItem {\n    /** Stable identifier (used as React key). */\n    id: string;\n    /** Title rendered as the entry headline. */\n    title: ReactNode;\n    /** Optional subtitle / description below the title. */\n    description?: ReactNode;\n    /** Right-aligned meta column (timestamps, durations). */\n    meta?: ReactNode;\n    /** Optional custom icon rendered inside the marker. */\n    icon?: ReactNode;\n    /** Marker color. Default `\"primary\"`. */\n    marker?: TimelineMarker;\n}\n\nexport interface TimelineProps extends HTMLAttributes<HTMLOListElement> {\n    items: TimelineItem[];\n    /** Show the connecting line between markers. Default `true`. */\n    connector?: boolean;\n}\n\n/**\n * Vertical event timeline — activity feeds, order trackers, audit logs.\n * Each entry has a marker (color or custom icon), title, optional\n * description and right-aligned meta column.\n *\n * @example\n * <Timeline items={[\n *     { id: \"1\", title: \"Pedido criado\", meta: \"10:24\", marker: \"primary\" },\n *     { id: \"2\", title: \"Aprovação\", meta: \"10:25\", marker: \"success\" },\n *     { id: \"3\", title: \"Saiu pra entrega\", meta: \"11:00\", marker: \"warning\" },\n * ]} />\n */\nexport function Timeline({ items, connector = true, className, ...props }: TimelineProps) {\n    return (\n        <ol className={cn(styles.timeline, connector && styles.connector, className)} {...props}>\n            {items.map((item, index) => {\n                const isLast = index === items.length - 1;\n                return (\n                    <li key={item.id} className={styles.item}>\n                        <div className={styles.markerColumn}>\n                            <span\n                                className={cn(\n                                    styles.marker,\n                                    styles[`marker-${item.marker ?? \"primary\"}`],\n                                )}\n                                aria-hidden=\"true\"\n                            >\n                                {item.icon}\n                            </span>\n                            {connector && !isLast && (\n                                <span className={styles.line} aria-hidden=\"true\" />\n                            )}\n                        </div>\n                        <div className={styles.body}>\n                            <div className={styles.row}>\n                                <span className={styles.title}>{item.title}</span>\n                                {item.meta && <span className={styles.meta}>{item.meta}</span>}\n                            </div>\n                            {item.description && (\n                                <p className={styles.description}>{item.description}</p>\n                            )}\n                        </div>\n                    </li>\n                );\n            })}\n        </ol>\n    );\n}\n"],"mappings":"4GAuCA,SAAgB,EAAS,CAAE,QAAO,YAAY,GAAM,YAAW,GAAG,GAAwB,CACtF,OACI,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAW,EAAA,GAAG,EAAA,QAAO,SAAU,GAAa,EAAA,QAAO,UAAW,CAAS,EAAG,GAAI,WAC7E,EAAM,KAAK,EAAM,IAAU,CACxB,IAAM,EAAS,IAAU,EAAM,OAAS,EACxC,OACI,EAAA,EAAA,KAAA,CAAC,KAAD,CAAkB,UAAW,EAAA,QAAO,cAApC,EACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,sBAAvB,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CACI,UAAW,EAAA,GACP,EAAA,QAAO,OACP,EAAA,QAAO,UAAU,EAAK,QAAU,YACpC,EACA,cAAY,gBAEX,EAAK,IACJ,CAAA,EACL,GAAa,CAAC,IACX,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAM,cAAY,MAAQ,CAAA,CAErD,KACL,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,cAAvB,EACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,aAAvB,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,eAAQ,EAAK,KAAY,CAAA,EAChD,EAAK,OAAQ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,cAAO,EAAK,IAAW,CAAA,CAC5D,IACJ,EAAK,cACF,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAW,EAAA,QAAO,qBAAc,EAAK,WAAe,CAAA,CAE1D,GACL,GAxBK,EAAK,EAwBV,CAEZ,CAAC,CACD,CAAA,CAEZ"}
+{"version":3,"file":"Timeline.cjs","names":[],"sources":["../../../src/components/Timeline/Timeline.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Timeline.module.css\";\n\nexport type TimelineMarker = \"primary\" | \"success\" | \"warning\" | \"danger\" | \"neutral\";\n\nexport interface TimelineItem {\n    /** Stable identifier (used as React key). */\n    id: string;\n    /** Title rendered as the entry headline. */\n    title: ReactNode;\n    /** Optional subtitle / description below the title. */\n    description?: ReactNode;\n    /** Right-aligned meta column (timestamps, durations). */\n    meta?: ReactNode;\n    /** Optional custom icon rendered inside the marker. */\n    icon?: ReactNode;\n    /** Marker color. Default `\"primary\"`. */\n    marker?: TimelineMarker;\n}\n\nexport interface TimelineProps extends HTMLAttributes<HTMLOListElement> {\n    items: TimelineItem[];\n    /** Show the connecting line between markers. Default `true`. */\n    connector?: boolean;\n}\n\n/**\n * Vertical event timeline — activity feeds, order trackers, audit logs.\n * Each entry has a marker (color or custom icon), title, optional\n * description and right-aligned meta column.\n *\n * @example\n * <Timeline items={[\n *     { id: \"1\", title: \"Pedido criado\", meta: \"10:24\", marker: \"primary\" },\n *     { id: \"2\", title: \"Aprovação\", meta: \"10:25\", marker: \"success\" },\n *     { id: \"3\", title: \"Saiu pra entrega\", meta: \"11:00\", marker: \"warning\" },\n * ]} />\n */\nexport function Timeline({ items, connector = true, className, ...props }: TimelineProps) {\n    return (\n        <ol className={cn(styles.timeline, connector && styles.connector, className)} {...props}>\n            {items.map((item, index) => {\n                const isLast = index === items.length - 1;\n                return (\n                    <li key={item.id} className={styles.item}>\n                        <div className={styles.markerColumn}>\n                            <span\n                                className={cn(\n                                    styles.marker,\n                                    styles[`marker-${item.marker ?? \"primary\"}`],\n                                )}\n                                aria-hidden=\"true\"\n                            >\n                                {item.icon}\n                            </span>\n                            {connector && !isLast && (\n                                <span className={styles.line} aria-hidden=\"true\" />\n                            )}\n                        </div>\n                        <div className={styles.body}>\n                            <div className={styles.row}>\n                                <span className={styles.title}>{item.title}</span>\n                                {item.meta && <span className={styles.meta}>{item.meta}</span>}\n                            </div>\n                            {item.description && (\n                                <p className={styles.description}>{item.description}</p>\n                            )}\n                        </div>\n                    </li>\n                );\n            })}\n        </ol>\n    );\n}\n"],"mappings":"4GAuCA,SAAgB,EAAS,CAAE,QAAO,YAAY,GAAM,YAAW,GAAG,GAAwB,CACtF,OACI,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAW,EAAA,GAAG,EAAA,QAAO,SAAU,GAAa,EAAA,QAAO,UAAW,CAAS,EAAG,GAAI,EAC7E,SAAA,EAAM,KAAK,EAAM,IAAU,CACxB,IAAM,EAAS,IAAU,EAAM,OAAS,EACxC,OACI,EAAA,EAAA,KAAA,CAAC,KAAD,CAAkB,UAAW,EAAA,QAAO,KAApC,SAAA,EACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,aAAvB,SAAA,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CACI,UAAW,EAAA,GACP,EAAA,QAAO,OACP,EAAA,QAAO,UAAU,EAAK,QAAU,YACpC,EACA,cAAY,OAEX,SAAA,EAAK,IACJ,CAAA,EACL,GAAa,CAAC,IACX,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAM,cAAY,MAAQ,CAAA,CAErD,CACL,CAAA,GAAA,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAvB,SAAA,EACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,IAAvB,SAAA,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAK,KAAY,CAAA,EAChD,EAAK,OAAQ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAO,SAAA,EAAK,IAAW,CAAA,CAC5D,CACJ,CAAA,EAAA,EAAK,cACF,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAW,EAAA,QAAO,YAAc,SAAA,EAAK,WAAe,CAAA,CAE1D,CACL,CAAA,CAAA,CAxBK,EAAA,EAAK,EAwBV,CAEZ,CAAC,CACD,CAAA,CAEZ"}

package/dist/components/Timeline/Timeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"Timeline.js","names":[],"sources":["../../../src/components/Timeline/Timeline.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Timeline.module.css\";\n\nexport type TimelineMarker = \"primary\" | \"success\" | \"warning\" | \"danger\" | \"neutral\";\n\nexport interface TimelineItem {\n    /** Stable identifier (used as React key). */\n    id: string;\n    /** Title rendered as the entry headline. */\n    title: ReactNode;\n    /** Optional subtitle / description below the title. */\n    description?: ReactNode;\n    /** Right-aligned meta column (timestamps, durations). */\n    meta?: ReactNode;\n    /** Optional custom icon rendered inside the marker. */\n    icon?: ReactNode;\n    /** Marker color. Default `\"primary\"`. */\n    marker?: TimelineMarker;\n}\n\nexport interface TimelineProps extends HTMLAttributes<HTMLOListElement> {\n    items: TimelineItem[];\n    /** Show the connecting line between markers. Default `true`. */\n    connector?: boolean;\n}\n\n/**\n * Vertical event timeline — activity feeds, order trackers, audit logs.\n * Each entry has a marker (color or custom icon), title, optional\n * description and right-aligned meta column.\n *\n * @example\n * <Timeline items={[\n *     { id: \"1\", title: \"Pedido criado\", meta: \"10:24\", marker: \"primary\" },\n *     { id: \"2\", title: \"Aprovação\", meta: \"10:25\", marker: \"success\" },\n *     { id: \"3\", title: \"Saiu pra entrega\", meta: \"11:00\", marker: \"warning\" },\n * ]} />\n */\nexport function Timeline({ items, connector = true, className, ...props }: TimelineProps) {\n    return (\n        <ol className={cn(styles.timeline, connector && styles.connector, className)} {...props}>\n            {items.map((item, index) => {\n                const isLast = index === items.length - 1;\n                return (\n                    <li key={item.id} className={styles.item}>\n                        <div className={styles.markerColumn}>\n                            <span\n                                className={cn(\n                                    styles.marker,\n                                    styles[`marker-${item.marker ?? \"primary\"}`],\n                                )}\n                                aria-hidden=\"true\"\n                            >\n                                {item.icon}\n                            </span>\n                            {connector && !isLast && (\n                                <span className={styles.line} aria-hidden=\"true\" />\n                            )}\n                        </div>\n                        <div className={styles.body}>\n                            <div className={styles.row}>\n                                <span className={styles.title}>{item.title}</span>\n                                {item.meta && <span className={styles.meta}>{item.meta}</span>}\n                            </div>\n                            {item.description && (\n                                <p className={styles.description}>{item.description}</p>\n                            )}\n                        </div>\n                    </li>\n                );\n            })}\n        </ol>\n    );\n}\n"],"mappings":";;;;AAuCA,SAAgB,EAAS,EAAE,UAAO,eAAY,IAAM,cAAW,GAAG,KAAwB;CACtF,OACI,kBAAC,MAAD;EAAI,WAAW,EAAG,EAAO,UAAU,KAAa,EAAO,WAAW,CAAS;EAAG,GAAI;YAC7E,EAAM,KAAK,GAAM,MAAU;GACxB,IAAM,IAAS,MAAU,EAAM,SAAS;GACxC,OACI,kBAAC,MAAD;IAAkB,WAAW,EAAO;cAApC,CACI,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAvB,CACI,kBAAC,QAAD;MACI,WAAW,EACP,EAAO,QACP,EAAO,UAAU,EAAK,UAAU,YACpC;MACA,eAAY;gBAEX,EAAK;KACJ,CAAA,GACL,KAAa,CAAC,KACX,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAM,eAAY;KAAQ,CAAA,CAErD;QACL,kBAAC,OAAD;KAAK,WAAW,EAAO;eAAvB,CACI,kBAAC,OAAD;MAAK,WAAW,EAAO;gBAAvB,CACI,kBAAC,QAAD;OAAM,WAAW,EAAO;iBAAQ,EAAK;MAAY,CAAA,GAChD,EAAK,QAAQ,kBAAC,QAAD;OAAM,WAAW,EAAO;iBAAO,EAAK;MAAW,CAAA,CAC5D;SACJ,EAAK,eACF,kBAAC,KAAD;MAAG,WAAW,EAAO;gBAAc,EAAK;KAAe,CAAA,CAE1D;MACL;MAxBK,EAAK,EAwBV;EAEZ,CAAC;CACD,CAAA;AAEZ"}
+{"version":3,"file":"Timeline.js","names":[],"sources":["../../../src/components/Timeline/Timeline.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Timeline.module.css\";\n\nexport type TimelineMarker = \"primary\" | \"success\" | \"warning\" | \"danger\" | \"neutral\";\n\nexport interface TimelineItem {\n    /** Stable identifier (used as React key). */\n    id: string;\n    /** Title rendered as the entry headline. */\n    title: ReactNode;\n    /** Optional subtitle / description below the title. */\n    description?: ReactNode;\n    /** Right-aligned meta column (timestamps, durations). */\n    meta?: ReactNode;\n    /** Optional custom icon rendered inside the marker. */\n    icon?: ReactNode;\n    /** Marker color. Default `\"primary\"`. */\n    marker?: TimelineMarker;\n}\n\nexport interface TimelineProps extends HTMLAttributes<HTMLOListElement> {\n    items: TimelineItem[];\n    /** Show the connecting line between markers. Default `true`. */\n    connector?: boolean;\n}\n\n/**\n * Vertical event timeline — activity feeds, order trackers, audit logs.\n * Each entry has a marker (color or custom icon), title, optional\n * description and right-aligned meta column.\n *\n * @example\n * <Timeline items={[\n *     { id: \"1\", title: \"Pedido criado\", meta: \"10:24\", marker: \"primary\" },\n *     { id: \"2\", title: \"Aprovação\", meta: \"10:25\", marker: \"success\" },\n *     { id: \"3\", title: \"Saiu pra entrega\", meta: \"11:00\", marker: \"warning\" },\n * ]} />\n */\nexport function Timeline({ items, connector = true, className, ...props }: TimelineProps) {\n    return (\n        <ol className={cn(styles.timeline, connector && styles.connector, className)} {...props}>\n            {items.map((item, index) => {\n                const isLast = index === items.length - 1;\n                return (\n                    <li key={item.id} className={styles.item}>\n                        <div className={styles.markerColumn}>\n                            <span\n                                className={cn(\n                                    styles.marker,\n                                    styles[`marker-${item.marker ?? \"primary\"}`],\n                                )}\n                                aria-hidden=\"true\"\n                            >\n                                {item.icon}\n                            </span>\n                            {connector && !isLast && (\n                                <span className={styles.line} aria-hidden=\"true\" />\n                            )}\n                        </div>\n                        <div className={styles.body}>\n                            <div className={styles.row}>\n                                <span className={styles.title}>{item.title}</span>\n                                {item.meta && <span className={styles.meta}>{item.meta}</span>}\n                            </div>\n                            {item.description && (\n                                <p className={styles.description}>{item.description}</p>\n                            )}\n                        </div>\n                    </li>\n                );\n            })}\n        </ol>\n    );\n}\n"],"mappings":";;;;AAuCA,SAAgB,EAAS,EAAE,UAAO,eAAY,IAAM,cAAW,GAAG,KAAwB;CACtF,OACI,kBAAC,MAAD;EAAI,WAAW,EAAG,EAAO,UAAU,KAAa,EAAO,WAAW,CAAS;EAAG,GAAI;EAC7E,UAAA,EAAM,KAAK,GAAM,MAAU;GACxB,IAAM,IAAS,MAAU,EAAM,SAAS;GACxC,OACI,kBAAC,MAAD;IAAkB,WAAW,EAAO;IAApC,UAAA,CACI,kBAAC,OAAD;KAAK,WAAW,EAAO;KAAvB,UAAA,CACI,kBAAC,QAAD;MACI,WAAW,EACP,EAAO,QACP,EAAO,UAAU,EAAK,UAAU,YACpC;MACA,eAAY;MAEX,UAAA,EAAK;KACJ,CAAA,GACL,KAAa,CAAC,KACX,kBAAC,QAAD;MAAM,WAAW,EAAO;MAAM,eAAY;KAAQ,CAAA,CAErD;IACL,CAAA,GAAA,kBAAC,OAAD;KAAK,WAAW,EAAO;KAAvB,UAAA,CACI,kBAAC,OAAD;MAAK,WAAW,EAAO;MAAvB,UAAA,CACI,kBAAC,QAAD;OAAM,WAAW,EAAO;OAAQ,UAAA,EAAK;MAAY,CAAA,GAChD,EAAK,QAAQ,kBAAC,QAAD;OAAM,WAAW,EAAO;OAAO,UAAA,EAAK;MAAW,CAAA,CAC5D;KACJ,CAAA,GAAA,EAAK,eACF,kBAAC,KAAD;MAAG,WAAW,EAAO;MAAc,UAAA,EAAK;KAAe,CAAA,CAE1D;IACL,CAAA,CAAA;GAxBK,GAAA,EAAK,EAwBV;EAEZ,CAAC;CACD,CAAA;AAEZ"}

package/dist/components/Toast/ToastProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToastProvider.cjs","names":[],"sources":["../../../src/components/Toast/ToastProvider.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines — the provider is the queue: enqueue, dedupe, auto-\n * dismiss timers, pause on hover and the portal that renders them. Splitting the\n * queue from the renderer would put a timer in one file and the element it dismisses\n * in another.\n */\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Toast.module.css\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\nexport interface ToastOptions {\n    id?: string;\n    title?: string;\n    description?: string;\n    variant?: ToastVariant;\n    /** Auto-dismiss timeout in ms. Pass `0` to keep the toast until dismissed manually. */\n    duration?: number;\n}\n\ninterface ToastEntry extends Required<Omit<ToastOptions, \"id\" | \"title\" | \"description\">> {\n    id: string;\n    title?: string;\n    description?: string;\n}\n\nexport interface ToastApi {\n    show: (options: ToastOptions) => string;\n    dismiss: (id: string) => void;\n    success: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    error: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n    warning: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    info: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n}\n\nconst ToastContext = createContext<ToastApi | null>(null);\n\n/**\n * Access the toast API. Must be used inside a {@link ToastProvider}.\n *\n * @returns Methods to show and dismiss toasts.\n */\nexport function useToast(): ToastApi {\n    const ctx = useContext(ToastContext);\n    if (!ctx) throw new Error(\"useToast must be used inside a <ToastProvider>\");\n    return ctx;\n}\n\nexport type ToastPosition =\n    \"top-right\" | \"top-left\" | \"top-center\" | \"bottom-right\" | \"bottom-left\" | \"bottom-center\";\n\nexport interface ToastProviderProps {\n    children: ReactNode;\n    /** Default auto-dismiss duration (ms). Default 4000. */\n    defaultDuration?: number;\n    /** Stack position on screen. Default `\"top-right\"`. */\n    position?: ToastPosition;\n}\n\n/**\n * Renders a portalled toast container and exposes the imperative {@link useToast} API.\n */\nexport function ToastProvider({\n    children,\n    defaultDuration = 4000,\n    position = \"top-right\",\n}: ToastProviderProps) {\n    const [toasts, setToasts] = useState<ToastEntry[]>([]);\n    const counter = useRef<number>(0);\n\n    const dismiss = useCallback((id: string): void => {\n        setToasts((current) => current.filter((toast) => toast.id !== id));\n    }, []);\n\n    const show = useCallback(\n        (options: ToastOptions): string => {\n            const id = options.id ?? `toast-${++counter.current}`;\n            const entry: ToastEntry = {\n                id,\n                title: options.title,\n                description: options.description,\n                variant: options.variant ?? \"info\",\n                duration: options.duration ?? defaultDuration,\n            };\n            setToasts((current) => [...current, entry]);\n            return id;\n        },\n        [defaultDuration],\n    );\n\n    const api = useMemo<ToastApi>(\n        () => ({\n            show,\n            dismiss,\n            success: (description, options) =>\n                show({ ...options, description, variant: \"success\" }),\n            error: (description, options) => show({ ...options, description, variant: \"error\" }),\n            warning: (description, options) =>\n                show({ ...options, description, variant: \"warning\" }),\n            info: (description, options) => show({ ...options, description, variant: \"info\" }),\n        }),\n        [show, dismiss],\n    );\n\n    return (\n        <ToastContext.Provider value={api}>\n            {children}\n            <ToastContainer toasts={toasts} onDismiss={dismiss} position={position} />\n        </ToastContext.Provider>\n    );\n}\n\ninterface ContainerProps {\n    toasts: ToastEntry[];\n    onDismiss: (id: string) => void;\n    position: ToastPosition;\n}\n\nfunction positionClass(position: ToastPosition): string {\n    switch (position) {\n        case \"top-left\":\n            return styles.positionTopLeft;\n        case \"top-center\":\n            return styles.positionTopCenter;\n        case \"bottom-right\":\n            return styles.positionBottomRight;\n        case \"bottom-left\":\n            return styles.positionBottomLeft;\n        case \"bottom-center\":\n            return styles.positionBottomCenter;\n        case \"top-right\":\n        default:\n            return styles.positionTopRight;\n    }\n}\n\n/**\n * The portalled stack, and the page's live region for toasts.\n *\n * `aria-atomic=\"false\"` matters: with `\"true\"` a screen reader re-reads the\n * **entire** stack on every change, so the third toast of a batch is announced as\n * all three, and dismissing one re-announces the survivors. `\"false\"` announces only\n * the node that was added, which is what the user needs.\n *\n * The stack stays the live region rather than delegating to `useAnnounce`, because\n * routing it through the shared announcer would put the same text in the document\n * twice — once visible, once hidden — and every `getByText(\"Salvo\")` in a consuming\n * app's test suite would start matching two nodes. The announcer is for messages\n * that have no on-screen home; a toast has one.\n */\nfunction ToastContainer({ toasts, onDismiss, position }: ContainerProps) {\n    if (typeof document === \"undefined\") return null;\n    return createPortal(\n        <div\n            className={cn(styles.container, positionClass(position))}\n            aria-live=\"polite\"\n            aria-atomic=\"false\"\n        >\n            {toasts.map((toast) => (\n                <ToastItem key={toast.id} toast={toast} onDismiss={onDismiss} />\n            ))}\n        </div>,\n        document.body,\n    );\n}\n\ninterface ItemProps {\n    toast: ToastEntry;\n    onDismiss: (id: string) => void;\n}\n\n/**\n * One toast.\n *\n * No `role=\"status\"` of its own: it already lives inside the container's live\n * region, and a live region nested in a live region is announced twice by some\n * screen readers.\n */\nfunction ToastItem({ toast, onDismiss }: ItemProps) {\n    useEffect(() => {\n        if (!toast.duration) return;\n        const timer = setTimeout(() => onDismiss(toast.id), toast.duration);\n        return () => clearTimeout(timer);\n    }, [toast.id, toast.duration, onDismiss]);\n\n    return (\n        <div className={cn(styles.toast, styles[toast.variant])}>\n            <div>\n                {toast.title && <p className={styles.title}>{toast.title}</p>}\n                {toast.description && <p className={styles.description}>{toast.description}</p>}\n            </div>\n            <button\n                type=\"button\"\n                className={styles.close}\n                aria-label=\"Fechar notificação\"\n                onClick={() => onDismiss(toast.id)}\n            >\n                <CloseIcon />\n            </button>\n        </div>\n    );\n}\n\nfunction CloseIcon() {\n    return (\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\">\n            <path\n                d=\"M6 6l12 12M6 18L18 6\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n            />\n        </svg>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ToastProvider.cjs","names":[],"sources":["../../../src/components/Toast/ToastProvider.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines — the provider is the queue: enqueue, dedupe, auto-\n * dismiss timers, pause on hover and the portal that renders them. Splitting the\n * queue from the renderer would put a timer in one file and the element it dismisses\n * in another.\n */\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Toast.module.css\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\nexport interface ToastOptions {\n    id?: string;\n    title?: string;\n    description?: string;\n    variant?: ToastVariant;\n    /** Auto-dismiss timeout in ms. Pass `0` to keep the toast until dismissed manually. */\n    duration?: number;\n}\n\ninterface ToastEntry extends Required<Omit<ToastOptions, \"id\" | \"title\" | \"description\">> {\n    id: string;\n    title?: string;\n    description?: string;\n}\n\nexport interface ToastApi {\n    show: (options: ToastOptions) => string;\n    dismiss: (id: string) => void;\n    success: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    error: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n    warning: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    info: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n}\n\nconst ToastContext = createContext<ToastApi | null>(null);\n\n/**\n * Access the toast API. Must be used inside a {@link ToastProvider}.\n *\n * @returns Methods to show and dismiss toasts.\n */\nexport function useToast(): ToastApi {\n    const ctx = useContext(ToastContext);\n    if (!ctx) throw new Error(\"useToast must be used inside a <ToastProvider>\");\n    return ctx;\n}\n\nexport type ToastPosition =\n    \"top-right\" | \"top-left\" | \"top-center\" | \"bottom-right\" | \"bottom-left\" | \"bottom-center\";\n\nexport interface ToastProviderProps {\n    children: ReactNode;\n    /** Default auto-dismiss duration (ms). Default 4000. */\n    defaultDuration?: number;\n    /** Stack position on screen. Default `\"top-right\"`. */\n    position?: ToastPosition;\n}\n\n/**\n * Renders a portalled toast container and exposes the imperative {@link useToast} API.\n */\nexport function ToastProvider({\n    children,\n    defaultDuration = 4000,\n    position = \"top-right\",\n}: ToastProviderProps) {\n    const [toasts, setToasts] = useState<ToastEntry[]>([]);\n    const counter = useRef<number>(0);\n\n    const dismiss = useCallback((id: string): void => {\n        setToasts((current) => current.filter((toast) => toast.id !== id));\n    }, []);\n\n    const show = useCallback(\n        (options: ToastOptions): string => {\n            const id = options.id ?? `toast-${++counter.current}`;\n            const entry: ToastEntry = {\n                id,\n                title: options.title,\n                description: options.description,\n                variant: options.variant ?? \"info\",\n                duration: options.duration ?? defaultDuration,\n            };\n            setToasts((current) => [...current, entry]);\n            return id;\n        },\n        [defaultDuration],\n    );\n\n    const api = useMemo<ToastApi>(\n        () => ({\n            show,\n            dismiss,\n            success: (description, options) =>\n                show({ ...options, description, variant: \"success\" }),\n            error: (description, options) => show({ ...options, description, variant: \"error\" }),\n            warning: (description, options) =>\n                show({ ...options, description, variant: \"warning\" }),\n            info: (description, options) => show({ ...options, description, variant: \"info\" }),\n        }),\n        [show, dismiss],\n    );\n\n    return (\n        <ToastContext.Provider value={api}>\n            {children}\n            <ToastContainer toasts={toasts} onDismiss={dismiss} position={position} />\n        </ToastContext.Provider>\n    );\n}\n\ninterface ContainerProps {\n    toasts: ToastEntry[];\n    onDismiss: (id: string) => void;\n    position: ToastPosition;\n}\n\nfunction positionClass(position: ToastPosition): string {\n    switch (position) {\n        case \"top-left\":\n            return styles.positionTopLeft;\n        case \"top-center\":\n            return styles.positionTopCenter;\n        case \"bottom-right\":\n            return styles.positionBottomRight;\n        case \"bottom-left\":\n            return styles.positionBottomLeft;\n        case \"bottom-center\":\n            return styles.positionBottomCenter;\n        case \"top-right\":\n        default:\n            return styles.positionTopRight;\n    }\n}\n\n/**\n * The portalled stack, and the page's live region for toasts.\n *\n * `aria-atomic=\"false\"` matters: with `\"true\"` a screen reader re-reads the\n * **entire** stack on every change, so the third toast of a batch is announced as\n * all three, and dismissing one re-announces the survivors. `\"false\"` announces only\n * the node that was added, which is what the user needs.\n *\n * The stack stays the live region rather than delegating to `useAnnounce`, because\n * routing it through the shared announcer would put the same text in the document\n * twice — once visible, once hidden — and every `getByText(\"Salvo\")` in a consuming\n * app's test suite would start matching two nodes. The announcer is for messages\n * that have no on-screen home; a toast has one.\n */\nfunction ToastContainer({ toasts, onDismiss, position }: ContainerProps) {\n    if (typeof document === \"undefined\") return null;\n    return createPortal(\n        <div\n            className={cn(styles.container, positionClass(position))}\n            aria-live=\"polite\"\n            aria-atomic=\"false\"\n        >\n            {toasts.map((toast) => (\n                <ToastItem key={toast.id} toast={toast} onDismiss={onDismiss} />\n            ))}\n        </div>,\n        document.body,\n    );\n}\n\ninterface ItemProps {\n    toast: ToastEntry;\n    onDismiss: (id: string) => void;\n}\n\n/**\n * One toast.\n *\n * No `role=\"status\"` of its own: it already lives inside the container's live\n * region, and a live region nested in a live region is announced twice by some\n * screen readers.\n */\nfunction ToastItem({ toast, onDismiss }: ItemProps) {\n    useEffect(() => {\n        if (!toast.duration) return;\n        const timer = setTimeout(() => onDismiss(toast.id), toast.duration);\n        return () => clearTimeout(timer);\n    }, [toast.id, toast.duration, onDismiss]);\n\n    return (\n        <div className={cn(styles.toast, styles[toast.variant])}>\n            <div>\n                {toast.title && <p className={styles.title}>{toast.title}</p>}\n                {toast.description && <p className={styles.description}>{toast.description}</p>}\n            </div>\n            <button\n                type=\"button\"\n                className={styles.close}\n                aria-label=\"Fechar notificação\"\n                onClick={() => onDismiss(toast.id)}\n            >\n                <CloseIcon />\n            </button>\n        </div>\n    );\n}\n\nfunction CloseIcon() {\n    return (\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\">\n            <path\n                d=\"M6 6l12 12M6 18L18 6\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n            />\n        </svg>\n    );\n}\n"],"mappings":"mJAoDA,IAAM,GAAA,EAAe,EAAA,cAAA,CAA+B,IAAI,EAOxD,SAAgB,GAAqB,CACjC,IAAM,GAAA,EAAM,EAAA,WAAA,CAAW,CAAY,EACnC,GAAI,CAAC,EAAK,MAAU,MAAM,gDAAgD,EAC1E,OAAO,CACX,CAgBA,SAAgB,EAAc,CAC1B,WACA,kBAAkB,IAClB,WAAW,aACQ,CACnB,GAAM,CAAC,EAAQ,IAAA,EAAa,EAAA,SAAA,CAAuB,CAAC,CAAC,EAC/C,GAAA,EAAU,EAAA,OAAA,CAAe,CAAC,EAE1B,GAAA,EAAU,EAAA,YAAA,CAAa,GAAqB,CAC9C,EAAW,GAAY,EAAQ,OAAQ,GAAU,EAAM,KAAO,CAAE,CAAC,CACrE,EAAG,CAAC,CAAC,EAEC,GAAA,EAAO,EAAA,YAAA,CACR,GAAkC,CAC/B,IAAM,EAAK,EAAQ,IAAM,SAAS,EAAE,EAAQ,UACtC,EAAoB,CACtB,KACA,MAAO,EAAQ,MACf,YAAa,EAAQ,YACrB,QAAS,EAAQ,SAAW,OAC5B,SAAU,EAAQ,UAAY,CAClC,EAEA,OADA,EAAW,GAAY,CAAC,GAAG,EAAS,CAAK,CAAC,EACnC,CACX,EACA,CAAC,CAAe,CACpB,EAEM,GAAA,EAAM,EAAA,QAAA,MACD,CACH,OACA,UACA,SAAU,EAAa,IACnB,EAAK,CAAE,GAAG,EAAS,cAAa,QAAS,SAAU,CAAC,EACxD,OAAQ,EAAa,IAAY,EAAK,CAAE,GAAG,EAAS,cAAa,QAAS,OAAQ,CAAC,EACnF,SAAU,EAAa,IACnB,EAAK,CAAE,GAAG,EAAS,cAAa,QAAS,SAAU,CAAC,EACxD,MAAO,EAAa,IAAY,EAAK,CAAE,GAAG,EAAS,cAAa,QAAS,MAAO,CAAC,CACrF,GACA,CAAC,EAAM,CAAO,CAClB,EAEA,OACI,EAAA,EAAA,KAAA,CAAC,EAAa,SAAd,CAAuB,MAAO,EAA9B,SAAA,CACK,GACD,EAAA,EAAA,IAAA,CAAC,EAAD,CAAwB,SAAQ,UAAW,EAAmB,UAAW,CAAA,CACtD,GAE/B,CAQA,SAAS,EAAc,EAAiC,CACpD,OAAQ,EAAR,CACI,IAAK,WACD,OAAO,EAAA,QAAO,gBAClB,IAAK,aACD,OAAO,EAAA,QAAO,kBAClB,IAAK,eACD,OAAO,EAAA,QAAO,oBAClB,IAAK,cACD,OAAO,EAAA,QAAO,mBAClB,IAAK,gBACD,OAAO,EAAA,QAAO,qBAElB,QACI,OAAO,EAAA,QAAO,gBACtB,CACJ,CAgBA,SAAS,EAAe,CAAE,SAAQ,YAAW,YAA4B,CAErE,OADI,OAAO,SAAa,IAAoB,MAC5C,EAAO,EAAA,aAAA,EACH,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,UAAW,EAAc,CAAQ,CAAC,EACvD,YAAU,SACV,cAAY,QAEX,SAAA,EAAO,IAAK,IACT,EAAA,EAAA,IAAA,CAAC,EAAD,CAAiC,QAAkB,WAAY,EAA/C,EAAM,EAAyC,CAClE,CACA,CAAA,EACL,SAAS,IACb,CACJ,CAcA,SAAS,EAAU,CAAE,QAAO,aAAwB,CAOhD,OANA,EAAA,EAAA,UAAA,KAAgB,CACZ,GAAI,CAAC,EAAM,SAAU,OACrB,IAAM,EAAQ,eAAiB,EAAU,EAAM,EAAE,EAAG,EAAM,QAAQ,EAClE,UAAa,aAAa,CAAK,CACnC,EAAG,CAAC,EAAM,GAAI,EAAM,SAAU,CAAS,CAAC,GAGpC,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,MAAO,EAAA,QAAO,EAAM,QAAQ,EAAtD,SAAA,EACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAA,SAAA,CACK,EAAM,QAAS,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAM,KAAS,CAAA,EAC3D,EAAM,cAAe,EAAA,EAAA,IAAA,CAAC,IAAD,CAAG,UAAW,EAAA,QAAO,YAAc,SAAA,EAAM,WAAe,CAAA,CAC7E,CAAA,CAAA,GACL,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,MAClB,aAAW,qBACX,YAAe,EAAU,EAAM,EAAE,EAEjC,UAAA,EAAA,EAAA,IAAA,CAAC,EAAD,CAAY,CAAA,CACR,CAAA,CACP,GAEb,CAEA,SAAS,GAAY,CACjB,OACI,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OACjD,UAAA,EAAA,EAAA,IAAA,CAAC,OAAD,CACI,EAAE,uBACF,OAAO,eACP,YAAY,IACZ,cAAc,OACjB,CAAA,CACA,CAAA,CAEb"}

package/dist/components/Toast/ToastProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastProvider.js","names":[],"sources":["../../../src/components/Toast/ToastProvider.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines — the provider is the queue: enqueue, dedupe, auto-\n * dismiss timers, pause on hover and the portal that renders them. Splitting the\n * queue from the renderer would put a timer in one file and the element it dismisses\n * in another.\n */\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Toast.module.css\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\nexport interface ToastOptions {\n    id?: string;\n    title?: string;\n    description?: string;\n    variant?: ToastVariant;\n    /** Auto-dismiss timeout in ms. Pass `0` to keep the toast until dismissed manually. */\n    duration?: number;\n}\n\ninterface ToastEntry extends Required<Omit<ToastOptions, \"id\" | \"title\" | \"description\">> {\n    id: string;\n    title?: string;\n    description?: string;\n}\n\nexport interface ToastApi {\n    show: (options: ToastOptions) => string;\n    dismiss: (id: string) => void;\n    success: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    error: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n    warning: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    info: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n}\n\nconst ToastContext = createContext<ToastApi | null>(null);\n\n/**\n * Access the toast API. Must be used inside a {@link ToastProvider}.\n *\n * @returns Methods to show and dismiss toasts.\n */\nexport function useToast(): ToastApi {\n    const ctx = useContext(ToastContext);\n    if (!ctx) throw new Error(\"useToast must be used inside a <ToastProvider>\");\n    return ctx;\n}\n\nexport type ToastPosition =\n    \"top-right\" | \"top-left\" | \"top-center\" | \"bottom-right\" | \"bottom-left\" | \"bottom-center\";\n\nexport interface ToastProviderProps {\n    children: ReactNode;\n    /** Default auto-dismiss duration (ms). Default 4000. */\n    defaultDuration?: number;\n    /** Stack position on screen. Default `\"top-right\"`. */\n    position?: ToastPosition;\n}\n\n/**\n * Renders a portalled toast container and exposes the imperative {@link useToast} API.\n */\nexport function ToastProvider({\n    children,\n    defaultDuration = 4000,\n    position = \"top-right\",\n}: ToastProviderProps) {\n    const [toasts, setToasts] = useState<ToastEntry[]>([]);\n    const counter = useRef<number>(0);\n\n    const dismiss = useCallback((id: string): void => {\n        setToasts((current) => current.filter((toast) => toast.id !== id));\n    }, []);\n\n    const show = useCallback(\n        (options: ToastOptions): string => {\n            const id = options.id ?? `toast-${++counter.current}`;\n            const entry: ToastEntry = {\n                id,\n                title: options.title,\n                description: options.description,\n                variant: options.variant ?? \"info\",\n                duration: options.duration ?? defaultDuration,\n            };\n            setToasts((current) => [...current, entry]);\n            return id;\n        },\n        [defaultDuration],\n    );\n\n    const api = useMemo<ToastApi>(\n        () => ({\n            show,\n            dismiss,\n            success: (description, options) =>\n                show({ ...options, description, variant: \"success\" }),\n            error: (description, options) => show({ ...options, description, variant: \"error\" }),\n            warning: (description, options) =>\n                show({ ...options, description, variant: \"warning\" }),\n            info: (description, options) => show({ ...options, description, variant: \"info\" }),\n        }),\n        [show, dismiss],\n    );\n\n    return (\n        <ToastContext.Provider value={api}>\n            {children}\n            <ToastContainer toasts={toasts} onDismiss={dismiss} position={position} />\n        </ToastContext.Provider>\n    );\n}\n\ninterface ContainerProps {\n    toasts: ToastEntry[];\n    onDismiss: (id: string) => void;\n    position: ToastPosition;\n}\n\nfunction positionClass(position: ToastPosition): string {\n    switch (position) {\n        case \"top-left\":\n            return styles.positionTopLeft;\n        case \"top-center\":\n            return styles.positionTopCenter;\n        case \"bottom-right\":\n            return styles.positionBottomRight;\n        case \"bottom-left\":\n            return styles.positionBottomLeft;\n        case \"bottom-center\":\n            return styles.positionBottomCenter;\n        case \"top-right\":\n        default:\n            return styles.positionTopRight;\n    }\n}\n\n/**\n * The portalled stack, and the page's live region for toasts.\n *\n * `aria-atomic=\"false\"` matters: with `\"true\"` a screen reader re-reads the\n * **entire** stack on every change, so the third toast of a batch is announced as\n * all three, and dismissing one re-announces the survivors. `\"false\"` announces only\n * the node that was added, which is what the user needs.\n *\n * The stack stays the live region rather than delegating to `useAnnounce`, because\n * routing it through the shared announcer would put the same text in the document\n * twice — once visible, once hidden — and every `getByText(\"Salvo\")` in a consuming\n * app's test suite would start matching two nodes. The announcer is for messages\n * that have no on-screen home; a toast has one.\n */\nfunction ToastContainer({ toasts, onDismiss, position }: ContainerProps) {\n    if (typeof document === \"undefined\") return null;\n    return createPortal(\n        <div\n            className={cn(styles.container, positionClass(position))}\n            aria-live=\"polite\"\n            aria-atomic=\"false\"\n        >\n            {toasts.map((toast) => (\n                <ToastItem key={toast.id} toast={toast} onDismiss={onDismiss} />\n            ))}\n        </div>,\n        document.body,\n    );\n}\n\ninterface ItemProps {\n    toast: ToastEntry;\n    onDismiss: (id: string) => void;\n}\n\n/**\n * One toast.\n *\n * No `role=\"status\"` of its own: it already lives inside the container's live\n * region, and a live region nested in a live region is announced twice by some\n * screen readers.\n */\nfunction ToastItem({ toast, onDismiss }: ItemProps) {\n    useEffect(() => {\n        if (!toast.duration) return;\n        const timer = setTimeout(() => onDismiss(toast.id), toast.duration);\n        return () => clearTimeout(timer);\n    }, [toast.id, toast.duration, onDismiss]);\n\n    return (\n        <div className={cn(styles.toast, styles[toast.variant])}>\n            <div>\n                {toast.title && <p className={styles.title}>{toast.title}</p>}\n                {toast.description && <p className={styles.description}>{toast.description}</p>}\n            </div>\n            <button\n                type=\"button\"\n                className={styles.close}\n                aria-label=\"Fechar notificação\"\n                onClick={() => onDismiss(toast.id)}\n            >\n                <CloseIcon />\n            </button>\n        </div>\n    );\n}\n\nfunction CloseIcon() {\n    return (\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\">\n            <path\n                d=\"M6 6l12 12M6 18L18 6\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n            />\n        </svg>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"ToastProvider.js","names":[],"sources":["../../../src/components/Toast/ToastProvider.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines — the provider is the queue: enqueue, dedupe, auto-\n * dismiss timers, pause on hover and the portal that renders them. Splitting the\n * queue from the renderer would put a timer in one file and the element it dismisses\n * in another.\n */\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Toast.module.css\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\nexport interface ToastOptions {\n    id?: string;\n    title?: string;\n    description?: string;\n    variant?: ToastVariant;\n    /** Auto-dismiss timeout in ms. Pass `0` to keep the toast until dismissed manually. */\n    duration?: number;\n}\n\ninterface ToastEntry extends Required<Omit<ToastOptions, \"id\" | \"title\" | \"description\">> {\n    id: string;\n    title?: string;\n    description?: string;\n}\n\nexport interface ToastApi {\n    show: (options: ToastOptions) => string;\n    dismiss: (id: string) => void;\n    success: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    error: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n    warning: (\n        description: string,\n        options?: Omit<ToastOptions, \"variant\" | \"description\">,\n    ) => string;\n    info: (description: string, options?: Omit<ToastOptions, \"variant\" | \"description\">) => string;\n}\n\nconst ToastContext = createContext<ToastApi | null>(null);\n\n/**\n * Access the toast API. Must be used inside a {@link ToastProvider}.\n *\n * @returns Methods to show and dismiss toasts.\n */\nexport function useToast(): ToastApi {\n    const ctx = useContext(ToastContext);\n    if (!ctx) throw new Error(\"useToast must be used inside a <ToastProvider>\");\n    return ctx;\n}\n\nexport type ToastPosition =\n    \"top-right\" | \"top-left\" | \"top-center\" | \"bottom-right\" | \"bottom-left\" | \"bottom-center\";\n\nexport interface ToastProviderProps {\n    children: ReactNode;\n    /** Default auto-dismiss duration (ms). Default 4000. */\n    defaultDuration?: number;\n    /** Stack position on screen. Default `\"top-right\"`. */\n    position?: ToastPosition;\n}\n\n/**\n * Renders a portalled toast container and exposes the imperative {@link useToast} API.\n */\nexport function ToastProvider({\n    children,\n    defaultDuration = 4000,\n    position = \"top-right\",\n}: ToastProviderProps) {\n    const [toasts, setToasts] = useState<ToastEntry[]>([]);\n    const counter = useRef<number>(0);\n\n    const dismiss = useCallback((id: string): void => {\n        setToasts((current) => current.filter((toast) => toast.id !== id));\n    }, []);\n\n    const show = useCallback(\n        (options: ToastOptions): string => {\n            const id = options.id ?? `toast-${++counter.current}`;\n            const entry: ToastEntry = {\n                id,\n                title: options.title,\n                description: options.description,\n                variant: options.variant ?? \"info\",\n                duration: options.duration ?? defaultDuration,\n            };\n            setToasts((current) => [...current, entry]);\n            return id;\n        },\n        [defaultDuration],\n    );\n\n    const api = useMemo<ToastApi>(\n        () => ({\n            show,\n            dismiss,\n            success: (description, options) =>\n                show({ ...options, description, variant: \"success\" }),\n            error: (description, options) => show({ ...options, description, variant: \"error\" }),\n            warning: (description, options) =>\n                show({ ...options, description, variant: \"warning\" }),\n            info: (description, options) => show({ ...options, description, variant: \"info\" }),\n        }),\n        [show, dismiss],\n    );\n\n    return (\n        <ToastContext.Provider value={api}>\n            {children}\n            <ToastContainer toasts={toasts} onDismiss={dismiss} position={position} />\n        </ToastContext.Provider>\n    );\n}\n\ninterface ContainerProps {\n    toasts: ToastEntry[];\n    onDismiss: (id: string) => void;\n    position: ToastPosition;\n}\n\nfunction positionClass(position: ToastPosition): string {\n    switch (position) {\n        case \"top-left\":\n            return styles.positionTopLeft;\n        case \"top-center\":\n            return styles.positionTopCenter;\n        case \"bottom-right\":\n            return styles.positionBottomRight;\n        case \"bottom-left\":\n            return styles.positionBottomLeft;\n        case \"bottom-center\":\n            return styles.positionBottomCenter;\n        case \"top-right\":\n        default:\n            return styles.positionTopRight;\n    }\n}\n\n/**\n * The portalled stack, and the page's live region for toasts.\n *\n * `aria-atomic=\"false\"` matters: with `\"true\"` a screen reader re-reads the\n * **entire** stack on every change, so the third toast of a batch is announced as\n * all three, and dismissing one re-announces the survivors. `\"false\"` announces only\n * the node that was added, which is what the user needs.\n *\n * The stack stays the live region rather than delegating to `useAnnounce`, because\n * routing it through the shared announcer would put the same text in the document\n * twice — once visible, once hidden — and every `getByText(\"Salvo\")` in a consuming\n * app's test suite would start matching two nodes. The announcer is for messages\n * that have no on-screen home; a toast has one.\n */\nfunction ToastContainer({ toasts, onDismiss, position }: ContainerProps) {\n    if (typeof document === \"undefined\") return null;\n    return createPortal(\n        <div\n            className={cn(styles.container, positionClass(position))}\n            aria-live=\"polite\"\n            aria-atomic=\"false\"\n        >\n            {toasts.map((toast) => (\n                <ToastItem key={toast.id} toast={toast} onDismiss={onDismiss} />\n            ))}\n        </div>,\n        document.body,\n    );\n}\n\ninterface ItemProps {\n    toast: ToastEntry;\n    onDismiss: (id: string) => void;\n}\n\n/**\n * One toast.\n *\n * No `role=\"status\"` of its own: it already lives inside the container's live\n * region, and a live region nested in a live region is announced twice by some\n * screen readers.\n */\nfunction ToastItem({ toast, onDismiss }: ItemProps) {\n    useEffect(() => {\n        if (!toast.duration) return;\n        const timer = setTimeout(() => onDismiss(toast.id), toast.duration);\n        return () => clearTimeout(timer);\n    }, [toast.id, toast.duration, onDismiss]);\n\n    return (\n        <div className={cn(styles.toast, styles[toast.variant])}>\n            <div>\n                {toast.title && <p className={styles.title}>{toast.title}</p>}\n                {toast.description && <p className={styles.description}>{toast.description}</p>}\n            </div>\n            <button\n                type=\"button\"\n                className={styles.close}\n                aria-label=\"Fechar notificação\"\n                onClick={() => onDismiss(toast.id)}\n            >\n                <CloseIcon />\n            </button>\n        </div>\n    );\n}\n\nfunction CloseIcon() {\n    return (\n        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\">\n            <path\n                d=\"M6 6l12 12M6 18L18 6\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n            />\n        </svg>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Toggle/Toggle.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.cjs","names":[],"sources":["../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\nimport type { ButtonHTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Toggle.module.css\";\n\nexport type ToggleSize = \"sm\" | \"md\" | \"lg\";\nexport type ToggleVariant = \"default\" | \"outline\";\n\nexport interface ToggleProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n    /** Controlled pressed state. When provided the component is controlled. */\n    pressed?: boolean;\n    /** Initial pressed state for the uncontrolled variant. Default `false`. */\n    defaultPressed?: boolean;\n    /** Fired with the next pressed state whenever the toggle is activated. */\n    onPressedChange?: (pressed: boolean) => void;\n    /** Visual size. Default `\"md\"`. */\n    size?: ToggleSize;\n    /** Visual style. Default `\"default\"`. */\n    variant?: ToggleVariant;\n}\n\n/**\n * A pressable two-state button — like a checkbox styled as a button.\n *\n * Works controlled (pass `pressed` + `onPressedChange`) or uncontrolled\n * (pass `defaultPressed`). Renders a native `<button type=\"button\">` exposing\n * its state through `aria-pressed`.\n *\n * @param props - {@link ToggleProps}.\n * @returns The toggle button element.\n */\nexport const Toggle = forwardRef<HTMLButtonElement, ToggleProps>(function Toggle(\n    {\n        pressed,\n        defaultPressed = false,\n        onPressedChange,\n        size = \"md\",\n        variant = \"default\",\n        className,\n        disabled,\n        onClick,\n        children,\n        ...props\n    },\n    ref,\n) {\n    const isControlled = pressed !== undefined;\n    const [internalPressed, setInternalPressed] = useState<boolean>(defaultPressed);\n    const isPressed = isControlled ? pressed : internalPressed;\n\n    const handleClick = useCallback(\n        (event: React.MouseEvent<HTMLButtonElement>): void => {\n            onClick?.(event);\n            if (event.defaultPrevented) return;\n            const next = !isPressed;\n            if (!isControlled) setInternalPressed(next);\n            onPressedChange?.(next);\n        },\n        [isPressed, isControlled, onClick, onPressedChange],\n    );\n\n    return (\n        <button\n            ref={ref}\n            type=\"button\"\n            aria-pressed={isPressed}\n            disabled={disabled}\n            data-state={isPressed ? \"on\" : \"off\"}\n            className={cn(\n                styles.toggle,\n                styles[size],\n                styles[variant],\n                isPressed && styles.pressed,\n                className,\n            )}\n            onClick={handleClick}\n            {...props}\n        >\n            {children}\n        </button>\n    );\n});\n"],"mappings":"6HA+BA,IAAa,GAAA,EAAA,EAAA,WAAA,CAAoD,SAC7D,CACI,UACA,iBAAiB,GACjB,kBACA,OAAO,KACP,UAAU,UACV,YACA,WACA,UACA,WACA,GAAG,GAEP,EACF,CACE,IAAM,EAAe,IAAY,IAAA,GAC3B,CAAC,EAAiB,IAAA,EAAA,EAAA,SAAA,CAAwC,CAAc,EACxE,EAAY,EAAe,EAAU,EAErC,GAAA,EAAA,EAAA,YAAA,CACD,GAAqD,CAElD,GADA,IAAU,CAAK,EACX,EAAM,iBAAkB,OAC5B,IAAM,EAAO,CAAC,EACT,GAAc,EAAmB,CAAI,EAC1C,IAAkB,CAAI,CAC1B,EACA,CAAC,EAAW,EAAc,EAAS,CAAe,CACtD,EAEA,OACI,EAAA,EAAA,IAAA,CAAC,SAAD,CACS,MACL,KAAK,SACL,eAAc,EACJ,WACV,aAAY,EAAY,KAAO,MAC/B,UAAW,EAAA,GACP,EAAA,QAAO,OACP,EAAA,QAAO,GACP,EAAA,QAAO,GACP,GAAa,EAAA,QAAO,QACpB,CACJ,EACA,QAAS,EACT,GAAI,EAEH,UACG,CAAA,CAEhB,CAAC"}
+{"version":3,"file":"Toggle.cjs","names":[],"sources":["../../../src/components/Toggle/Toggle.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\nimport type { ButtonHTMLAttributes } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Toggle.module.css\";\n\nexport type ToggleSize = \"sm\" | \"md\" | \"lg\";\nexport type ToggleVariant = \"default\" | \"outline\";\n\nexport interface ToggleProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n    /** Controlled pressed state. When provided the component is controlled. */\n    pressed?: boolean;\n    /** Initial pressed state for the uncontrolled variant. Default `false`. */\n    defaultPressed?: boolean;\n    /** Fired with the next pressed state whenever the toggle is activated. */\n    onPressedChange?: (pressed: boolean) => void;\n    /** Visual size. Default `\"md\"`. */\n    size?: ToggleSize;\n    /** Visual style. Default `\"default\"`. */\n    variant?: ToggleVariant;\n}\n\n/**\n * A pressable two-state button — like a checkbox styled as a button.\n *\n * Works controlled (pass `pressed` + `onPressedChange`) or uncontrolled\n * (pass `defaultPressed`). Renders a native `<button type=\"button\">` exposing\n * its state through `aria-pressed`.\n *\n * @param props - {@link ToggleProps}.\n * @returns The toggle button element.\n */\nexport const Toggle = forwardRef<HTMLButtonElement, ToggleProps>(function Toggle(\n    {\n        pressed,\n        defaultPressed = false,\n        onPressedChange,\n        size = \"md\",\n        variant = \"default\",\n        className,\n        disabled,\n        onClick,\n        children,\n        ...props\n    },\n    ref,\n) {\n    const isControlled = pressed !== undefined;\n    const [internalPressed, setInternalPressed] = useState<boolean>(defaultPressed);\n    const isPressed = isControlled ? pressed : internalPressed;\n\n    const handleClick = useCallback(\n        (event: React.MouseEvent<HTMLButtonElement>): void => {\n            onClick?.(event);\n            if (event.defaultPrevented) return;\n            const next = !isPressed;\n            if (!isControlled) setInternalPressed(next);\n            onPressedChange?.(next);\n        },\n        [isPressed, isControlled, onClick, onPressedChange],\n    );\n\n    return (\n        <button\n            ref={ref}\n            type=\"button\"\n            aria-pressed={isPressed}\n            disabled={disabled}\n            data-state={isPressed ? \"on\" : \"off\"}\n            className={cn(\n                styles.toggle,\n                styles[size],\n                styles[variant],\n                isPressed && styles.pressed,\n                className,\n            )}\n            onClick={handleClick}\n            {...props}\n        >\n            {children}\n        </button>\n    );\n});\n"],"mappings":"6HA+BA,IAAa,GAAA,EAAS,EAAA,WAAA,CAA2C,SAC7D,CACI,UACA,iBAAiB,GACjB,kBACA,OAAO,KACP,UAAU,UACV,YACA,WACA,UACA,WACA,GAAG,GAEP,EACF,CACE,IAAM,EAAe,IAAY,IAAA,GAC3B,CAAC,EAAiB,IAAA,EAAsB,EAAA,SAAA,CAAkB,CAAc,EACxE,EAAY,EAAe,EAAU,EAErC,GAAA,EAAc,EAAA,YAAA,CACf,GAAqD,CAElD,GADA,IAAU,CAAK,EACX,EAAM,iBAAkB,OAC5B,IAAM,EAAO,CAAC,EACT,GAAc,EAAmB,CAAI,EAC1C,IAAkB,CAAI,CAC1B,EACA,CAAC,EAAW,EAAc,EAAS,CAAe,CACtD,EAEA,OACI,EAAA,EAAA,IAAA,CAAC,SAAD,CACS,MACL,KAAK,SACL,eAAc,EACJ,WACV,aAAY,EAAY,KAAO,MAC/B,UAAW,EAAA,GACP,EAAA,QAAO,OACP,EAAA,QAAO,GACP,EAAA,QAAO,GACP,GAAa,EAAA,QAAO,QACpB,CACJ,EACA,QAAS,EACT,GAAI,EAEH,UACG,CAAA,CAEhB,CAAC"}

package/dist/components/ToggleGroup/ToggleGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleGroup.cjs","names":[],"sources":["../../../src/components/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useMemo, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ToggleGroup.module.css\";\n\nexport type ToggleGroupType = \"single\" | \"multiple\";\n\ninterface ToggleGroupContextValue {\n    type: ToggleGroupType;\n    isSelected: (value: string) => boolean;\n    toggle: (value: string) => void;\n}\n\nconst ToggleGroupContext = createContext<ToggleGroupContextValue | null>(null);\n\nfunction useToggleGroupContext(): ToggleGroupContextValue {\n    const ctx = useContext(ToggleGroupContext);\n    if (!ctx) {\n        throw new Error(\"ToggleGroupItem must be used within a ToggleGroup\");\n    }\n    return ctx;\n}\n\nexport interface ToggleGroupProps extends HTMLAttributes<HTMLDivElement> {\n    /** Selection mode. `\"single\"` keeps one value; `\"multiple\"` keeps a set. Default `\"single\"`. */\n    type?: ToggleGroupType;\n    /** Controlled value — `string` for `single`, `string[]` for `multiple`. */\n    value?: string | string[];\n    /** Uncontrolled initial value. */\n    defaultValue?: string | string[];\n    /** Fired with the next value whenever the selection changes. */\n    onValueChange?: (value: string | string[]) => void;\n    children: ReactNode;\n}\n\nfunction normalizeArray(value: string | string[] | undefined): string[] {\n    if (value === undefined) return [];\n    return Array.isArray(value) ? value : [value];\n}\n\n/**\n * A set of {@link ToggleGroupItem}s that share selection state via context.\n *\n * In `single` mode the value is a `string` (empty string when nothing is\n * selected); in `multiple` mode it is a `string[]`. Works controlled (pass\n * `value` + `onValueChange`) or uncontrolled (pass `defaultValue`).\n *\n * @param props - {@link ToggleGroupProps}.\n * @returns A `role=\"group\"` container wrapping the items.\n */\nexport function ToggleGroup({\n    type = \"single\",\n    value,\n    defaultValue,\n    onValueChange,\n    className,\n    children,\n    ...props\n}: ToggleGroupProps) {\n    const isControlled = value !== undefined;\n    const [internalValue, setInternalValue] = useState<string[]>(() =>\n        normalizeArray(defaultValue),\n    );\n    const selected = isControlled ? normalizeArray(value) : internalValue;\n\n    const commit = useCallback(\n        (next: string[]): void => {\n            if (!isControlled) setInternalValue(next);\n            onValueChange?.(type === \"single\" ? (next[0] ?? \"\") : next);\n        },\n        [isControlled, onValueChange, type],\n    );\n\n    const toggle = useCallback(\n        (itemValue: string): void => {\n            const isOn = selected.includes(itemValue);\n            if (type === \"single\") {\n                commit(isOn ? [] : [itemValue]);\n            } else {\n                commit(isOn ? selected.filter((v) => v !== itemValue) : [...selected, itemValue]);\n            }\n        },\n        [selected, type, commit],\n    );\n\n    const ctx = useMemo<ToggleGroupContextValue>(\n        () => ({\n            type,\n            isSelected: (itemValue: string) => selected.includes(itemValue),\n            toggle,\n        }),\n        [type, selected, toggle],\n    );\n\n    return (\n        <ToggleGroupContext.Provider value={ctx}>\n            <div role=\"group\" className={cn(styles.group, className)} {...props}>\n                {children}\n            </div>\n        </ToggleGroupContext.Provider>\n    );\n}\n\nexport interface ToggleGroupItemProps extends Omit<HTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n    /** Stable value identifying this item within the group. */\n    value: string;\n    /** Disables the item. */\n    disabled?: boolean;\n    children: ReactNode;\n}\n\n/**\n * A single selectable item inside a {@link ToggleGroup}. Reads and updates the\n * group's shared state through context.\n *\n * Icon-only items need an explicit `aria-label` (forwarded to the button):\n * an SVG child gives screen readers nothing to announce.\n *\n * @param props - {@link ToggleGroupItemProps}.\n * @returns A `role=\"button\"` element exposing its state via `aria-pressed`.\n */\nexport function ToggleGroupItem({\n    value,\n    disabled,\n    className,\n    children,\n    ...props\n}: ToggleGroupItemProps) {\n    const { isSelected, toggle } = useToggleGroupContext();\n    const selected = isSelected(value);\n\n    return (\n        <button\n            type=\"button\"\n            role=\"button\"\n            aria-pressed={selected}\n            disabled={disabled}\n            data-state={selected ? \"on\" : \"off\"}\n            className={cn(styles.item, selected && styles.selected, className)}\n            onClick={() => toggle(value)}\n            {...props}\n        >\n            {children}\n        </button>\n    );\n}\n"],"mappings":"kIAaA,IAAM,GAAA,EAAA,EAAA,cAAA,CAAmE,IAAI,EAE7E,SAAS,GAAiD,CACtD,IAAM,GAAA,EAAA,EAAA,WAAA,CAAiB,CAAkB,EACzC,GAAI,CAAC,EACD,MAAU,MAAM,mDAAmD,EAEvE,OAAO,CACX,CAcA,SAAS,EAAe,EAAgD,CAEpE,OADI,IAAU,IAAA,GAAkB,CAAC,EAC1B,MAAM,QAAQ,CAAK,EAAI,EAAQ,CAAC,CAAK,CAChD,CAYA,SAAgB,EAAY,CACxB,OAAO,SACP,QACA,eACA,gBACA,YACA,WACA,GAAG,GACc,CACjB,IAAM,EAAe,IAAU,IAAA,GACzB,CAAC,EAAe,IAAA,EAAA,EAAA,SAAA,KAClB,EAAe,CAAY,CAC/B,EACM,EAAW,EAAe,EAAe,CAAK,EAAI,EAElD,GAAA,EAAA,EAAA,YAAA,CACD,GAAyB,CACjB,GAAc,EAAiB,CAAI,EACxC,IAAgB,IAAS,SAAY,EAAK,IAAM,GAAM,CAAI,CAC9D,EACA,CAAC,EAAc,EAAe,CAAI,CACtC,EAEM,GAAA,EAAA,EAAA,YAAA,CACD,GAA4B,CACzB,IAAM,EAAO,EAAS,SAAS,CAAS,EAEpC,EADA,IAAS,SACF,EAAO,CAAC,EAAI,CAAC,CAAS,EAEtB,EAAO,EAAS,OAAQ,GAAM,IAAM,CAAS,EAAI,CAAC,GAAG,EAAU,CAAS,CAAC,CAExF,EACA,CAAC,EAAU,EAAM,CAAM,CAC3B,EAEM,GAAA,EAAA,EAAA,QAAA,MACK,CACH,OACA,WAAa,GAAsB,EAAS,SAAS,CAAS,EAC9D,QACJ,GACA,CAAC,EAAM,EAAU,CAAM,CAC3B,EAEA,OACI,EAAA,EAAA,IAAA,CAAC,EAAmB,SAApB,CAA6B,MAAO,YAChC,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,KAAK,QAAQ,UAAW,EAAA,GAAG,EAAA,QAAO,MAAO,CAAS,EAAG,GAAI,EACzD,UACA,CAAA,CACoB,CAAA,CAErC,CAoBA,SAAgB,EAAgB,CAC5B,QACA,WACA,YACA,WACA,GAAG,GACkB,CACrB,GAAM,CAAE,aAAY,UAAW,EAAsB,EAC/C,EAAW,EAAW,CAAK,EAEjC,OACI,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,KAAK,SACL,eAAc,EACJ,WACV,aAAY,EAAW,KAAO,MAC9B,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,GAAY,EAAA,QAAO,SAAU,CAAS,EACjE,YAAe,EAAO,CAAK,EAC3B,GAAI,EAEH,UACG,CAAA,CAEhB"}
+{"version":3,"file":"ToggleGroup.cjs","names":[],"sources":["../../../src/components/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useMemo, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ToggleGroup.module.css\";\n\nexport type ToggleGroupType = \"single\" | \"multiple\";\n\ninterface ToggleGroupContextValue {\n    type: ToggleGroupType;\n    isSelected: (value: string) => boolean;\n    toggle: (value: string) => void;\n}\n\nconst ToggleGroupContext = createContext<ToggleGroupContextValue | null>(null);\n\nfunction useToggleGroupContext(): ToggleGroupContextValue {\n    const ctx = useContext(ToggleGroupContext);\n    if (!ctx) {\n        throw new Error(\"ToggleGroupItem must be used within a ToggleGroup\");\n    }\n    return ctx;\n}\n\nexport interface ToggleGroupProps extends HTMLAttributes<HTMLDivElement> {\n    /** Selection mode. `\"single\"` keeps one value; `\"multiple\"` keeps a set. Default `\"single\"`. */\n    type?: ToggleGroupType;\n    /** Controlled value — `string` for `single`, `string[]` for `multiple`. */\n    value?: string | string[];\n    /** Uncontrolled initial value. */\n    defaultValue?: string | string[];\n    /** Fired with the next value whenever the selection changes. */\n    onValueChange?: (value: string | string[]) => void;\n    children: ReactNode;\n}\n\nfunction normalizeArray(value: string | string[] | undefined): string[] {\n    if (value === undefined) return [];\n    return Array.isArray(value) ? value : [value];\n}\n\n/**\n * A set of {@link ToggleGroupItem}s that share selection state via context.\n *\n * In `single` mode the value is a `string` (empty string when nothing is\n * selected); in `multiple` mode it is a `string[]`. Works controlled (pass\n * `value` + `onValueChange`) or uncontrolled (pass `defaultValue`).\n *\n * @param props - {@link ToggleGroupProps}.\n * @returns A `role=\"group\"` container wrapping the items.\n */\nexport function ToggleGroup({\n    type = \"single\",\n    value,\n    defaultValue,\n    onValueChange,\n    className,\n    children,\n    ...props\n}: ToggleGroupProps) {\n    const isControlled = value !== undefined;\n    const [internalValue, setInternalValue] = useState<string[]>(() =>\n        normalizeArray(defaultValue),\n    );\n    const selected = isControlled ? normalizeArray(value) : internalValue;\n\n    const commit = useCallback(\n        (next: string[]): void => {\n            if (!isControlled) setInternalValue(next);\n            onValueChange?.(type === \"single\" ? (next[0] ?? \"\") : next);\n        },\n        [isControlled, onValueChange, type],\n    );\n\n    const toggle = useCallback(\n        (itemValue: string): void => {\n            const isOn = selected.includes(itemValue);\n            if (type === \"single\") {\n                commit(isOn ? [] : [itemValue]);\n            } else {\n                commit(isOn ? selected.filter((v) => v !== itemValue) : [...selected, itemValue]);\n            }\n        },\n        [selected, type, commit],\n    );\n\n    const ctx = useMemo<ToggleGroupContextValue>(\n        () => ({\n            type,\n            isSelected: (itemValue: string) => selected.includes(itemValue),\n            toggle,\n        }),\n        [type, selected, toggle],\n    );\n\n    return (\n        <ToggleGroupContext.Provider value={ctx}>\n            <div role=\"group\" className={cn(styles.group, className)} {...props}>\n                {children}\n            </div>\n        </ToggleGroupContext.Provider>\n    );\n}\n\nexport interface ToggleGroupItemProps extends Omit<HTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n    /** Stable value identifying this item within the group. */\n    value: string;\n    /** Disables the item. */\n    disabled?: boolean;\n    children: ReactNode;\n}\n\n/**\n * A single selectable item inside a {@link ToggleGroup}. Reads and updates the\n * group's shared state through context.\n *\n * Icon-only items need an explicit `aria-label` (forwarded to the button):\n * an SVG child gives screen readers nothing to announce.\n *\n * @param props - {@link ToggleGroupItemProps}.\n * @returns A `role=\"button\"` element exposing its state via `aria-pressed`.\n */\nexport function ToggleGroupItem({\n    value,\n    disabled,\n    className,\n    children,\n    ...props\n}: ToggleGroupItemProps) {\n    const { isSelected, toggle } = useToggleGroupContext();\n    const selected = isSelected(value);\n\n    return (\n        <button\n            type=\"button\"\n            role=\"button\"\n            aria-pressed={selected}\n            disabled={disabled}\n            data-state={selected ? \"on\" : \"off\"}\n            className={cn(styles.item, selected && styles.selected, className)}\n            onClick={() => toggle(value)}\n            {...props}\n        >\n            {children}\n        </button>\n    );\n}\n"],"mappings":"kIAaA,IAAM,GAAA,EAAqB,EAAA,cAAA,CAA8C,IAAI,EAE7E,SAAS,GAAiD,CACtD,IAAM,GAAA,EAAM,EAAA,WAAA,CAAW,CAAkB,EACzC,GAAI,CAAC,EACD,MAAU,MAAM,mDAAmD,EAEvE,OAAO,CACX,CAcA,SAAS,EAAe,EAAgD,CAEpE,OADI,IAAU,IAAA,GAAkB,CAAC,EAC1B,MAAM,QAAQ,CAAK,EAAI,EAAQ,CAAC,CAAK,CAChD,CAYA,SAAgB,EAAY,CACxB,OAAO,SACP,QACA,eACA,gBACA,YACA,WACA,GAAG,GACc,CACjB,IAAM,EAAe,IAAU,IAAA,GACzB,CAAC,EAAe,IAAA,EAAoB,EAAA,SAAA,KACtC,EAAe,CAAY,CAC/B,EACM,EAAW,EAAe,EAAe,CAAK,EAAI,EAElD,GAAA,EAAS,EAAA,YAAA,CACV,GAAyB,CACjB,GAAc,EAAiB,CAAI,EACxC,IAAgB,IAAS,SAAY,EAAK,IAAM,GAAM,CAAI,CAC9D,EACA,CAAC,EAAc,EAAe,CAAI,CACtC,EAEM,GAAA,EAAS,EAAA,YAAA,CACV,GAA4B,CACzB,IAAM,EAAO,EAAS,SAAS,CAAS,EAEpC,EADA,IAAS,SACF,EAAO,CAAC,EAAI,CAAC,CAAS,EAEtB,EAAO,EAAS,OAAQ,GAAM,IAAM,CAAS,EAAI,CAAC,GAAG,EAAU,CAAS,CAAC,CAExF,EACA,CAAC,EAAU,EAAM,CAAM,CAC3B,EAEM,GAAA,EAAM,EAAA,QAAA,MACD,CACH,OACA,WAAa,GAAsB,EAAS,SAAS,CAAS,EAC9D,QACJ,GACA,CAAC,EAAM,EAAU,CAAM,CAC3B,EAEA,OACI,EAAA,EAAA,IAAA,CAAC,EAAmB,SAApB,CAA6B,MAAO,EAChC,UAAA,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,KAAK,QAAQ,UAAW,EAAA,GAAG,EAAA,QAAO,MAAO,CAAS,EAAG,GAAI,EACzD,UACA,CAAA,CACoB,CAAA,CAErC,CAoBA,SAAgB,EAAgB,CAC5B,QACA,WACA,YACA,WACA,GAAG,GACkB,CACrB,GAAM,CAAE,aAAY,UAAW,EAAsB,EAC/C,EAAW,EAAW,CAAK,EAEjC,OACI,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,KAAK,SACL,eAAc,EACJ,WACV,aAAY,EAAW,KAAO,MAC9B,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,GAAY,EAAA,QAAO,SAAU,CAAS,EACjE,YAAe,EAAO,CAAK,EAC3B,GAAI,EAEH,UACG,CAAA,CAEhB"}

package/dist/components/ToggleGroup/ToggleGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleGroup.js","names":[],"sources":["../../../src/components/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useMemo, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ToggleGroup.module.css\";\n\nexport type ToggleGroupType = \"single\" | \"multiple\";\n\ninterface ToggleGroupContextValue {\n    type: ToggleGroupType;\n    isSelected: (value: string) => boolean;\n    toggle: (value: string) => void;\n}\n\nconst ToggleGroupContext = createContext<ToggleGroupContextValue | null>(null);\n\nfunction useToggleGroupContext(): ToggleGroupContextValue {\n    const ctx = useContext(ToggleGroupContext);\n    if (!ctx) {\n        throw new Error(\"ToggleGroupItem must be used within a ToggleGroup\");\n    }\n    return ctx;\n}\n\nexport interface ToggleGroupProps extends HTMLAttributes<HTMLDivElement> {\n    /** Selection mode. `\"single\"` keeps one value; `\"multiple\"` keeps a set. Default `\"single\"`. */\n    type?: ToggleGroupType;\n    /** Controlled value — `string` for `single`, `string[]` for `multiple`. */\n    value?: string | string[];\n    /** Uncontrolled initial value. */\n    defaultValue?: string | string[];\n    /** Fired with the next value whenever the selection changes. */\n    onValueChange?: (value: string | string[]) => void;\n    children: ReactNode;\n}\n\nfunction normalizeArray(value: string | string[] | undefined): string[] {\n    if (value === undefined) return [];\n    return Array.isArray(value) ? value : [value];\n}\n\n/**\n * A set of {@link ToggleGroupItem}s that share selection state via context.\n *\n * In `single` mode the value is a `string` (empty string when nothing is\n * selected); in `multiple` mode it is a `string[]`. Works controlled (pass\n * `value` + `onValueChange`) or uncontrolled (pass `defaultValue`).\n *\n * @param props - {@link ToggleGroupProps}.\n * @returns A `role=\"group\"` container wrapping the items.\n */\nexport function ToggleGroup({\n    type = \"single\",\n    value,\n    defaultValue,\n    onValueChange,\n    className,\n    children,\n    ...props\n}: ToggleGroupProps) {\n    const isControlled = value !== undefined;\n    const [internalValue, setInternalValue] = useState<string[]>(() =>\n        normalizeArray(defaultValue),\n    );\n    const selected = isControlled ? normalizeArray(value) : internalValue;\n\n    const commit = useCallback(\n        (next: string[]): void => {\n            if (!isControlled) setInternalValue(next);\n            onValueChange?.(type === \"single\" ? (next[0] ?? \"\") : next);\n        },\n        [isControlled, onValueChange, type],\n    );\n\n    const toggle = useCallback(\n        (itemValue: string): void => {\n            const isOn = selected.includes(itemValue);\n            if (type === \"single\") {\n                commit(isOn ? [] : [itemValue]);\n            } else {\n                commit(isOn ? selected.filter((v) => v !== itemValue) : [...selected, itemValue]);\n            }\n        },\n        [selected, type, commit],\n    );\n\n    const ctx = useMemo<ToggleGroupContextValue>(\n        () => ({\n            type,\n            isSelected: (itemValue: string) => selected.includes(itemValue),\n            toggle,\n        }),\n        [type, selected, toggle],\n    );\n\n    return (\n        <ToggleGroupContext.Provider value={ctx}>\n            <div role=\"group\" className={cn(styles.group, className)} {...props}>\n                {children}\n            </div>\n        </ToggleGroupContext.Provider>\n    );\n}\n\nexport interface ToggleGroupItemProps extends Omit<HTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n    /** Stable value identifying this item within the group. */\n    value: string;\n    /** Disables the item. */\n    disabled?: boolean;\n    children: ReactNode;\n}\n\n/**\n * A single selectable item inside a {@link ToggleGroup}. Reads and updates the\n * group's shared state through context.\n *\n * Icon-only items need an explicit `aria-label` (forwarded to the button):\n * an SVG child gives screen readers nothing to announce.\n *\n * @param props - {@link ToggleGroupItemProps}.\n * @returns A `role=\"button\"` element exposing its state via `aria-pressed`.\n */\nexport function ToggleGroupItem({\n    value,\n    disabled,\n    className,\n    children,\n    ...props\n}: ToggleGroupItemProps) {\n    const { isSelected, toggle } = useToggleGroupContext();\n    const selected = isSelected(value);\n\n    return (\n        <button\n            type=\"button\"\n            role=\"button\"\n            aria-pressed={selected}\n            disabled={disabled}\n            data-state={selected ? \"on\" : \"off\"}\n            className={cn(styles.item, selected && styles.selected, className)}\n            onClick={() => toggle(value)}\n            {...props}\n        >\n            {children}\n        </button>\n    );\n}\n"],"mappings":";;;;;AAaA,IAAM,IAAqB,EAA8C,IAAI;AAE7E,SAAS,IAAiD;CACtD,IAAM,IAAM,EAAW,CAAkB;CACzC,IAAI,CAAC,GACD,MAAU,MAAM,mDAAmD;CAEvE,OAAO;AACX;AAcA,SAAS,EAAe,GAAgD;CAEpE,OADI,MAAU,KAAA,IAAkB,CAAC,IAC1B,MAAM,QAAQ,CAAK,IAAI,IAAQ,CAAC,CAAK;AAChD;AAYA,SAAgB,EAAY,EACxB,UAAO,UACP,UACA,iBACA,kBACA,cACA,aACA,GAAG,KACc;CACjB,IAAM,IAAe,MAAU,KAAA,GACzB,CAAC,GAAe,KAAoB,QACtC,EAAe,CAAY,CAC/B,GACM,IAAW,IAAe,EAAe,CAAK,IAAI,GAElD,IAAS,GACV,MAAyB;EAEtB,AADK,KAAc,EAAiB,CAAI,GACxC,IAAgB,MAAS,WAAY,EAAK,MAAM,KAAM,CAAI;CAC9D,GACA;EAAC;EAAc;EAAe;CAAI,CACtC,GAEM,IAAS,GACV,MAA4B;EACzB,IAAM,IAAO,EAAS,SAAS,CAAS;EACxC,AACI,EADA,MAAS,WACF,IAAO,CAAC,IAAI,CAAC,CAAS,IAEtB,IAAO,EAAS,QAAQ,MAAM,MAAM,CAAS,IAAI,CAAC,GAAG,GAAU,CAAS,CAAC;CAExF,GACA;EAAC;EAAU;EAAM;CAAM,CAC3B,GAEM,IAAM,SACD;EACH;EACA,aAAa,MAAsB,EAAS,SAAS,CAAS;EAC9D;CACJ,IACA;EAAC;EAAM;EAAU;CAAM,CAC3B;CAEA,OACI,kBAAC,EAAmB,UAApB;EAA6B,OAAO;YAChC,kBAAC,OAAD;GAAK,MAAK;GAAQ,WAAW,EAAG,EAAO,OAAO,CAAS;GAAG,GAAI;GACzD;EACA,CAAA;CACoB,CAAA;AAErC;AAoBA,SAAgB,EAAgB,EAC5B,UACA,aACA,cACA,aACA,GAAG,KACkB;CACrB,IAAM,EAAE,eAAY,cAAW,EAAsB,GAC/C,IAAW,EAAW,CAAK;CAEjC,OACI,kBAAC,UAAD;EACI,MAAK;EACL,MAAK;EACL,gBAAc;EACJ;EACV,cAAY,IAAW,OAAO;EAC9B,WAAW,EAAG,EAAO,MAAM,KAAY,EAAO,UAAU,CAAS;EACjE,eAAe,EAAO,CAAK;EAC3B,GAAI;EAEH;CACG,CAAA;AAEhB"}
+{"version":3,"file":"ToggleGroup.js","names":[],"sources":["../../../src/components/ToggleGroup/ToggleGroup.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useMemo, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./ToggleGroup.module.css\";\n\nexport type ToggleGroupType = \"single\" | \"multiple\";\n\ninterface ToggleGroupContextValue {\n    type: ToggleGroupType;\n    isSelected: (value: string) => boolean;\n    toggle: (value: string) => void;\n}\n\nconst ToggleGroupContext = createContext<ToggleGroupContextValue | null>(null);\n\nfunction useToggleGroupContext(): ToggleGroupContextValue {\n    const ctx = useContext(ToggleGroupContext);\n    if (!ctx) {\n        throw new Error(\"ToggleGroupItem must be used within a ToggleGroup\");\n    }\n    return ctx;\n}\n\nexport interface ToggleGroupProps extends HTMLAttributes<HTMLDivElement> {\n    /** Selection mode. `\"single\"` keeps one value; `\"multiple\"` keeps a set. Default `\"single\"`. */\n    type?: ToggleGroupType;\n    /** Controlled value — `string` for `single`, `string[]` for `multiple`. */\n    value?: string | string[];\n    /** Uncontrolled initial value. */\n    defaultValue?: string | string[];\n    /** Fired with the next value whenever the selection changes. */\n    onValueChange?: (value: string | string[]) => void;\n    children: ReactNode;\n}\n\nfunction normalizeArray(value: string | string[] | undefined): string[] {\n    if (value === undefined) return [];\n    return Array.isArray(value) ? value : [value];\n}\n\n/**\n * A set of {@link ToggleGroupItem}s that share selection state via context.\n *\n * In `single` mode the value is a `string` (empty string when nothing is\n * selected); in `multiple` mode it is a `string[]`. Works controlled (pass\n * `value` + `onValueChange`) or uncontrolled (pass `defaultValue`).\n *\n * @param props - {@link ToggleGroupProps}.\n * @returns A `role=\"group\"` container wrapping the items.\n */\nexport function ToggleGroup({\n    type = \"single\",\n    value,\n    defaultValue,\n    onValueChange,\n    className,\n    children,\n    ...props\n}: ToggleGroupProps) {\n    const isControlled = value !== undefined;\n    const [internalValue, setInternalValue] = useState<string[]>(() =>\n        normalizeArray(defaultValue),\n    );\n    const selected = isControlled ? normalizeArray(value) : internalValue;\n\n    const commit = useCallback(\n        (next: string[]): void => {\n            if (!isControlled) setInternalValue(next);\n            onValueChange?.(type === \"single\" ? (next[0] ?? \"\") : next);\n        },\n        [isControlled, onValueChange, type],\n    );\n\n    const toggle = useCallback(\n        (itemValue: string): void => {\n            const isOn = selected.includes(itemValue);\n            if (type === \"single\") {\n                commit(isOn ? [] : [itemValue]);\n            } else {\n                commit(isOn ? selected.filter((v) => v !== itemValue) : [...selected, itemValue]);\n            }\n        },\n        [selected, type, commit],\n    );\n\n    const ctx = useMemo<ToggleGroupContextValue>(\n        () => ({\n            type,\n            isSelected: (itemValue: string) => selected.includes(itemValue),\n            toggle,\n        }),\n        [type, selected, toggle],\n    );\n\n    return (\n        <ToggleGroupContext.Provider value={ctx}>\n            <div role=\"group\" className={cn(styles.group, className)} {...props}>\n                {children}\n            </div>\n        </ToggleGroupContext.Provider>\n    );\n}\n\nexport interface ToggleGroupItemProps extends Omit<HTMLAttributes<HTMLButtonElement>, \"onClick\"> {\n    /** Stable value identifying this item within the group. */\n    value: string;\n    /** Disables the item. */\n    disabled?: boolean;\n    children: ReactNode;\n}\n\n/**\n * A single selectable item inside a {@link ToggleGroup}. Reads and updates the\n * group's shared state through context.\n *\n * Icon-only items need an explicit `aria-label` (forwarded to the button):\n * an SVG child gives screen readers nothing to announce.\n *\n * @param props - {@link ToggleGroupItemProps}.\n * @returns A `role=\"button\"` element exposing its state via `aria-pressed`.\n */\nexport function ToggleGroupItem({\n    value,\n    disabled,\n    className,\n    children,\n    ...props\n}: ToggleGroupItemProps) {\n    const { isSelected, toggle } = useToggleGroupContext();\n    const selected = isSelected(value);\n\n    return (\n        <button\n            type=\"button\"\n            role=\"button\"\n            aria-pressed={selected}\n            disabled={disabled}\n            data-state={selected ? \"on\" : \"off\"}\n            className={cn(styles.item, selected && styles.selected, className)}\n            onClick={() => toggle(value)}\n            {...props}\n        >\n            {children}\n        </button>\n    );\n}\n"],"mappings":";;;;;AAaA,IAAM,IAAqB,EAA8C,IAAI;AAE7E,SAAS,IAAiD;CACtD,IAAM,IAAM,EAAW,CAAkB;CACzC,IAAI,CAAC,GACD,MAAU,MAAM,mDAAmD;CAEvE,OAAO;AACX;AAcA,SAAS,EAAe,GAAgD;CAEpE,OADI,MAAU,KAAA,IAAkB,CAAC,IAC1B,MAAM,QAAQ,CAAK,IAAI,IAAQ,CAAC,CAAK;AAChD;AAYA,SAAgB,EAAY,EACxB,UAAO,UACP,UACA,iBACA,kBACA,cACA,aACA,GAAG,KACc;CACjB,IAAM,IAAe,MAAU,KAAA,GACzB,CAAC,GAAe,KAAoB,QACtC,EAAe,CAAY,CAC/B,GACM,IAAW,IAAe,EAAe,CAAK,IAAI,GAElD,IAAS,GACV,MAAyB;EAEtB,AADK,KAAc,EAAiB,CAAI,GACxC,IAAgB,MAAS,WAAY,EAAK,MAAM,KAAM,CAAI;CAC9D,GACA;EAAC;EAAc;EAAe;CAAI,CACtC,GAEM,IAAS,GACV,MAA4B;EACzB,IAAM,IAAO,EAAS,SAAS,CAAS;EACxC,AACI,EADA,MAAS,WACF,IAAO,CAAC,IAAI,CAAC,CAAS,IAEtB,IAAO,EAAS,QAAQ,MAAM,MAAM,CAAS,IAAI,CAAC,GAAG,GAAU,CAAS,CAAC;CAExF,GACA;EAAC;EAAU;EAAM;CAAM,CAC3B,GAEM,IAAM,SACD;EACH;EACA,aAAa,MAAsB,EAAS,SAAS,CAAS;EAC9D;CACJ,IACA;EAAC;EAAM;EAAU;CAAM,CAC3B;CAEA,OACI,kBAAC,EAAmB,UAApB;EAA6B,OAAO;EAChC,UAAA,kBAAC,OAAD;GAAK,MAAK;GAAQ,WAAW,EAAG,EAAO,OAAO,CAAS;GAAG,GAAI;GACzD;EACA,CAAA;CACoB,CAAA;AAErC;AAoBA,SAAgB,EAAgB,EAC5B,UACA,aACA,cACA,aACA,GAAG,KACkB;CACrB,IAAM,EAAE,eAAY,cAAW,EAAsB,GAC/C,IAAW,EAAW,CAAK;CAEjC,OACI,kBAAC,UAAD;EACI,MAAK;EACL,MAAK;EACL,gBAAc;EACJ;EACV,cAAY,IAAW,OAAO;EAC9B,WAAW,EAAG,EAAO,MAAM,KAAY,EAAO,UAAU,CAAS;EACjE,eAAe,EAAO,CAAK;EAC3B,GAAI;EAEH;CACG,CAAA;AAEhB"}

package/dist/components/Tooltip/Tooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.cjs","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable react-hooks/refs -- the handlers below read the timer ref, and they only\n   run on user events (hover/focus), never during render */\nimport { cloneElement, useEffect, useId, useRef, useState } from \"react\";\nimport type { ReactElement, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Tooltip.module.css\";\n\nexport type TooltipPlacement = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport interface TooltipProps {\n    /** Tooltip content. Plain text recommended; rich content also works. */\n    content: ReactNode;\n    /** Placement relative to the trigger. Default: `\"top\"`. */\n    placement?: TooltipPlacement;\n    /** Single React element to attach hover/focus listeners to. */\n    children: ReactElement;\n    /** Disable the tooltip without changing the trigger. */\n    disabled?: boolean;\n    /** Delay (ms) before showing the tooltip. Default: 150. */\n    openDelay?: number;\n}\n\n/**\n * Lightweight tooltip. Shows on hover and on focus (keyboard-friendly). Wraps\n * a single child element via `cloneElement`, so the trigger keeps its own ref\n * and props.\n */\nexport function Tooltip({\n    content,\n    placement = \"top\",\n    children,\n    disabled = false,\n    openDelay = 150,\n}: TooltipProps) {\n    const [open, setOpen] = useState<boolean>(false);\n    const tooltipId = useId();\n    /**\n     * Handle of the pending open timer.\n     *\n     * A ref, not a `let` in the component body: that binding is recreated on every\n     * render, so any re-render between `show` and `hide` (a parent update, a state\n     * change elsewhere) dropped the handle and `clearTimeout` silently cancelled\n     * nothing — the tooltip then opened after the pointer had already left.\n     */\n    const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    function clearTimer(): void {\n        if (timerRef.current !== null) {\n            clearTimeout(timerRef.current);\n            timerRef.current = null;\n        }\n    }\n\n    function show(): void {\n        if (disabled) return;\n        clearTimer();\n        timerRef.current = setTimeout(() => setOpen(true), openDelay);\n    }\n\n    function hide(): void {\n        clearTimer();\n        setOpen(false);\n    }\n\n    useEffect(() => {\n        return () => {\n            clearTimer();\n        };\n    }, []);\n\n    const trigger = cloneElement(children, {\n        onMouseEnter: show,\n        onMouseLeave: hide,\n        onFocus: show,\n        onBlur: hide,\n        \"aria-describedby\": open ? tooltipId : undefined,\n    } as Record<string, unknown>);\n\n    return (\n        <span className={styles.trigger}>\n            {trigger}\n            {open && (\n                <span\n                    id={tooltipId}\n                    role=\"tooltip\"\n                    className={cn(styles.bubble, styles[placement])}\n                >\n                    {content}\n                </span>\n            )}\n        </span>\n    );\n}\n"],"mappings":"8HA2BA,SAAgB,EAAQ,CACpB,UACA,YAAY,MACZ,WACA,WAAW,GACX,YAAY,KACC,CACb,GAAM,CAAC,EAAM,IAAA,EAAA,EAAA,SAAA,CAA6B,EAAK,EACzC,GAAA,EAAA,EAAA,MAAA,CAAkB,EASlB,GAAA,EAAA,EAAA,OAAA,CAAwD,IAAI,EAElE,SAAS,GAAmB,CACpB,EAAS,UAAY,OACrB,aAAa,EAAS,OAAO,EAC7B,EAAS,QAAU,KAE3B,CAEA,SAAS,GAAa,CACd,IACJ,EAAW,EACX,EAAS,QAAU,eAAiB,EAAQ,EAAI,EAAG,CAAS,EAChE,CAEA,SAAS,GAAa,CAClB,EAAW,EACX,EAAQ,EAAK,CACjB,EAEA,EAAA,EAAA,UAAA,SACiB,CACT,EAAW,CACf,EACD,CAAC,CAAC,EAEL,IAAM,GAAA,EAAA,EAAA,aAAA,CAAuB,EAAU,CACnC,aAAc,EACd,aAAc,EACd,QAAS,EACT,OAAQ,EACR,mBAAoB,EAAO,EAAY,IAAA,EAC3C,CAA4B,EAE5B,OACI,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,iBAAxB,CACK,EACA,IACG,EAAA,EAAA,IAAA,CAAC,OAAD,CACI,GAAI,EACJ,KAAK,UACL,UAAW,EAAA,GAAG,EAAA,QAAO,OAAQ,EAAA,QAAO,EAAU,WAE7C,CACC,CAAA,CAER,GAEd"}
+{"version":3,"file":"Tooltip.cjs","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable react-hooks/refs -- the handlers below read the timer ref, and they only\n   run on user events (hover/focus), never during render */\nimport { cloneElement, useEffect, useId, useRef, useState } from \"react\";\nimport type { ReactElement, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Tooltip.module.css\";\n\nexport type TooltipPlacement = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport interface TooltipProps {\n    /** Tooltip content. Plain text recommended; rich content also works. */\n    content: ReactNode;\n    /** Placement relative to the trigger. Default: `\"top\"`. */\n    placement?: TooltipPlacement;\n    /** Single React element to attach hover/focus listeners to. */\n    children: ReactElement;\n    /** Disable the tooltip without changing the trigger. */\n    disabled?: boolean;\n    /** Delay (ms) before showing the tooltip. Default: 150. */\n    openDelay?: number;\n}\n\n/**\n * Lightweight tooltip. Shows on hover and on focus (keyboard-friendly). Wraps\n * a single child element via `cloneElement`, so the trigger keeps its own ref\n * and props.\n */\nexport function Tooltip({\n    content,\n    placement = \"top\",\n    children,\n    disabled = false,\n    openDelay = 150,\n}: TooltipProps) {\n    const [open, setOpen] = useState<boolean>(false);\n    const tooltipId = useId();\n    /**\n     * Handle of the pending open timer.\n     *\n     * A ref, not a `let` in the component body: that binding is recreated on every\n     * render, so any re-render between `show` and `hide` (a parent update, a state\n     * change elsewhere) dropped the handle and `clearTimeout` silently cancelled\n     * nothing — the tooltip then opened after the pointer had already left.\n     */\n    const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    function clearTimer(): void {\n        if (timerRef.current !== null) {\n            clearTimeout(timerRef.current);\n            timerRef.current = null;\n        }\n    }\n\n    function show(): void {\n        if (disabled) return;\n        clearTimer();\n        timerRef.current = setTimeout(() => setOpen(true), openDelay);\n    }\n\n    function hide(): void {\n        clearTimer();\n        setOpen(false);\n    }\n\n    useEffect(() => {\n        return () => {\n            clearTimer();\n        };\n    }, []);\n\n    const trigger = cloneElement(children, {\n        onMouseEnter: show,\n        onMouseLeave: hide,\n        onFocus: show,\n        onBlur: hide,\n        \"aria-describedby\": open ? tooltipId : undefined,\n    } as Record<string, unknown>);\n\n    return (\n        <span className={styles.trigger}>\n            {trigger}\n            {open && (\n                <span\n                    id={tooltipId}\n                    role=\"tooltip\"\n                    className={cn(styles.bubble, styles[placement])}\n                >\n                    {content}\n                </span>\n            )}\n        </span>\n    );\n}\n"],"mappings":"8HA2BA,SAAgB,EAAQ,CACpB,UACA,YAAY,MACZ,WACA,WAAW,GACX,YAAY,KACC,CACb,GAAM,CAAC,EAAM,IAAA,EAAW,EAAA,SAAA,CAAkB,EAAK,EACzC,GAAA,EAAY,EAAA,MAAA,CAAM,EASlB,GAAA,EAAW,EAAA,OAAA,CAA6C,IAAI,EAElE,SAAS,GAAmB,CACpB,EAAS,UAAY,OACrB,aAAa,EAAS,OAAO,EAC7B,EAAS,QAAU,KAE3B,CAEA,SAAS,GAAa,CACd,IACJ,EAAW,EACX,EAAS,QAAU,eAAiB,EAAQ,EAAI,EAAG,CAAS,EAChE,CAEA,SAAS,GAAa,CAClB,EAAW,EACX,EAAQ,EAAK,CACjB,EAEA,EAAA,EAAA,UAAA,SACiB,CACT,EAAW,CACf,EACD,CAAC,CAAC,EAEL,IAAM,GAAA,EAAU,EAAA,aAAA,CAAa,EAAU,CACnC,aAAc,EACd,aAAc,EACd,QAAS,EACT,OAAQ,EACR,mBAAoB,EAAO,EAAY,IAAA,EAC3C,CAA4B,EAE5B,OACI,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,QAAxB,SAAA,CACK,EACA,IACG,EAAA,EAAA,IAAA,CAAC,OAAD,CACI,GAAI,EACJ,KAAK,UACL,UAAW,EAAA,GAAG,EAAA,QAAO,OAAQ,EAAA,QAAO,EAAU,EAE7C,SAAA,CACC,CAAA,CAER,GAEd"}

package/dist/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable react-hooks/refs -- the handlers below read the timer ref, and they only\n   run on user events (hover/focus), never during render */\nimport { cloneElement, useEffect, useId, useRef, useState } from \"react\";\nimport type { ReactElement, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Tooltip.module.css\";\n\nexport type TooltipPlacement = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport interface TooltipProps {\n    /** Tooltip content. Plain text recommended; rich content also works. */\n    content: ReactNode;\n    /** Placement relative to the trigger. Default: `\"top\"`. */\n    placement?: TooltipPlacement;\n    /** Single React element to attach hover/focus listeners to. */\n    children: ReactElement;\n    /** Disable the tooltip without changing the trigger. */\n    disabled?: boolean;\n    /** Delay (ms) before showing the tooltip. Default: 150. */\n    openDelay?: number;\n}\n\n/**\n * Lightweight tooltip. Shows on hover and on focus (keyboard-friendly). Wraps\n * a single child element via `cloneElement`, so the trigger keeps its own ref\n * and props.\n */\nexport function Tooltip({\n    content,\n    placement = \"top\",\n    children,\n    disabled = false,\n    openDelay = 150,\n}: TooltipProps) {\n    const [open, setOpen] = useState<boolean>(false);\n    const tooltipId = useId();\n    /**\n     * Handle of the pending open timer.\n     *\n     * A ref, not a `let` in the component body: that binding is recreated on every\n     * render, so any re-render between `show` and `hide` (a parent update, a state\n     * change elsewhere) dropped the handle and `clearTimeout` silently cancelled\n     * nothing — the tooltip then opened after the pointer had already left.\n     */\n    const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    function clearTimer(): void {\n        if (timerRef.current !== null) {\n            clearTimeout(timerRef.current);\n            timerRef.current = null;\n        }\n    }\n\n    function show(): void {\n        if (disabled) return;\n        clearTimer();\n        timerRef.current = setTimeout(() => setOpen(true), openDelay);\n    }\n\n    function hide(): void {\n        clearTimer();\n        setOpen(false);\n    }\n\n    useEffect(() => {\n        return () => {\n            clearTimer();\n        };\n    }, []);\n\n    const trigger = cloneElement(children, {\n        onMouseEnter: show,\n        onMouseLeave: hide,\n        onFocus: show,\n        onBlur: hide,\n        \"aria-describedby\": open ? tooltipId : undefined,\n    } as Record<string, unknown>);\n\n    return (\n        <span className={styles.trigger}>\n            {trigger}\n            {open && (\n                <span\n                    id={tooltipId}\n                    role=\"tooltip\"\n                    className={cn(styles.bubble, styles[placement])}\n                >\n                    {content}\n                </span>\n            )}\n        </span>\n    );\n}\n"],"mappings":";;;;;AA2BA,SAAgB,EAAQ,EACpB,YACA,eAAY,OACZ,aACA,cAAW,IACX,eAAY,OACC;CACb,IAAM,CAAC,GAAM,KAAW,EAAkB,EAAK,GACzC,IAAY,EAAM,GASlB,IAAW,EAA6C,IAAI;CAElE,SAAS,IAAmB;EACxB,AAAI,EAAS,YAAY,SACrB,aAAa,EAAS,OAAO,GAC7B,EAAS,UAAU;CAE3B;CAEA,SAAS,IAAa;EACd,MACJ,EAAW,GACX,EAAS,UAAU,iBAAiB,EAAQ,EAAI,GAAG,CAAS;CAChE;CAEA,SAAS,IAAa;EAElB,AADA,EAAW,GACX,EAAQ,EAAK;CACjB;CAEA,cACiB;EACT,EAAW;CACf,GACD,CAAC,CAAC;CAEL,IAAM,IAAU,EAAa,GAAU;EACnC,cAAc;EACd,cAAc;EACd,SAAS;EACT,QAAQ;EACR,oBAAoB,IAAO,IAAY,KAAA;CAC3C,CAA4B;CAE5B,OACI,kBAAC,QAAD;EAAM,WAAW,EAAO;YAAxB,CACK,GACA,KACG,kBAAC,QAAD;GACI,IAAI;GACJ,MAAK;GACL,WAAW,EAAG,EAAO,QAAQ,EAAO,EAAU;aAE7C;EACC,CAAA,CAER;;AAEd"}
+{"version":3,"file":"Tooltip.js","names":[],"sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable react-hooks/refs -- the handlers below read the timer ref, and they only\n   run on user events (hover/focus), never during render */\nimport { cloneElement, useEffect, useId, useRef, useState } from \"react\";\nimport type { ReactElement, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Tooltip.module.css\";\n\nexport type TooltipPlacement = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport interface TooltipProps {\n    /** Tooltip content. Plain text recommended; rich content also works. */\n    content: ReactNode;\n    /** Placement relative to the trigger. Default: `\"top\"`. */\n    placement?: TooltipPlacement;\n    /** Single React element to attach hover/focus listeners to. */\n    children: ReactElement;\n    /** Disable the tooltip without changing the trigger. */\n    disabled?: boolean;\n    /** Delay (ms) before showing the tooltip. Default: 150. */\n    openDelay?: number;\n}\n\n/**\n * Lightweight tooltip. Shows on hover and on focus (keyboard-friendly). Wraps\n * a single child element via `cloneElement`, so the trigger keeps its own ref\n * and props.\n */\nexport function Tooltip({\n    content,\n    placement = \"top\",\n    children,\n    disabled = false,\n    openDelay = 150,\n}: TooltipProps) {\n    const [open, setOpen] = useState<boolean>(false);\n    const tooltipId = useId();\n    /**\n     * Handle of the pending open timer.\n     *\n     * A ref, not a `let` in the component body: that binding is recreated on every\n     * render, so any re-render between `show` and `hide` (a parent update, a state\n     * change elsewhere) dropped the handle and `clearTimeout` silently cancelled\n     * nothing — the tooltip then opened after the pointer had already left.\n     */\n    const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n    function clearTimer(): void {\n        if (timerRef.current !== null) {\n            clearTimeout(timerRef.current);\n            timerRef.current = null;\n        }\n    }\n\n    function show(): void {\n        if (disabled) return;\n        clearTimer();\n        timerRef.current = setTimeout(() => setOpen(true), openDelay);\n    }\n\n    function hide(): void {\n        clearTimer();\n        setOpen(false);\n    }\n\n    useEffect(() => {\n        return () => {\n            clearTimer();\n        };\n    }, []);\n\n    const trigger = cloneElement(children, {\n        onMouseEnter: show,\n        onMouseLeave: hide,\n        onFocus: show,\n        onBlur: hide,\n        \"aria-describedby\": open ? tooltipId : undefined,\n    } as Record<string, unknown>);\n\n    return (\n        <span className={styles.trigger}>\n            {trigger}\n            {open && (\n                <span\n                    id={tooltipId}\n                    role=\"tooltip\"\n                    className={cn(styles.bubble, styles[placement])}\n                >\n                    {content}\n                </span>\n            )}\n        </span>\n    );\n}\n"],"mappings":";;;;;AA2BA,SAAgB,EAAQ,EACpB,YACA,eAAY,OACZ,aACA,cAAW,IACX,eAAY,OACC;CACb,IAAM,CAAC,GAAM,KAAW,EAAkB,EAAK,GACzC,IAAY,EAAM,GASlB,IAAW,EAA6C,IAAI;CAElE,SAAS,IAAmB;EACxB,AAAI,EAAS,YAAY,SACrB,aAAa,EAAS,OAAO,GAC7B,EAAS,UAAU;CAE3B;CAEA,SAAS,IAAa;EACd,MACJ,EAAW,GACX,EAAS,UAAU,iBAAiB,EAAQ,EAAI,GAAG,CAAS;CAChE;CAEA,SAAS,IAAa;EAElB,AADA,EAAW,GACX,EAAQ,EAAK;CACjB;CAEA,cACiB;EACT,EAAW;CACf,GACD,CAAC,CAAC;CAEL,IAAM,IAAU,EAAa,GAAU;EACnC,cAAc;EACd,cAAc;EACd,SAAS;EACT,QAAQ;EACR,oBAAoB,IAAO,IAAY,KAAA;CAC3C,CAA4B;CAE5B,OACI,kBAAC,QAAD;EAAM,WAAW,EAAO;EAAxB,UAAA,CACK,GACA,KACG,kBAAC,QAAD;GACI,IAAI;GACJ,MAAK;GACL,WAAW,EAAG,EAAO,QAAQ,EAAO,EAAU;GAE7C,UAAA;EACC,CAAA,CAER;;AAEd"}

package/dist/components/Tour/Tour.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tour.cjs","names":[],"sources":["../../../src/components/Tour/Tour.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — a product tour is a\n * controlled sequence (steps, index, onIndexChange, open, onClose, onFinish) drawn\n * over someone else's DOM (spotlightPadding, locale, className). The body measures\n * the target element, positions the spotlight and the card against it, and re-\n * measures on scroll and resize — one geometry, three triggers.\n */\nimport {\n    useCallback,\n    useEffect,\n    useId,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type KeyboardEvent,\n    type ReactNode,\n} from \"react\";\n\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport { cn } from \"@/utils/cn\";\n\nimport { backdropRects, placeCard, type TourPlacement, type TourRect } from \"./tour-position\";\nimport styles from \"./Tour.module.css\";\n\n/** One stop of the tour. */\nexport interface TourStep {\n    /**\n     * CSS selector of the element to point at.\n     *\n     * A selector rather than a ref, so a tour can be declared as data — in a config\n     * file, from the backend, next to the copy — without every screen having to\n     * thread refs up to whoever renders the tour.\n     */\n    target?: string;\n    /** Heading of the card. */\n    title?: ReactNode;\n    /** The explanation. */\n    body: ReactNode;\n    /** Preferred side. Default `\"bottom\"`, flipped when it does not fit. */\n    placement?: TourPlacement;\n}\n\n/** Labels, per locale. */\ninterface TourStrings {\n    next: string;\n    back: string;\n    finish: string;\n    skip: string;\n    close: string;\n    progress: (current: number, total: number) => string;\n}\n\nconst PT_BR: TourStrings = {\n    next: \"Próximo\",\n    back: \"Voltar\",\n    finish: \"Concluir\",\n    skip: \"Pular\",\n    close: \"Fechar tour\",\n    progress: (current, total) => `Passo ${current} de ${total}`,\n};\n\nconst EN: TourStrings = {\n    next: \"Next\",\n    back: \"Back\",\n    finish: \"Done\",\n    skip: \"Skip\",\n    close: \"Close tour\",\n    progress: (current, total) => `Step ${current} of ${total}`,\n};\n\nexport interface TourProps {\n    /** The stops, in order. */\n    steps: readonly TourStep[];\n    /** Whether the tour is showing. Controlled. */\n    open: boolean;\n    /** Closed by `Esc`, by the close button or by \"skip\". */\n    onClose: () => void;\n    /** Called after the last step is confirmed. `onClose` follows it. */\n    onFinish?: () => void;\n    /** Current step index, when the app wants to drive it. */\n    index?: number;\n    /** Step changed — required only when `index` is given. */\n    onIndexChange?: (index: number) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Space kept clear around the highlighted element, in px. Default 4. */\n    spotlightPadding?: number;\n    /** Extra class on the card. */\n    className?: string;\n}\n\n/**\n * A guided tour: dim the page, highlight one element at a time, explain it.\n *\n * The highlighted element stays **clickable** while everything else is blocked,\n * because the useful kind of coachmark says \"press this\" and lets you press it. That\n * is why the backdrop is four rectangles around the target rather than one overlay\n * with a `box-shadow` hole — a shadow is not hit-testable, so a hole made that way\n * would not block anything.\n *\n * Whether a user has seen the tour is the app's business: this component takes\n * `open` and emits `onClose`/`onFinish`. Persisting a flag in `localStorage` is one\n * line in the app and a wrong default here.\n *\n * @example\n * const [open, setOpen] = useState(!storage.get(\"tour-v1\"));\n *\n * <Tour\n *     open={open}\n *     steps={[\n *         { target: \"#novo-pedido\", title: \"Comece aqui\", body: \"Todo pedido nasce deste botão.\" },\n *         { target: \"[data-tour='filtros']\", body: \"E filtre por período aqui.\" },\n *     ]}\n *     onClose={() => setOpen(false)}\n *     onFinish={() => storage.set(\"tour-v1\", true)}\n * />\n */\nexport function Tour({\n    steps,\n    open,\n    onClose,\n    onFinish,\n    index,\n    onIndexChange,\n    locale = \"pt-BR\",\n    spotlightPadding = 4,\n    className,\n}: TourProps) {\n    const strings = locale === \"en\" ? EN : PT_BR;\n    const [internal, setInternal] = useState(0);\n    const current = Math.min(index ?? internal, Math.max(0, steps.length - 1));\n    const step = steps[current];\n\n    const card = useRef<HTMLDivElement | null>(null);\n    const [target, setTarget] = useState<TourRect | null>(null);\n    const [position, setPosition] = useState<{\n        placement: TourPlacement;\n        top: number;\n        left: number;\n    }>({ placement: \"center\", top: 0, left: 0 });\n    const [viewport, setViewport] = useState({ width: 0, height: 0 });\n    const titleId = useId();\n    const bodyId = useId();\n\n    useFocusTrap(card, open);\n\n    const goTo = useCallback(\n        (next: number) => {\n            if (index === undefined) setInternal(next);\n            onIndexChange?.(next);\n        },\n        [index, onIndexChange],\n    );\n\n    /** Reset to the first step whenever the tour opens again. */\n    useEffect(() => {\n        if (open && index === undefined) setInternal(0);\n    }, [open, index]);\n\n    /**\n     * Find the step's element, bring it into view, and measure everything.\n     *\n     * The scroll happens before measuring, and the measurement is deferred to the\n     * next frame: reading a rect in the same tick as `scrollIntoView` gives the\n     * position the element had *before* the scroll, which lands the card over the\n     * wrong part of the page.\n     */\n    const measure = useCallback(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        const rect = element?.getBoundingClientRect() ?? null;\n        setTarget(\n            rect\n                ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                : null,\n        );\n\n        const size = {\n            width: card.current?.offsetWidth ?? 320,\n            height: card.current?.offsetHeight ?? 160,\n        };\n        const view = { width: window.innerWidth, height: window.innerHeight };\n        setViewport(view);\n        setPosition(\n            placeCard({\n                target: rect\n                    ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                    : null,\n                card: size,\n                viewport: view,\n                preferred: step.placement,\n            }),\n        );\n    }, [open, step]);\n\n    useLayoutEffect(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        element?.scrollIntoView({ block: \"center\", inline: \"nearest\", behavior: \"smooth\" });\n        const frame = requestAnimationFrame(measure);\n        return () => cancelAnimationFrame(frame);\n    }, [open, step, measure]);\n\n    useEffect(() => {\n        if (!open) return;\n        window.addEventListener(\"resize\", measure);\n        window.addEventListener(\"scroll\", measure, true);\n        return () => {\n            window.removeEventListener(\"resize\", measure);\n            window.removeEventListener(\"scroll\", measure, true);\n        };\n    }, [open, measure]);\n\n    useEffect(() => {\n        if (open) card.current?.focus();\n    }, [open, current]);\n\n    if (!open || !step) return null;\n\n    const last = current === steps.length - 1;\n\n    const finish = (): void => {\n        onFinish?.();\n        onClose();\n    };\n\n    /**\n     * Arrow keys walk the tour and `Esc` leaves it.\n     *\n     * `Esc` is handled here rather than on `window` so a tour opened over a modal\n     * does not close both: the innermost handler that sees the key wins, and the\n     * card has focus.\n     */\n    const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>): void => {\n        if (event.key === \"Escape\") {\n            event.stopPropagation();\n            onClose();\n            return;\n        }\n        if (event.key === \"ArrowRight\" && !last) {\n            event.preventDefault();\n            goTo(current + 1);\n        }\n        if (event.key === \"ArrowLeft\" && current > 0) {\n            event.preventDefault();\n            goTo(current - 1);\n        }\n    };\n\n    return (\n        <div className={styles.root} data-placement={position.placement}>\n            {backdropRects(target, viewport, spotlightPadding).map((rect, i) => (\n                <div\n                    key={i}\n                    className={styles.backdrop}\n                    style={{\n                        top: rect.top,\n                        left: rect.left,\n                        width: rect.width,\n                        height: rect.height,\n                    }}\n                    onClick={onClose}\n                />\n            ))}\n\n            {target && (\n                <div\n                    className={styles.spotlight}\n                    style={{\n                        top: target.top - spotlightPadding,\n                        left: target.left - spotlightPadding,\n                        width: target.width + spotlightPadding * 2,\n                        height: target.height + spotlightPadding * 2,\n                    }}\n                />\n            )}\n\n            <div\n                ref={card}\n                className={cn(styles.card, className)}\n                style={{ top: position.top, left: position.left }}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-labelledby={step.title ? titleId : undefined}\n                aria-describedby={bodyId}\n                tabIndex={-1}\n                onKeyDown={handleKeyDown}\n            >\n                <div className={styles.header}>\n                    <span className={styles.progress}>\n                        {strings.progress(current + 1, steps.length)}\n                    </span>\n                    <button\n                        type=\"button\"\n                        className={styles.close}\n                        aria-label={strings.close}\n                        onClick={onClose}\n                    >\n                        ×\n                    </button>\n                </div>\n\n                {step.title && (\n                    <h2 className={styles.title} id={titleId}>\n                        {step.title}\n                    </h2>\n                )}\n                <div className={styles.body} id={bodyId}>\n                    {step.body}\n                </div>\n\n                <div className={styles.footer}>\n                    {!last && (\n                        <button type=\"button\" className={styles.skip} onClick={onClose}>\n                            {strings.skip}\n                        </button>\n                    )}\n                    <div className={styles.actions}>\n                        {current > 0 && (\n                            <button\n                                type=\"button\"\n                                className={styles.secondary}\n                                onClick={() => goTo(current - 1)}\n                            >\n                                {strings.back}\n                            </button>\n                        )}\n                        <button\n                            type=\"button\"\n                            className={styles.primary}\n                            onClick={() => (last ? finish() : goTo(current + 1))}\n                        >\n                            {last ? strings.finish : strings.next}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n}\n"],"mappings":"wMAoDA,IAAM,EAAqB,CACvB,KAAM,UACN,KAAM,SACN,OAAQ,WACR,KAAM,QACN,MAAO,cACP,UAAW,EAAS,IAAU,SAAS,EAAQ,MAAM,GACzD,EAEM,EAAkB,CACpB,KAAM,OACN,KAAM,OACN,OAAQ,OACR,KAAM,OACN,MAAO,aACP,UAAW,EAAS,IAAU,QAAQ,EAAQ,MAAM,GACxD,EAiDA,SAAgB,EAAK,CACjB,QACA,OACA,UACA,WACA,QACA,gBACA,SAAS,QACT,mBAAmB,EACnB,aACU,CACV,IAAM,EAAU,IAAW,KAAO,EAAK,EACjC,CAAC,EAAU,IAAA,EAAA,EAAA,SAAA,CAAwB,CAAC,EACpC,EAAU,KAAK,IAAI,GAAS,EAAU,KAAK,IAAI,EAAG,EAAM,OAAS,CAAC,CAAC,EACnE,EAAO,EAAM,GAEb,GAAA,EAAA,EAAA,OAAA,CAAqC,IAAI,EACzC,CAAC,EAAQ,IAAA,EAAA,EAAA,SAAA,CAAuC,IAAI,EACpD,CAAC,EAAU,IAAA,EAAA,EAAA,SAAA,CAId,CAAE,UAAW,SAAU,IAAK,EAAG,KAAM,CAAE,CAAC,EACrC,CAAC,EAAU,IAAA,EAAA,EAAA,SAAA,CAAwB,CAAE,MAAO,EAAG,OAAQ,CAAE,CAAC,EAC1D,GAAA,EAAA,EAAA,MAAA,CAAgB,EAChB,GAAA,EAAA,EAAA,MAAA,CAAe,EAErB,EAAA,aAAa,EAAM,CAAI,EAEvB,IAAM,GAAA,EAAA,EAAA,YAAA,CACD,GAAiB,CACV,IAAU,IAAA,IAAW,EAAY,CAAI,EACzC,IAAgB,CAAI,CACxB,EACA,CAAC,EAAO,CAAa,CACzB,GAGA,EAAA,EAAA,UAAA,KAAgB,CACR,GAAQ,IAAU,IAAA,IAAW,EAAY,CAAC,CAClD,EAAG,CAAC,EAAM,CAAK,CAAC,EAUhB,IAAM,GAAA,EAAA,EAAA,YAAA,KAA4B,CAC9B,GAAI,CAAC,GAAQ,CAAC,EAAM,OAEpB,IAAM,GADU,EAAK,OAAS,SAAS,cAA2B,EAAK,MAAM,EAAI,KAAA,EAC3D,sBAAsB,GAAK,KACjD,EACI,EACM,CAAE,IAAK,EAAK,IAAK,KAAM,EAAK,KAAM,MAAO,EAAK,MAAO,OAAQ,EAAK,MAAO,EACzE,IACV,EAEA,IAAM,EAAO,CACT,MAAO,EAAK,SAAS,aAAe,IACpC,OAAQ,EAAK,SAAS,cAAgB,GAC1C,EACM,EAAO,CAAE,MAAO,OAAO,WAAY,OAAQ,OAAO,WAAY,EACpE,EAAY,CAAI,EAChB,EACI,EAAA,UAAU,CACN,OAAQ,EACF,CAAE,IAAK,EAAK,IAAK,KAAM,EAAK,KAAM,MAAO,EAAK,MAAO,OAAQ,EAAK,MAAO,EACzE,KACN,KAAM,EACN,SAAU,EACV,UAAW,EAAK,SACpB,CAAC,CACL,CACJ,EAAG,CAAC,EAAM,CAAI,CAAC,EAwBf,IAtBA,EAAA,EAAA,gBAAA,KAAsB,CAClB,GAAI,CAAC,GAAQ,CAAC,EAAM,QACJ,EAAK,OAAS,SAAS,cAA2B,EAAK,MAAM,EAAI,KAAA,EACxE,eAAe,CAAE,MAAO,SAAU,OAAQ,UAAW,SAAU,QAAS,CAAC,EAClF,IAAM,EAAQ,sBAAsB,CAAO,EAC3C,UAAa,qBAAqB,CAAK,CAC3C,EAAG,CAAC,EAAM,EAAM,CAAO,CAAC,GAExB,EAAA,EAAA,UAAA,KAAgB,CACP,KAGL,OAFA,OAAO,iBAAiB,SAAU,CAAO,EACzC,OAAO,iBAAiB,SAAU,EAAS,EAAI,MAClC,CACT,OAAO,oBAAoB,SAAU,CAAO,EAC5C,OAAO,oBAAoB,SAAU,EAAS,EAAI,CACtD,CACJ,EAAG,CAAC,EAAM,CAAO,CAAC,GAElB,EAAA,EAAA,UAAA,KAAgB,CACR,GAAM,EAAK,SAAS,MAAM,CAClC,EAAG,CAAC,EAAM,CAAO,CAAC,EAEd,CAAC,GAAQ,CAAC,EAAM,OAAO,KAE3B,IAAM,EAAO,IAAY,EAAM,OAAS,EAElC,MAAqB,CACvB,IAAW,EACX,EAAQ,CACZ,EAyBA,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAM,iBAAgB,EAAS,mBAAtD,CACK,EAAA,cAAc,EAAQ,EAAU,CAAgB,CAAC,CAAC,KAAK,EAAM,KAC1D,EAAA,EAAA,IAAA,CAAC,MAAD,CAEI,UAAW,EAAA,QAAO,SAClB,MAAO,CACH,IAAK,EAAK,IACV,KAAM,EAAK,KACX,MAAO,EAAK,MACZ,OAAQ,EAAK,MACjB,EACA,QAAS,CACZ,EATQ,CASR,CACJ,EAEA,IACG,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,QAAO,UAClB,MAAO,CACH,IAAK,EAAO,IAAM,EAClB,KAAM,EAAO,KAAO,EACpB,MAAO,EAAO,MAAQ,EAAmB,EACzC,OAAQ,EAAO,OAAS,EAAmB,CAC/C,CACH,CAAA,GAGL,EAAA,EAAA,KAAA,CAAC,MAAD,CACI,IAAK,EACL,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,CAAS,EACpC,MAAO,CAAE,IAAK,EAAS,IAAK,KAAM,EAAS,IAAK,EAChD,KAAK,SACL,aAAW,OACX,kBAAiB,EAAK,MAAQ,EAAU,IAAA,GACxC,mBAAkB,EAClB,SAAU,GACV,UArDW,GAA+C,CAClE,GAAI,EAAM,MAAQ,SAAU,CACxB,EAAM,gBAAgB,EACtB,EAAQ,EACR,MACJ,CACI,EAAM,MAAQ,cAAgB,CAAC,IAC/B,EAAM,eAAe,EACrB,EAAK,EAAU,CAAC,GAEhB,EAAM,MAAQ,aAAe,EAAU,IACvC,EAAM,eAAe,EACrB,EAAK,EAAU,CAAC,EAExB,WA8BQ,EAWI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAvB,EACI,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,kBACnB,EAAQ,SAAS,EAAU,EAAG,EAAM,MAAM,CACzC,CAAA,GACN,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,MAClB,aAAY,EAAQ,MACpB,QAAS,WACZ,GAEO,CAAA,CACP,IAEJ,EAAK,QACF,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAW,EAAA,QAAO,MAAO,GAAI,WAC5B,EAAK,KACN,CAAA,GAER,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAM,GAAI,WAC5B,EAAK,IACL,CAAA,GAEL,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,gBAAvB,CACK,CAAC,IACE,EAAA,EAAA,IAAA,CAAC,SAAD,CAAQ,KAAK,SAAS,UAAW,EAAA,QAAO,KAAM,QAAS,WAClD,EAAQ,IACL,CAAA,GAEZ,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,iBAAvB,CACK,EAAU,IACP,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,UAClB,YAAe,EAAK,EAAU,CAAC,WAE9B,EAAQ,IACL,CAAA,GAEZ,EAAA,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,QAAO,QAClB,YAAgB,EAAO,EAAO,EAAI,EAAK,EAAU,CAAC,WAEjD,EAAO,EAAQ,OAAS,EAAQ,IAC7B,CAAA,CACP,GACJ,GACJ,GACJ,GAEb"}
+{"version":3,"file":"Tour.cjs","names":[],"sources":["../../../src/components/Tour/Tour.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — a product tour is a\n * controlled sequence (steps, index, onIndexChange, open, onClose, onFinish) drawn\n * over someone else's DOM (spotlightPadding, locale, className). The body measures\n * the target element, positions the spotlight and the card against it, and re-\n * measures on scroll and resize — one geometry, three triggers.\n */\nimport {\n    useCallback,\n    useEffect,\n    useId,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type KeyboardEvent,\n    type ReactNode,\n} from \"react\";\n\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport { cn } from \"@/utils/cn\";\n\nimport { backdropRects, placeCard, type TourPlacement, type TourRect } from \"./tour-position\";\nimport styles from \"./Tour.module.css\";\n\n/** One stop of the tour. */\nexport interface TourStep {\n    /**\n     * CSS selector of the element to point at.\n     *\n     * A selector rather than a ref, so a tour can be declared as data — in a config\n     * file, from the backend, next to the copy — without every screen having to\n     * thread refs up to whoever renders the tour.\n     */\n    target?: string;\n    /** Heading of the card. */\n    title?: ReactNode;\n    /** The explanation. */\n    body: ReactNode;\n    /** Preferred side. Default `\"bottom\"`, flipped when it does not fit. */\n    placement?: TourPlacement;\n}\n\n/** Labels, per locale. */\ninterface TourStrings {\n    next: string;\n    back: string;\n    finish: string;\n    skip: string;\n    close: string;\n    progress: (current: number, total: number) => string;\n}\n\nconst PT_BR: TourStrings = {\n    next: \"Próximo\",\n    back: \"Voltar\",\n    finish: \"Concluir\",\n    skip: \"Pular\",\n    close: \"Fechar tour\",\n    progress: (current, total) => `Passo ${current} de ${total}`,\n};\n\nconst EN: TourStrings = {\n    next: \"Next\",\n    back: \"Back\",\n    finish: \"Done\",\n    skip: \"Skip\",\n    close: \"Close tour\",\n    progress: (current, total) => `Step ${current} of ${total}`,\n};\n\nexport interface TourProps {\n    /** The stops, in order. */\n    steps: readonly TourStep[];\n    /** Whether the tour is showing. Controlled. */\n    open: boolean;\n    /** Closed by `Esc`, by the close button or by \"skip\". */\n    onClose: () => void;\n    /** Called after the last step is confirmed. `onClose` follows it. */\n    onFinish?: () => void;\n    /** Current step index, when the app wants to drive it. */\n    index?: number;\n    /** Step changed — required only when `index` is given. */\n    onIndexChange?: (index: number) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Space kept clear around the highlighted element, in px. Default 4. */\n    spotlightPadding?: number;\n    /** Extra class on the card. */\n    className?: string;\n}\n\n/**\n * A guided tour: dim the page, highlight one element at a time, explain it.\n *\n * The highlighted element stays **clickable** while everything else is blocked,\n * because the useful kind of coachmark says \"press this\" and lets you press it. That\n * is why the backdrop is four rectangles around the target rather than one overlay\n * with a `box-shadow` hole — a shadow is not hit-testable, so a hole made that way\n * would not block anything.\n *\n * Whether a user has seen the tour is the app's business: this component takes\n * `open` and emits `onClose`/`onFinish`. Persisting a flag in `localStorage` is one\n * line in the app and a wrong default here.\n *\n * @example\n * const [open, setOpen] = useState(!storage.get(\"tour-v1\"));\n *\n * <Tour\n *     open={open}\n *     steps={[\n *         { target: \"#novo-pedido\", title: \"Comece aqui\", body: \"Todo pedido nasce deste botão.\" },\n *         { target: \"[data-tour='filtros']\", body: \"E filtre por período aqui.\" },\n *     ]}\n *     onClose={() => setOpen(false)}\n *     onFinish={() => storage.set(\"tour-v1\", true)}\n * />\n */\nexport function Tour({\n    steps,\n    open,\n    onClose,\n    onFinish,\n    index,\n    onIndexChange,\n    locale = \"pt-BR\",\n    spotlightPadding = 4,\n    className,\n}: TourProps) {\n    const strings = locale === \"en\" ? EN : PT_BR;\n    const [internal, setInternal] = useState(0);\n    const current = Math.min(index ?? internal, Math.max(0, steps.length - 1));\n    const step = steps[current];\n\n    const card = useRef<HTMLDivElement | null>(null);\n    const [target, setTarget] = useState<TourRect | null>(null);\n    const [position, setPosition] = useState<{\n        placement: TourPlacement;\n        top: number;\n        left: number;\n    }>({ placement: \"center\", top: 0, left: 0 });\n    const [viewport, setViewport] = useState({ width: 0, height: 0 });\n    const titleId = useId();\n    const bodyId = useId();\n\n    useFocusTrap(card, open);\n\n    const goTo = useCallback(\n        (next: number) => {\n            if (index === undefined) setInternal(next);\n            onIndexChange?.(next);\n        },\n        [index, onIndexChange],\n    );\n\n    /** Reset to the first step whenever the tour opens again. */\n    useEffect(() => {\n        if (open && index === undefined) setInternal(0);\n    }, [open, index]);\n\n    /**\n     * Find the step's element, bring it into view, and measure everything.\n     *\n     * The scroll happens before measuring, and the measurement is deferred to the\n     * next frame: reading a rect in the same tick as `scrollIntoView` gives the\n     * position the element had *before* the scroll, which lands the card over the\n     * wrong part of the page.\n     */\n    const measure = useCallback(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        const rect = element?.getBoundingClientRect() ?? null;\n        setTarget(\n            rect\n                ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                : null,\n        );\n\n        const size = {\n            width: card.current?.offsetWidth ?? 320,\n            height: card.current?.offsetHeight ?? 160,\n        };\n        const view = { width: window.innerWidth, height: window.innerHeight };\n        setViewport(view);\n        setPosition(\n            placeCard({\n                target: rect\n                    ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                    : null,\n                card: size,\n                viewport: view,\n                preferred: step.placement,\n            }),\n        );\n    }, [open, step]);\n\n    useLayoutEffect(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        element?.scrollIntoView({ block: \"center\", inline: \"nearest\", behavior: \"smooth\" });\n        const frame = requestAnimationFrame(measure);\n        return () => cancelAnimationFrame(frame);\n    }, [open, step, measure]);\n\n    useEffect(() => {\n        if (!open) return;\n        window.addEventListener(\"resize\", measure);\n        window.addEventListener(\"scroll\", measure, true);\n        return () => {\n            window.removeEventListener(\"resize\", measure);\n            window.removeEventListener(\"scroll\", measure, true);\n        };\n    }, [open, measure]);\n\n    useEffect(() => {\n        if (open) card.current?.focus();\n    }, [open, current]);\n\n    if (!open || !step) return null;\n\n    const last = current === steps.length - 1;\n\n    const finish = (): void => {\n        onFinish?.();\n        onClose();\n    };\n\n    /**\n     * Arrow keys walk the tour and `Esc` leaves it.\n     *\n     * `Esc` is handled here rather than on `window` so a tour opened over a modal\n     * does not close both: the innermost handler that sees the key wins, and the\n     * card has focus.\n     */\n    const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>): void => {\n        if (event.key === \"Escape\") {\n            event.stopPropagation();\n            onClose();\n            return;\n        }\n        if (event.key === \"ArrowRight\" && !last) {\n            event.preventDefault();\n            goTo(current + 1);\n        }\n        if (event.key === \"ArrowLeft\" && current > 0) {\n            event.preventDefault();\n            goTo(current - 1);\n        }\n    };\n\n    return (\n        <div className={styles.root} data-placement={position.placement}>\n            {backdropRects(target, viewport, spotlightPadding).map((rect, i) => (\n                <div\n                    key={i}\n                    className={styles.backdrop}\n                    style={{\n                        top: rect.top,\n                        left: rect.left,\n                        width: rect.width,\n                        height: rect.height,\n                    }}\n                    onClick={onClose}\n                />\n            ))}\n\n            {target && (\n                <div\n                    className={styles.spotlight}\n                    style={{\n                        top: target.top - spotlightPadding,\n                        left: target.left - spotlightPadding,\n                        width: target.width + spotlightPadding * 2,\n                        height: target.height + spotlightPadding * 2,\n                    }}\n                />\n            )}\n\n            <div\n                ref={card}\n                className={cn(styles.card, className)}\n                style={{ top: position.top, left: position.left }}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-labelledby={step.title ? titleId : undefined}\n                aria-describedby={bodyId}\n                tabIndex={-1}\n                onKeyDown={handleKeyDown}\n            >\n                <div className={styles.header}>\n                    <span className={styles.progress}>\n                        {strings.progress(current + 1, steps.length)}\n                    </span>\n                    <button\n                        type=\"button\"\n                        className={styles.close}\n                        aria-label={strings.close}\n                        onClick={onClose}\n                    >\n                        ×\n                    </button>\n                </div>\n\n                {step.title && (\n                    <h2 className={styles.title} id={titleId}>\n                        {step.title}\n                    </h2>\n                )}\n                <div className={styles.body} id={bodyId}>\n                    {step.body}\n                </div>\n\n                <div className={styles.footer}>\n                    {!last && (\n                        <button type=\"button\" className={styles.skip} onClick={onClose}>\n                            {strings.skip}\n                        </button>\n                    )}\n                    <div className={styles.actions}>\n                        {current > 0 && (\n                            <button\n                                type=\"button\"\n                                className={styles.secondary}\n                                onClick={() => goTo(current - 1)}\n                            >\n                                {strings.back}\n                            </button>\n                        )}\n                        <button\n                            type=\"button\"\n                            className={styles.primary}\n                            onClick={() => (last ? finish() : goTo(current + 1))}\n                        >\n                            {last ? strings.finish : strings.next}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n}\n"],"mappings":"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"}

package/dist/components/Tour/Tour.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tour.js","names":[],"sources":["../../../src/components/Tour/Tour.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — a product tour is a\n * controlled sequence (steps, index, onIndexChange, open, onClose, onFinish) drawn\n * over someone else's DOM (spotlightPadding, locale, className). The body measures\n * the target element, positions the spotlight and the card against it, and re-\n * measures on scroll and resize — one geometry, three triggers.\n */\nimport {\n    useCallback,\n    useEffect,\n    useId,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type KeyboardEvent,\n    type ReactNode,\n} from \"react\";\n\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport { cn } from \"@/utils/cn\";\n\nimport { backdropRects, placeCard, type TourPlacement, type TourRect } from \"./tour-position\";\nimport styles from \"./Tour.module.css\";\n\n/** One stop of the tour. */\nexport interface TourStep {\n    /**\n     * CSS selector of the element to point at.\n     *\n     * A selector rather than a ref, so a tour can be declared as data — in a config\n     * file, from the backend, next to the copy — without every screen having to\n     * thread refs up to whoever renders the tour.\n     */\n    target?: string;\n    /** Heading of the card. */\n    title?: ReactNode;\n    /** The explanation. */\n    body: ReactNode;\n    /** Preferred side. Default `\"bottom\"`, flipped when it does not fit. */\n    placement?: TourPlacement;\n}\n\n/** Labels, per locale. */\ninterface TourStrings {\n    next: string;\n    back: string;\n    finish: string;\n    skip: string;\n    close: string;\n    progress: (current: number, total: number) => string;\n}\n\nconst PT_BR: TourStrings = {\n    next: \"Próximo\",\n    back: \"Voltar\",\n    finish: \"Concluir\",\n    skip: \"Pular\",\n    close: \"Fechar tour\",\n    progress: (current, total) => `Passo ${current} de ${total}`,\n};\n\nconst EN: TourStrings = {\n    next: \"Next\",\n    back: \"Back\",\n    finish: \"Done\",\n    skip: \"Skip\",\n    close: \"Close tour\",\n    progress: (current, total) => `Step ${current} of ${total}`,\n};\n\nexport interface TourProps {\n    /** The stops, in order. */\n    steps: readonly TourStep[];\n    /** Whether the tour is showing. Controlled. */\n    open: boolean;\n    /** Closed by `Esc`, by the close button or by \"skip\". */\n    onClose: () => void;\n    /** Called after the last step is confirmed. `onClose` follows it. */\n    onFinish?: () => void;\n    /** Current step index, when the app wants to drive it. */\n    index?: number;\n    /** Step changed — required only when `index` is given. */\n    onIndexChange?: (index: number) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Space kept clear around the highlighted element, in px. Default 4. */\n    spotlightPadding?: number;\n    /** Extra class on the card. */\n    className?: string;\n}\n\n/**\n * A guided tour: dim the page, highlight one element at a time, explain it.\n *\n * The highlighted element stays **clickable** while everything else is blocked,\n * because the useful kind of coachmark says \"press this\" and lets you press it. That\n * is why the backdrop is four rectangles around the target rather than one overlay\n * with a `box-shadow` hole — a shadow is not hit-testable, so a hole made that way\n * would not block anything.\n *\n * Whether a user has seen the tour is the app's business: this component takes\n * `open` and emits `onClose`/`onFinish`. Persisting a flag in `localStorage` is one\n * line in the app and a wrong default here.\n *\n * @example\n * const [open, setOpen] = useState(!storage.get(\"tour-v1\"));\n *\n * <Tour\n *     open={open}\n *     steps={[\n *         { target: \"#novo-pedido\", title: \"Comece aqui\", body: \"Todo pedido nasce deste botão.\" },\n *         { target: \"[data-tour='filtros']\", body: \"E filtre por período aqui.\" },\n *     ]}\n *     onClose={() => setOpen(false)}\n *     onFinish={() => storage.set(\"tour-v1\", true)}\n * />\n */\nexport function Tour({\n    steps,\n    open,\n    onClose,\n    onFinish,\n    index,\n    onIndexChange,\n    locale = \"pt-BR\",\n    spotlightPadding = 4,\n    className,\n}: TourProps) {\n    const strings = locale === \"en\" ? EN : PT_BR;\n    const [internal, setInternal] = useState(0);\n    const current = Math.min(index ?? internal, Math.max(0, steps.length - 1));\n    const step = steps[current];\n\n    const card = useRef<HTMLDivElement | null>(null);\n    const [target, setTarget] = useState<TourRect | null>(null);\n    const [position, setPosition] = useState<{\n        placement: TourPlacement;\n        top: number;\n        left: number;\n    }>({ placement: \"center\", top: 0, left: 0 });\n    const [viewport, setViewport] = useState({ width: 0, height: 0 });\n    const titleId = useId();\n    const bodyId = useId();\n\n    useFocusTrap(card, open);\n\n    const goTo = useCallback(\n        (next: number) => {\n            if (index === undefined) setInternal(next);\n            onIndexChange?.(next);\n        },\n        [index, onIndexChange],\n    );\n\n    /** Reset to the first step whenever the tour opens again. */\n    useEffect(() => {\n        if (open && index === undefined) setInternal(0);\n    }, [open, index]);\n\n    /**\n     * Find the step's element, bring it into view, and measure everything.\n     *\n     * The scroll happens before measuring, and the measurement is deferred to the\n     * next frame: reading a rect in the same tick as `scrollIntoView` gives the\n     * position the element had *before* the scroll, which lands the card over the\n     * wrong part of the page.\n     */\n    const measure = useCallback(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        const rect = element?.getBoundingClientRect() ?? null;\n        setTarget(\n            rect\n                ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                : null,\n        );\n\n        const size = {\n            width: card.current?.offsetWidth ?? 320,\n            height: card.current?.offsetHeight ?? 160,\n        };\n        const view = { width: window.innerWidth, height: window.innerHeight };\n        setViewport(view);\n        setPosition(\n            placeCard({\n                target: rect\n                    ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                    : null,\n                card: size,\n                viewport: view,\n                preferred: step.placement,\n            }),\n        );\n    }, [open, step]);\n\n    useLayoutEffect(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        element?.scrollIntoView({ block: \"center\", inline: \"nearest\", behavior: \"smooth\" });\n        const frame = requestAnimationFrame(measure);\n        return () => cancelAnimationFrame(frame);\n    }, [open, step, measure]);\n\n    useEffect(() => {\n        if (!open) return;\n        window.addEventListener(\"resize\", measure);\n        window.addEventListener(\"scroll\", measure, true);\n        return () => {\n            window.removeEventListener(\"resize\", measure);\n            window.removeEventListener(\"scroll\", measure, true);\n        };\n    }, [open, measure]);\n\n    useEffect(() => {\n        if (open) card.current?.focus();\n    }, [open, current]);\n\n    if (!open || !step) return null;\n\n    const last = current === steps.length - 1;\n\n    const finish = (): void => {\n        onFinish?.();\n        onClose();\n    };\n\n    /**\n     * Arrow keys walk the tour and `Esc` leaves it.\n     *\n     * `Esc` is handled here rather than on `window` so a tour opened over a modal\n     * does not close both: the innermost handler that sees the key wins, and the\n     * card has focus.\n     */\n    const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>): void => {\n        if (event.key === \"Escape\") {\n            event.stopPropagation();\n            onClose();\n            return;\n        }\n        if (event.key === \"ArrowRight\" && !last) {\n            event.preventDefault();\n            goTo(current + 1);\n        }\n        if (event.key === \"ArrowLeft\" && current > 0) {\n            event.preventDefault();\n            goTo(current - 1);\n        }\n    };\n\n    return (\n        <div className={styles.root} data-placement={position.placement}>\n            {backdropRects(target, viewport, spotlightPadding).map((rect, i) => (\n                <div\n                    key={i}\n                    className={styles.backdrop}\n                    style={{\n                        top: rect.top,\n                        left: rect.left,\n                        width: rect.width,\n                        height: rect.height,\n                    }}\n                    onClick={onClose}\n                />\n            ))}\n\n            {target && (\n                <div\n                    className={styles.spotlight}\n                    style={{\n                        top: target.top - spotlightPadding,\n                        left: target.left - spotlightPadding,\n                        width: target.width + spotlightPadding * 2,\n                        height: target.height + spotlightPadding * 2,\n                    }}\n                />\n            )}\n\n            <div\n                ref={card}\n                className={cn(styles.card, className)}\n                style={{ top: position.top, left: position.left }}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-labelledby={step.title ? titleId : undefined}\n                aria-describedby={bodyId}\n                tabIndex={-1}\n                onKeyDown={handleKeyDown}\n            >\n                <div className={styles.header}>\n                    <span className={styles.progress}>\n                        {strings.progress(current + 1, steps.length)}\n                    </span>\n                    <button\n                        type=\"button\"\n                        className={styles.close}\n                        aria-label={strings.close}\n                        onClick={onClose}\n                    >\n                        ×\n                    </button>\n                </div>\n\n                {step.title && (\n                    <h2 className={styles.title} id={titleId}>\n                        {step.title}\n                    </h2>\n                )}\n                <div className={styles.body} id={bodyId}>\n                    {step.body}\n                </div>\n\n                <div className={styles.footer}>\n                    {!last && (\n                        <button type=\"button\" className={styles.skip} onClick={onClose}>\n                            {strings.skip}\n                        </button>\n                    )}\n                    <div className={styles.actions}>\n                        {current > 0 && (\n                            <button\n                                type=\"button\"\n                                className={styles.secondary}\n                                onClick={() => goTo(current - 1)}\n                            >\n                                {strings.back}\n                            </button>\n                        )}\n                        <button\n                            type=\"button\"\n                            className={styles.primary}\n                            onClick={() => (last ? finish() : goTo(current + 1))}\n                        >\n                            {last ? strings.finish : strings.next}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Tour.js","names":[],"sources":["../../../src/components/Tour/Tour.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — a product tour is a\n * controlled sequence (steps, index, onIndexChange, open, onClose, onFinish) drawn\n * over someone else's DOM (spotlightPadding, locale, className). The body measures\n * the target element, positions the spotlight and the card against it, and re-\n * measures on scroll and resize — one geometry, three triggers.\n */\nimport {\n    useCallback,\n    useEffect,\n    useId,\n    useLayoutEffect,\n    useRef,\n    useState,\n    type KeyboardEvent,\n    type ReactNode,\n} from \"react\";\n\nimport { useFocusTrap } from \"@/hooks/use-focus-trap\";\nimport { cn } from \"@/utils/cn\";\n\nimport { backdropRects, placeCard, type TourPlacement, type TourRect } from \"./tour-position\";\nimport styles from \"./Tour.module.css\";\n\n/** One stop of the tour. */\nexport interface TourStep {\n    /**\n     * CSS selector of the element to point at.\n     *\n     * A selector rather than a ref, so a tour can be declared as data — in a config\n     * file, from the backend, next to the copy — without every screen having to\n     * thread refs up to whoever renders the tour.\n     */\n    target?: string;\n    /** Heading of the card. */\n    title?: ReactNode;\n    /** The explanation. */\n    body: ReactNode;\n    /** Preferred side. Default `\"bottom\"`, flipped when it does not fit. */\n    placement?: TourPlacement;\n}\n\n/** Labels, per locale. */\ninterface TourStrings {\n    next: string;\n    back: string;\n    finish: string;\n    skip: string;\n    close: string;\n    progress: (current: number, total: number) => string;\n}\n\nconst PT_BR: TourStrings = {\n    next: \"Próximo\",\n    back: \"Voltar\",\n    finish: \"Concluir\",\n    skip: \"Pular\",\n    close: \"Fechar tour\",\n    progress: (current, total) => `Passo ${current} de ${total}`,\n};\n\nconst EN: TourStrings = {\n    next: \"Next\",\n    back: \"Back\",\n    finish: \"Done\",\n    skip: \"Skip\",\n    close: \"Close tour\",\n    progress: (current, total) => `Step ${current} of ${total}`,\n};\n\nexport interface TourProps {\n    /** The stops, in order. */\n    steps: readonly TourStep[];\n    /** Whether the tour is showing. Controlled. */\n    open: boolean;\n    /** Closed by `Esc`, by the close button or by \"skip\". */\n    onClose: () => void;\n    /** Called after the last step is confirmed. `onClose` follows it. */\n    onFinish?: () => void;\n    /** Current step index, when the app wants to drive it. */\n    index?: number;\n    /** Step changed — required only when `index` is given. */\n    onIndexChange?: (index: number) => void;\n    /** Locale for the labels. Default `\"pt-BR\"`. */\n    locale?: \"pt-BR\" | \"en\";\n    /** Space kept clear around the highlighted element, in px. Default 4. */\n    spotlightPadding?: number;\n    /** Extra class on the card. */\n    className?: string;\n}\n\n/**\n * A guided tour: dim the page, highlight one element at a time, explain it.\n *\n * The highlighted element stays **clickable** while everything else is blocked,\n * because the useful kind of coachmark says \"press this\" and lets you press it. That\n * is why the backdrop is four rectangles around the target rather than one overlay\n * with a `box-shadow` hole — a shadow is not hit-testable, so a hole made that way\n * would not block anything.\n *\n * Whether a user has seen the tour is the app's business: this component takes\n * `open` and emits `onClose`/`onFinish`. Persisting a flag in `localStorage` is one\n * line in the app and a wrong default here.\n *\n * @example\n * const [open, setOpen] = useState(!storage.get(\"tour-v1\"));\n *\n * <Tour\n *     open={open}\n *     steps={[\n *         { target: \"#novo-pedido\", title: \"Comece aqui\", body: \"Todo pedido nasce deste botão.\" },\n *         { target: \"[data-tour='filtros']\", body: \"E filtre por período aqui.\" },\n *     ]}\n *     onClose={() => setOpen(false)}\n *     onFinish={() => storage.set(\"tour-v1\", true)}\n * />\n */\nexport function Tour({\n    steps,\n    open,\n    onClose,\n    onFinish,\n    index,\n    onIndexChange,\n    locale = \"pt-BR\",\n    spotlightPadding = 4,\n    className,\n}: TourProps) {\n    const strings = locale === \"en\" ? EN : PT_BR;\n    const [internal, setInternal] = useState(0);\n    const current = Math.min(index ?? internal, Math.max(0, steps.length - 1));\n    const step = steps[current];\n\n    const card = useRef<HTMLDivElement | null>(null);\n    const [target, setTarget] = useState<TourRect | null>(null);\n    const [position, setPosition] = useState<{\n        placement: TourPlacement;\n        top: number;\n        left: number;\n    }>({ placement: \"center\", top: 0, left: 0 });\n    const [viewport, setViewport] = useState({ width: 0, height: 0 });\n    const titleId = useId();\n    const bodyId = useId();\n\n    useFocusTrap(card, open);\n\n    const goTo = useCallback(\n        (next: number) => {\n            if (index === undefined) setInternal(next);\n            onIndexChange?.(next);\n        },\n        [index, onIndexChange],\n    );\n\n    /** Reset to the first step whenever the tour opens again. */\n    useEffect(() => {\n        if (open && index === undefined) setInternal(0);\n    }, [open, index]);\n\n    /**\n     * Find the step's element, bring it into view, and measure everything.\n     *\n     * The scroll happens before measuring, and the measurement is deferred to the\n     * next frame: reading a rect in the same tick as `scrollIntoView` gives the\n     * position the element had *before* the scroll, which lands the card over the\n     * wrong part of the page.\n     */\n    const measure = useCallback(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        const rect = element?.getBoundingClientRect() ?? null;\n        setTarget(\n            rect\n                ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                : null,\n        );\n\n        const size = {\n            width: card.current?.offsetWidth ?? 320,\n            height: card.current?.offsetHeight ?? 160,\n        };\n        const view = { width: window.innerWidth, height: window.innerHeight };\n        setViewport(view);\n        setPosition(\n            placeCard({\n                target: rect\n                    ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height }\n                    : null,\n                card: size,\n                viewport: view,\n                preferred: step.placement,\n            }),\n        );\n    }, [open, step]);\n\n    useLayoutEffect(() => {\n        if (!open || !step) return;\n        const element = step.target ? document.querySelector<HTMLElement>(step.target) : null;\n        element?.scrollIntoView({ block: \"center\", inline: \"nearest\", behavior: \"smooth\" });\n        const frame = requestAnimationFrame(measure);\n        return () => cancelAnimationFrame(frame);\n    }, [open, step, measure]);\n\n    useEffect(() => {\n        if (!open) return;\n        window.addEventListener(\"resize\", measure);\n        window.addEventListener(\"scroll\", measure, true);\n        return () => {\n            window.removeEventListener(\"resize\", measure);\n            window.removeEventListener(\"scroll\", measure, true);\n        };\n    }, [open, measure]);\n\n    useEffect(() => {\n        if (open) card.current?.focus();\n    }, [open, current]);\n\n    if (!open || !step) return null;\n\n    const last = current === steps.length - 1;\n\n    const finish = (): void => {\n        onFinish?.();\n        onClose();\n    };\n\n    /**\n     * Arrow keys walk the tour and `Esc` leaves it.\n     *\n     * `Esc` is handled here rather than on `window` so a tour opened over a modal\n     * does not close both: the innermost handler that sees the key wins, and the\n     * card has focus.\n     */\n    const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>): void => {\n        if (event.key === \"Escape\") {\n            event.stopPropagation();\n            onClose();\n            return;\n        }\n        if (event.key === \"ArrowRight\" && !last) {\n            event.preventDefault();\n            goTo(current + 1);\n        }\n        if (event.key === \"ArrowLeft\" && current > 0) {\n            event.preventDefault();\n            goTo(current - 1);\n        }\n    };\n\n    return (\n        <div className={styles.root} data-placement={position.placement}>\n            {backdropRects(target, viewport, spotlightPadding).map((rect, i) => (\n                <div\n                    key={i}\n                    className={styles.backdrop}\n                    style={{\n                        top: rect.top,\n                        left: rect.left,\n                        width: rect.width,\n                        height: rect.height,\n                    }}\n                    onClick={onClose}\n                />\n            ))}\n\n            {target && (\n                <div\n                    className={styles.spotlight}\n                    style={{\n                        top: target.top - spotlightPadding,\n                        left: target.left - spotlightPadding,\n                        width: target.width + spotlightPadding * 2,\n                        height: target.height + spotlightPadding * 2,\n                    }}\n                />\n            )}\n\n            <div\n                ref={card}\n                className={cn(styles.card, className)}\n                style={{ top: position.top, left: position.left }}\n                role=\"dialog\"\n                aria-modal=\"true\"\n                aria-labelledby={step.title ? titleId : undefined}\n                aria-describedby={bodyId}\n                tabIndex={-1}\n                onKeyDown={handleKeyDown}\n            >\n                <div className={styles.header}>\n                    <span className={styles.progress}>\n                        {strings.progress(current + 1, steps.length)}\n                    </span>\n                    <button\n                        type=\"button\"\n                        className={styles.close}\n                        aria-label={strings.close}\n                        onClick={onClose}\n                    >\n                        ×\n                    </button>\n                </div>\n\n                {step.title && (\n                    <h2 className={styles.title} id={titleId}>\n                        {step.title}\n                    </h2>\n                )}\n                <div className={styles.body} id={bodyId}>\n                    {step.body}\n                </div>\n\n                <div className={styles.footer}>\n                    {!last && (\n                        <button type=\"button\" className={styles.skip} onClick={onClose}>\n                            {strings.skip}\n                        </button>\n                    )}\n                    <div className={styles.actions}>\n                        {current > 0 && (\n                            <button\n                                type=\"button\"\n                                className={styles.secondary}\n                                onClick={() => goTo(current - 1)}\n                            >\n                                {strings.back}\n                            </button>\n                        )}\n                        <button\n                            type=\"button\"\n                            className={styles.primary}\n                            onClick={() => (last ? finish() : goTo(current + 1))}\n                        >\n                            {last ? strings.finish : strings.next}\n                        </button>\n                    </div>\n                </div>\n            </div>\n        </div>\n    );\n}\n"],"mappings":"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"}