tempest-react-sdk 0.77.0 → 0.79.0

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":["styles","TimePicker_module_default","pad2","value","parseValue","match","hour24","minute","to12Hour","mod","to24Hour","base","hour12","period","TimePicker","id","useId","useMemo","hourCells","use12Hours","index","minuteCells","step","minuteStep","cells","current","selectedHourDisplay","emit","nextHour24","nextMinute","handleHour","disabled","displayHour","handleMinute","baseHour24","handlePeriod","nextPeriod","cn","className","label","active","cell","helperText"],"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/TimePicker/TimePicker.module.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.module.cjs","names":[],"sources":["../../../src/components/TimePicker/TimePicker.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n}\n\n.columns {\n    display: flex;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-surface);\n    box-shadow: var(--tempest-shadow-lg);\n    width: max-content;\n    max-width: 100%;\n}\n\n.column {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0 var(--tempest-space-1);\n    max-height: 220px;\n    overflow-y: auto;\n    scroll-behavior: smooth;\n}\n\n.column + .column {\n    border-left: 1px solid var(--tempest-border);\n}\n\n.cellWrapper {\n    margin: 0;\n}\n\n.cell {\n    appearance: none;\n    width: 100%;\n    min-width: 48px;\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: none;\n    border-radius: var(--tempest-radius-md);\n    background-color: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-text-base);\n    text-align: center;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .cell:hover:not(:disabled) {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.cell:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.cell.active {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.cell:disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.wrapper.disabled {\n    opacity: 0.7;\n}\n"],"mappings":";"}
+{"version":3,"file":"TimePicker.module.cjs","names":["wrapper","label","columns","column","cellWrapper","cell","active","helper","disabled","TimePicker_module_default"],"sources":["../../../src/components/TimePicker/TimePicker.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n}\n\n.columns {\n    display: flex;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-surface);\n    box-shadow: var(--tempest-shadow-lg);\n    width: max-content;\n    max-width: 100%;\n}\n\n.column {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0 var(--tempest-space-1);\n    max-height: 220px;\n    overflow-y: auto;\n    scroll-behavior: smooth;\n}\n\n.column + .column {\n    border-left: 1px solid var(--tempest-border);\n}\n\n.cellWrapper {\n    margin: 0;\n}\n\n.cell {\n    appearance: none;\n    width: 100%;\n    min-width: 48px;\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: none;\n    border-radius: var(--tempest-radius-md);\n    background-color: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-text-base);\n    text-align: center;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .cell:hover:not(:disabled) {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.cell:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.cell.active {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.cell:disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.wrapper.disabled {\n    opacity: 0.7;\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.module.js","names":[],"sources":["../../../src/components/TimePicker/TimePicker.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n}\n\n.columns {\n    display: flex;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-surface);\n    box-shadow: var(--tempest-shadow-lg);\n    width: max-content;\n    max-width: 100%;\n}\n\n.column {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0 var(--tempest-space-1);\n    max-height: 220px;\n    overflow-y: auto;\n    scroll-behavior: smooth;\n}\n\n.column + .column {\n    border-left: 1px solid var(--tempest-border);\n}\n\n.cellWrapper {\n    margin: 0;\n}\n\n.cell {\n    appearance: none;\n    width: 100%;\n    min-width: 48px;\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: none;\n    border-radius: var(--tempest-radius-md);\n    background-color: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-text-base);\n    text-align: center;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .cell:hover:not(:disabled) {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.cell:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.cell.active {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.cell:disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.wrapper.disabled {\n    opacity: 0.7;\n}\n"],"mappings":";"}
+{"version":3,"file":"TimePicker.module.js","names":["wrapper","label","columns","column","cellWrapper","cell","active","helper","disabled","TimePicker_module_default"],"sources":["../../../src/components/TimePicker/TimePicker.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n}\n\n.columns {\n    display: flex;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-surface);\n    box-shadow: var(--tempest-shadow-lg);\n    width: max-content;\n    max-width: 100%;\n}\n\n.column {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0 var(--tempest-space-1);\n    max-height: 220px;\n    overflow-y: auto;\n    scroll-behavior: smooth;\n}\n\n.column + .column {\n    border-left: 1px solid var(--tempest-border);\n}\n\n.cellWrapper {\n    margin: 0;\n}\n\n.cell {\n    appearance: none;\n    width: 100%;\n    min-width: 48px;\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border: none;\n    border-radius: var(--tempest-radius-md);\n    background-color: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-text-base);\n    text-align: center;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .cell:hover:not(:disabled) {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.cell:focus-visible {\n    outline: none;\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.cell.active {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.cell:disabled {\n    cursor: not-allowed;\n    opacity: 0.5;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.wrapper.disabled {\n    opacity: 0.7;\n}\n"],"mappings":";"}

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\n/**\n * The class each marker color applies, keyed by the published CSS-module names.\n *\n * The build exports CSS-module keys in camelCase only (`localsConvention:\n * \"camelCaseOnly\"` in `vite.config.ts`), so a kebab lookup such as\n * `styles[\"marker-primary\"]` is `undefined` in `dist/` — which is how every marker\n * shipped transparent until issue #405. A `Record` over the union also makes the\n * type-checker demand an entry for every color added to {@link TimelineMarker}.\n */\nconst MARKER_CLASS: Record<TimelineMarker, string> = {\n    primary: styles.markerPrimary,\n    success: styles.markerSuccess,\n    warning: styles.markerWarning,\n    danger: styles.markerDanger,\n    neutral: styles.markerNeutral,\n};\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, 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                                    MARKER_CLASS[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":"4GAeA,IAAM,EAA+C,CACjD,QAAS,EAAA,QAAO,cAChB,QAAS,EAAA,QAAO,cAChB,QAAS,EAAA,QAAO,cAChB,OAAQ,EAAA,QAAO,aACf,QAAS,EAAA,QAAO,aACpB,EAmCA,SAAgB,EAAS,CAAE,QAAO,YAAY,GAAM,YAAW,GAAG,GAAwB,CACtF,OACI,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAW,EAAA,GAAG,EAAA,QAAO,SAAU,CAAS,EAAG,GAAI,EAC9C,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,EAAK,QAAU,UAChC,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"}
+{"version":3,"file":"Timeline.cjs","names":["styles","cn","require_cn","require_Timeline_module","react_jsx_runtime","MARKER_CLASS","Timeline","props","className","items","isLast","index","item","connector"],"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\n/**\n * The class each marker color applies, keyed by the published CSS-module names.\n *\n * The build exports CSS-module keys in camelCase only (`localsConvention:\n * \"camelCaseOnly\"` in `vite.config.ts`), so a kebab lookup such as\n * `styles[\"marker-primary\"]` is `undefined` in `dist/` — which is how every marker\n * shipped transparent until issue #405. A `Record` over the union also makes the\n * type-checker demand an entry for every color added to {@link TimelineMarker}.\n */\nconst MARKER_CLASS: Record<TimelineMarker, string> = {\n    primary: styles.markerPrimary,\n    success: styles.markerSuccess,\n    warning: styles.markerWarning,\n    danger: styles.markerDanger,\n    neutral: styles.markerNeutral,\n};\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, 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                                    MARKER_CLASS[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":"A,4GAeA,IAAMK,EAA+C,CACjD,QAASL,EAAAA,QAAO,cAChB,QAASA,EAAAA,QAAO,cAChB,QAASA,EAAAA,QAAO,cAChB,OAAQA,EAAAA,QAAO,aACf,QAASA,EAAAA,QAAO,aACpB,EAmCA,SAAgBM,EAAS,CAAE,QAAO,YAAY,GAAM,YAAW,GAAGC,GAAwB,CACtF,OACI,EAAAH,EAAA,IAAA,CAAC,KAAD,CAAI,UAAWH,EAAAA,GAAGD,EAAAA,QAAO,SAAUQ,CAAS,EAAG,GAAID,EAC9C,SAAAE,EAAM,KAAK,EAAM,IAAU,CACxB,IAAMC,EAASC,IAAUF,EAAM,OAAS,EACxC,OACI,EAAAL,EAAA,KAAA,CAAC,KAAD,CAAkB,UAAWJ,EAAAA,QAAO,KAApC,SAAA,EACI,EAAAI,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,QAAO,aAAvB,SAAA,EACI,EAAAI,EAAA,IAAA,CAAC,OAAD,CACI,UAAWH,EAAAA,GACPD,EAAAA,QAAO,OACPK,EAAaO,EAAK,QAAU,UAChC,EACA,cAAY,OAEX,SAAAA,EAAK,IACJ,CAAA,EACLC,GAAa,CAACH,IACX,EAAAN,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWJ,EAAAA,QAAO,KAAM,cAAY,MAAQ,CAAA,CAErD,CACL,CAAA,GAAA,EAAAI,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,QAAO,KAAvB,SAAA,EACI,EAAAI,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,QAAO,IAAvB,SAAA,EACI,EAAAI,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWJ,EAAAA,QAAO,MAAQ,SAAAY,EAAK,KAAY,CAAA,EAChDA,EAAK,OAAQ,EAAAR,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWJ,EAAAA,QAAO,KAAO,SAAAY,EAAK,IAAW,CAAA,CAC5D,CACJ,CAAA,EAAAA,EAAK,cACF,EAAAR,EAAA,IAAA,CAAC,IAAD,CAAG,UAAWJ,EAAAA,QAAO,YAAc,SAAAY,EAAK,WAAe,CAAA,CAE1D,CACL,CAAA,CAAA,CAxBK,EAAAA,EAAK,EAwBV,CAEZ,CAAC,CACD,CAAA,CAEZ,C"}

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\n/**\n * The class each marker color applies, keyed by the published CSS-module names.\n *\n * The build exports CSS-module keys in camelCase only (`localsConvention:\n * \"camelCaseOnly\"` in `vite.config.ts`), so a kebab lookup such as\n * `styles[\"marker-primary\"]` is `undefined` in `dist/` — which is how every marker\n * shipped transparent until issue #405. A `Record` over the union also makes the\n * type-checker demand an entry for every color added to {@link TimelineMarker}.\n */\nconst MARKER_CLASS: Record<TimelineMarker, string> = {\n    primary: styles.markerPrimary,\n    success: styles.markerSuccess,\n    warning: styles.markerWarning,\n    danger: styles.markerDanger,\n    neutral: styles.markerNeutral,\n};\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, 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                                    MARKER_CLASS[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":";;;;AAeA,IAAM,IAA+C;CACjD,SAAS,EAAO;CAChB,SAAS,EAAO;CAChB,SAAS,EAAO;CAChB,QAAQ,EAAO;CACf,SAAS,EAAO;AACpB;AAmCA,SAAgB,EAAS,EAAE,UAAO,eAAY,IAAM,cAAW,GAAG,KAAwB;CACtF,OACI,kBAAC,MAAD;EAAI,WAAW,EAAG,EAAO,UAAU,CAAS;EAAG,GAAI;EAC9C,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,EAAa,EAAK,UAAU,UAChC;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"}
+{"version":3,"file":"Timeline.js","names":["styles","Timeline_module_default","MARKER_CLASS","Timeline","props","cn","className","items","isLast","index","item","connector"],"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\n/**\n * The class each marker color applies, keyed by the published CSS-module names.\n *\n * The build exports CSS-module keys in camelCase only (`localsConvention:\n * \"camelCaseOnly\"` in `vite.config.ts`), so a kebab lookup such as\n * `styles[\"marker-primary\"]` is `undefined` in `dist/` — which is how every marker\n * shipped transparent until issue #405. A `Record` over the union also makes the\n * type-checker demand an entry for every color added to {@link TimelineMarker}.\n */\nconst MARKER_CLASS: Record<TimelineMarker, string> = {\n    primary: styles.markerPrimary,\n    success: styles.markerSuccess,\n    warning: styles.markerWarning,\n    danger: styles.markerDanger,\n    neutral: styles.markerNeutral,\n};\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, 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                                    MARKER_CLASS[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":";;;;AAeA,IAAME,IAA+C;CACjD,SAASF,EAAO;CAChB,SAASA,EAAO;CAChB,SAASA,EAAO;CAChB,QAAQA,EAAO;CACf,SAASA,EAAO;AACpB;AAmCA,SAAgBG,EAAS,EAAE,UAAO,eAAY,IAAM,cAAW,GAAGC,KAAwB;CACtF,OACI,kBAAC,MAAD;EAAI,WAAWC,EAAGL,EAAO,UAAUM,CAAS;EAAG,GAAIF;EAC9C,UAAAG,EAAM,KAAK,GAAM,MAAU;GACxB,IAAMC,IAASC,MAAUF,EAAM,SAAS;GACxC,OACI,kBAAC,MAAD;IAAkB,WAAWP,EAAO;IAApC,UAAA,CACI,kBAAC,OAAD;KAAK,WAAWA,EAAO;KAAvB,UAAA,CACI,kBAAC,QAAD;MACI,WAAWK,EACPL,EAAO,QACPE,EAAaQ,EAAK,UAAU,UAChC;MACA,eAAY;MAEX,UAAAA,EAAK;KACJ,CAAA,GACLC,KAAa,CAACH,KACX,kBAAC,QAAD;MAAM,WAAWR,EAAO;MAAM,eAAY;KAAQ,CAAA,CAErD;IACL,CAAA,GAAA,kBAAC,OAAD;KAAK,WAAWA,EAAO;KAAvB,UAAA,CACI,kBAAC,OAAD;MAAK,WAAWA,EAAO;MAAvB,UAAA,CACI,kBAAC,QAAD;OAAM,WAAWA,EAAO;OAAQ,UAAAU,EAAK;MAAY,CAAA,GAChDA,EAAK,QAAQ,kBAAC,QAAD;OAAM,WAAWV,EAAO;OAAO,UAAAU,EAAK;MAAW,CAAA,CAC5D;KACJ,CAAA,GAAAA,EAAK,eACF,kBAAC,KAAD;MAAG,WAAWV,EAAO;MAAc,UAAAU,EAAK;KAAe,CAAA,CAE1D;IACL,CAAA,CAAA;GAxBK,GAAAA,EAAK,EAwBV;EAEZ,CAAC;CACD,CAAA;AAEZ"}

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

@@ -1 +1 @@
-{"version":3,"file":"Timeline.module.cjs","names":[],"sources":["../../../src/components/Timeline/Timeline.module.css"],"sourcesContent":[".timeline {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.item {\n    display: flex;\n    gap: var(--tempest-space-3);\n    padding-bottom: var(--tempest-space-4);\n}\n\n.item:last-child {\n    padding-bottom: 0;\n}\n\n.markerColumn {\n    flex: 0 0 auto;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 16px;\n    padding-top: 4px;\n}\n\n.marker {\n    width: 14px;\n    height: 14px;\n    border-radius: var(--tempest-radius-full);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: white;\n    font-size: 10px;\n    flex: 0 0 auto;\n}\n\n.markerPrimary {\n    background: var(--tempest-primary);\n}\n.markerSuccess {\n    background: var(--tempest-success-solid, var(--tempest-success));\n}\n.markerWarning {\n    background: var(--tempest-warning-solid, var(--tempest-warning));\n}\n.markerDanger {\n    background: var(--tempest-danger-solid, var(--tempest-danger));\n}\n.markerNeutral {\n    background: var(--tempest-gray-400, var(--tempest-border));\n}\n\n.line {\n    flex: 1 1 auto;\n    width: 2px;\n    background: var(--tempest-border);\n    margin-top: 4px;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.row {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--tempest-space-3);\n}\n\n.title {\n    font-weight: var(--tempest-weight-medium);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.meta {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n    white-space: nowrap;\n}\n\n.description {\n    margin: var(--tempest-space-1) 0 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n"],"mappings":";"}
+{"version":3,"file":"Timeline.module.cjs","names":["timeline","item","markerColumn","marker","markerPrimary","markerSuccess","markerWarning","markerDanger","markerNeutral","line","body","row","title","meta","description","Timeline_module_default"],"sources":["../../../src/components/Timeline/Timeline.module.css"],"sourcesContent":[".timeline {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.item {\n    display: flex;\n    gap: var(--tempest-space-3);\n    padding-bottom: var(--tempest-space-4);\n}\n\n.item:last-child {\n    padding-bottom: 0;\n}\n\n.markerColumn {\n    flex: 0 0 auto;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 16px;\n    padding-top: 4px;\n}\n\n.marker {\n    width: 14px;\n    height: 14px;\n    border-radius: var(--tempest-radius-full);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: white;\n    font-size: 10px;\n    flex: 0 0 auto;\n}\n\n.markerPrimary {\n    background: var(--tempest-primary);\n}\n.markerSuccess {\n    background: var(--tempest-success-solid, var(--tempest-success));\n}\n.markerWarning {\n    background: var(--tempest-warning-solid, var(--tempest-warning));\n}\n.markerDanger {\n    background: var(--tempest-danger-solid, var(--tempest-danger));\n}\n.markerNeutral {\n    background: var(--tempest-gray-400, var(--tempest-border));\n}\n\n.line {\n    flex: 1 1 auto;\n    width: 2px;\n    background: var(--tempest-border);\n    margin-top: 4px;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.row {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--tempest-space-3);\n}\n\n.title {\n    font-weight: var(--tempest-weight-medium);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.meta {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n    white-space: nowrap;\n}\n\n.description {\n    margin: var(--tempest-space-1) 0 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"Timeline.module.js","names":[],"sources":["../../../src/components/Timeline/Timeline.module.css"],"sourcesContent":[".timeline {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.item {\n    display: flex;\n    gap: var(--tempest-space-3);\n    padding-bottom: var(--tempest-space-4);\n}\n\n.item:last-child {\n    padding-bottom: 0;\n}\n\n.markerColumn {\n    flex: 0 0 auto;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 16px;\n    padding-top: 4px;\n}\n\n.marker {\n    width: 14px;\n    height: 14px;\n    border-radius: var(--tempest-radius-full);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: white;\n    font-size: 10px;\n    flex: 0 0 auto;\n}\n\n.markerPrimary {\n    background: var(--tempest-primary);\n}\n.markerSuccess {\n    background: var(--tempest-success-solid, var(--tempest-success));\n}\n.markerWarning {\n    background: var(--tempest-warning-solid, var(--tempest-warning));\n}\n.markerDanger {\n    background: var(--tempest-danger-solid, var(--tempest-danger));\n}\n.markerNeutral {\n    background: var(--tempest-gray-400, var(--tempest-border));\n}\n\n.line {\n    flex: 1 1 auto;\n    width: 2px;\n    background: var(--tempest-border);\n    margin-top: 4px;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.row {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--tempest-space-3);\n}\n\n.title {\n    font-weight: var(--tempest-weight-medium);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.meta {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n    white-space: nowrap;\n}\n\n.description {\n    margin: var(--tempest-space-1) 0 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n"],"mappings":";"}
+{"version":3,"file":"Timeline.module.js","names":["timeline","item","markerColumn","marker","markerPrimary","markerSuccess","markerWarning","markerDanger","markerNeutral","line","body","row","title","meta","description","Timeline_module_default"],"sources":["../../../src/components/Timeline/Timeline.module.css"],"sourcesContent":[".timeline {\n    list-style: none;\n    margin: 0;\n    padding: 0;\n    font-family: var(--tempest-font-sans);\n    color: var(--tempest-text);\n}\n\n.item {\n    display: flex;\n    gap: var(--tempest-space-3);\n    padding-bottom: var(--tempest-space-4);\n}\n\n.item:last-child {\n    padding-bottom: 0;\n}\n\n.markerColumn {\n    flex: 0 0 auto;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 16px;\n    padding-top: 4px;\n}\n\n.marker {\n    width: 14px;\n    height: 14px;\n    border-radius: var(--tempest-radius-full);\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: white;\n    font-size: 10px;\n    flex: 0 0 auto;\n}\n\n.markerPrimary {\n    background: var(--tempest-primary);\n}\n.markerSuccess {\n    background: var(--tempest-success-solid, var(--tempest-success));\n}\n.markerWarning {\n    background: var(--tempest-warning-solid, var(--tempest-warning));\n}\n.markerDanger {\n    background: var(--tempest-danger-solid, var(--tempest-danger));\n}\n.markerNeutral {\n    background: var(--tempest-gray-400, var(--tempest-border));\n}\n\n.line {\n    flex: 1 1 auto;\n    width: 2px;\n    background: var(--tempest-border);\n    margin-top: 4px;\n}\n\n.body {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\n.row {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    gap: var(--tempest-space-3);\n}\n\n.title {\n    font-weight: var(--tempest-weight-medium);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n\n.meta {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n    white-space: nowrap;\n}\n\n.description {\n    margin: var(--tempest-space-1) 0 0;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    line-height: var(--tempest-leading-snug);\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"Toast.module.cjs","names":[],"sources":["../../../src/components/Toast/Toast.module.css"],"sourcesContent":[".container {\n    position: fixed;\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    z-index: var(--tempest-z-toast);\n    pointer-events: none;\n    max-width: 100%;\n}\n\n/* Top */\n.positionTopRight {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionTopLeft {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionTopCenter {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Bottom */\n.positionBottomRight {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionBottomLeft {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionBottomCenter {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Mobile — stretch full width and respect safe areas. */\n@media (max-width: 480px) {\n    .container {\n        left: max(var(--tempest-space-3), var(--tempest-safe-area-left)) !important;\n        right: max(var(--tempest-space-3), var(--tempest-safe-area-right)) !important;\n        transform: none !important;\n    }\n    .positionTopRight,\n    .positionTopLeft,\n    .positionTopCenter {\n        top: max(var(--tempest-space-3), var(--tempest-safe-area-top));\n    }\n    .positionBottomRight,\n    .positionBottomLeft,\n    .positionBottomCenter {\n        bottom: max(var(--tempest-space-3), var(--tempest-safe-area-bottom));\n    }\n    .toast {\n        min-width: 0;\n        max-width: 100%;\n    }\n}\n\n.toast {\n    pointer-events: auto;\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    box-shadow: var(--tempest-shadow-lg);\n    min-width: 280px;\n    max-width: 420px;\n    animation: tempest-toast-in var(--tempest-duration-base) var(--tempest-ease-emphasized);\n}\n\n.success {\n    border-left: 4px solid var(--tempest-success-solid);\n}\n.warning {\n    border-left: 4px solid var(--tempest-warning-solid);\n}\n.error {\n    border-left: 4px solid var(--tempest-danger-solid);\n}\n.info {\n    border-left: 4px solid var(--tempest-info-solid);\n}\n\n.title {\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    font-size: var(--tempest-text-base);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n    margin: 0;\n}\n\n.description {\n    font-size: var(--tempest-text-sm);\n    color: var(--tempest-text-muted);\n    line-height: var(--tempest-leading-snug);\n    margin: 2px 0 0 0;\n}\n\n.content {\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-wrap: anywhere;\n}\n\n.withIcon .content {\n    align-self: center;\n}\n\n.alignCenter .content {\n    text-align: center;\n}\n\n.leading {\n    flex: 0 0 auto;\n    align-self: center;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--tempest-text);\n}\n\n.leading img,\n.leading svg {\n    display: block;\n    max-width: var(--tempest-space-8);\n    max-height: var(--tempest-space-8);\n    object-fit: contain;\n}\n\n.close {\n    flex: 0 0 auto;\n    margin-left: auto;\n    background: none;\n    border: none;\n    color: var(--tempest-text-muted);\n    padding: 4px;\n    border-radius: var(--tempest-radius-sm);\n    display: flex;\n    align-items: center;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .close:hover {\n        background-color: var(--tempest-surface);\n        color: var(--tempest-text);\n    }\n}\n\n.close:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@keyframes tempest-toast-in {\n    from {\n        transform: translateX(24px);\n        opacity: 0;\n    }\n    to {\n        transform: translateX(0);\n        opacity: 1;\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .toast {\n        animation: none;\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"Toast.module.cjs","names":["container","positionTopRight","positionTopLeft","positionTopCenter","positionBottomRight","positionBottomLeft","positionBottomCenter","toast","tempestToastIn","success","warning","error","info","title","description","content","withIcon","alignCenter","leading","close","Toast_module_default"],"sources":["../../../src/components/Toast/Toast.module.css"],"sourcesContent":[".container {\n    position: fixed;\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    z-index: var(--tempest-z-toast);\n    pointer-events: none;\n    max-width: 100%;\n}\n\n/* Top */\n.positionTopRight {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionTopLeft {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionTopCenter {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Bottom */\n.positionBottomRight {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionBottomLeft {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionBottomCenter {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Mobile — stretch full width and respect safe areas. */\n@media (max-width: 480px) {\n    .container {\n        left: max(var(--tempest-space-3), var(--tempest-safe-area-left)) !important;\n        right: max(var(--tempest-space-3), var(--tempest-safe-area-right)) !important;\n        transform: none !important;\n    }\n    .positionTopRight,\n    .positionTopLeft,\n    .positionTopCenter {\n        top: max(var(--tempest-space-3), var(--tempest-safe-area-top));\n    }\n    .positionBottomRight,\n    .positionBottomLeft,\n    .positionBottomCenter {\n        bottom: max(var(--tempest-space-3), var(--tempest-safe-area-bottom));\n    }\n    .toast {\n        min-width: 0;\n        max-width: 100%;\n    }\n}\n\n.toast {\n    pointer-events: auto;\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    box-shadow: var(--tempest-shadow-lg);\n    min-width: 280px;\n    max-width: 420px;\n    animation: tempest-toast-in var(--tempest-duration-base) var(--tempest-ease-emphasized);\n}\n\n.success {\n    border-left: 4px solid var(--tempest-success-solid);\n}\n.warning {\n    border-left: 4px solid var(--tempest-warning-solid);\n}\n.error {\n    border-left: 4px solid var(--tempest-danger-solid);\n}\n.info {\n    border-left: 4px solid var(--tempest-info-solid);\n}\n\n.title {\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    font-size: var(--tempest-text-base);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n    margin: 0;\n}\n\n.description {\n    font-size: var(--tempest-text-sm);\n    color: var(--tempest-text-muted);\n    line-height: var(--tempest-leading-snug);\n    margin: 2px 0 0 0;\n}\n\n.content {\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-wrap: anywhere;\n}\n\n.withIcon .content {\n    align-self: center;\n}\n\n.alignCenter .content {\n    text-align: center;\n}\n\n.leading {\n    flex: 0 0 auto;\n    align-self: center;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--tempest-text);\n}\n\n.leading img,\n.leading svg {\n    display: block;\n    max-width: var(--tempest-space-8);\n    max-height: var(--tempest-space-8);\n    object-fit: contain;\n}\n\n.close {\n    flex: 0 0 auto;\n    margin-left: auto;\n    background: none;\n    border: none;\n    color: var(--tempest-text-muted);\n    padding: 4px;\n    border-radius: var(--tempest-radius-sm);\n    display: flex;\n    align-items: center;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .close:hover {\n        background-color: var(--tempest-surface);\n        color: var(--tempest-text);\n    }\n}\n\n.close:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@keyframes tempest-toast-in {\n    from {\n        transform: translateX(24px);\n        opacity: 0;\n    }\n    to {\n        transform: translateX(0);\n        opacity: 1;\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .toast {\n        animation: none;\n    }\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"Toast.module.js","names":[],"sources":["../../../src/components/Toast/Toast.module.css"],"sourcesContent":[".container {\n    position: fixed;\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    z-index: var(--tempest-z-toast);\n    pointer-events: none;\n    max-width: 100%;\n}\n\n/* Top */\n.positionTopRight {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionTopLeft {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionTopCenter {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Bottom */\n.positionBottomRight {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionBottomLeft {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionBottomCenter {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Mobile — stretch full width and respect safe areas. */\n@media (max-width: 480px) {\n    .container {\n        left: max(var(--tempest-space-3), var(--tempest-safe-area-left)) !important;\n        right: max(var(--tempest-space-3), var(--tempest-safe-area-right)) !important;\n        transform: none !important;\n    }\n    .positionTopRight,\n    .positionTopLeft,\n    .positionTopCenter {\n        top: max(var(--tempest-space-3), var(--tempest-safe-area-top));\n    }\n    .positionBottomRight,\n    .positionBottomLeft,\n    .positionBottomCenter {\n        bottom: max(var(--tempest-space-3), var(--tempest-safe-area-bottom));\n    }\n    .toast {\n        min-width: 0;\n        max-width: 100%;\n    }\n}\n\n.toast {\n    pointer-events: auto;\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    box-shadow: var(--tempest-shadow-lg);\n    min-width: 280px;\n    max-width: 420px;\n    animation: tempest-toast-in var(--tempest-duration-base) var(--tempest-ease-emphasized);\n}\n\n.success {\n    border-left: 4px solid var(--tempest-success-solid);\n}\n.warning {\n    border-left: 4px solid var(--tempest-warning-solid);\n}\n.error {\n    border-left: 4px solid var(--tempest-danger-solid);\n}\n.info {\n    border-left: 4px solid var(--tempest-info-solid);\n}\n\n.title {\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    font-size: var(--tempest-text-base);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n    margin: 0;\n}\n\n.description {\n    font-size: var(--tempest-text-sm);\n    color: var(--tempest-text-muted);\n    line-height: var(--tempest-leading-snug);\n    margin: 2px 0 0 0;\n}\n\n.content {\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-wrap: anywhere;\n}\n\n.withIcon .content {\n    align-self: center;\n}\n\n.alignCenter .content {\n    text-align: center;\n}\n\n.leading {\n    flex: 0 0 auto;\n    align-self: center;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--tempest-text);\n}\n\n.leading img,\n.leading svg {\n    display: block;\n    max-width: var(--tempest-space-8);\n    max-height: var(--tempest-space-8);\n    object-fit: contain;\n}\n\n.close {\n    flex: 0 0 auto;\n    margin-left: auto;\n    background: none;\n    border: none;\n    color: var(--tempest-text-muted);\n    padding: 4px;\n    border-radius: var(--tempest-radius-sm);\n    display: flex;\n    align-items: center;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .close:hover {\n        background-color: var(--tempest-surface);\n        color: var(--tempest-text);\n    }\n}\n\n.close:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@keyframes tempest-toast-in {\n    from {\n        transform: translateX(24px);\n        opacity: 0;\n    }\n    to {\n        transform: translateX(0);\n        opacity: 1;\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .toast {\n        animation: none;\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"Toast.module.js","names":["container","positionTopRight","positionTopLeft","positionTopCenter","positionBottomRight","positionBottomLeft","positionBottomCenter","toast","tempestToastIn","success","warning","error","info","title","description","content","withIcon","alignCenter","leading","close","Toast_module_default"],"sources":["../../../src/components/Toast/Toast.module.css"],"sourcesContent":[".container {\n    position: fixed;\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-2);\n    z-index: var(--tempest-z-toast);\n    pointer-events: none;\n    max-width: 100%;\n}\n\n/* Top */\n.positionTopRight {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionTopLeft {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionTopCenter {\n    top: max(var(--tempest-space-4), var(--tempest-safe-area-top));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Bottom */\n.positionBottomRight {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    right: max(var(--tempest-space-4), var(--tempest-safe-area-right));\n}\n.positionBottomLeft {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: max(var(--tempest-space-4), var(--tempest-safe-area-left));\n}\n.positionBottomCenter {\n    bottom: max(var(--tempest-space-4), var(--tempest-safe-area-bottom));\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n}\n\n/* Mobile — stretch full width and respect safe areas. */\n@media (max-width: 480px) {\n    .container {\n        left: max(var(--tempest-space-3), var(--tempest-safe-area-left)) !important;\n        right: max(var(--tempest-space-3), var(--tempest-safe-area-right)) !important;\n        transform: none !important;\n    }\n    .positionTopRight,\n    .positionTopLeft,\n    .positionTopCenter {\n        top: max(var(--tempest-space-3), var(--tempest-safe-area-top));\n    }\n    .positionBottomRight,\n    .positionBottomLeft,\n    .positionBottomCenter {\n        bottom: max(var(--tempest-space-3), var(--tempest-safe-area-bottom));\n    }\n    .toast {\n        min-width: 0;\n        max-width: 100%;\n    }\n}\n\n.toast {\n    pointer-events: auto;\n    display: flex;\n    align-items: flex-start;\n    gap: var(--tempest-space-3);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    box-shadow: var(--tempest-shadow-lg);\n    min-width: 280px;\n    max-width: 420px;\n    animation: tempest-toast-in var(--tempest-duration-base) var(--tempest-ease-emphasized);\n}\n\n.success {\n    border-left: 4px solid var(--tempest-success-solid);\n}\n.warning {\n    border-left: 4px solid var(--tempest-warning-solid);\n}\n.error {\n    border-left: 4px solid var(--tempest-danger-solid);\n}\n.info {\n    border-left: 4px solid var(--tempest-info-solid);\n}\n\n.title {\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-semibold);\n    font-size: var(--tempest-text-base);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n    margin: 0;\n}\n\n.description {\n    font-size: var(--tempest-text-sm);\n    color: var(--tempest-text-muted);\n    line-height: var(--tempest-leading-snug);\n    margin: 2px 0 0 0;\n}\n\n.content {\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-wrap: anywhere;\n}\n\n.withIcon .content {\n    align-self: center;\n}\n\n.alignCenter .content {\n    text-align: center;\n}\n\n.leading {\n    flex: 0 0 auto;\n    align-self: center;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--tempest-text);\n}\n\n.leading img,\n.leading svg {\n    display: block;\n    max-width: var(--tempest-space-8);\n    max-height: var(--tempest-space-8);\n    object-fit: contain;\n}\n\n.close {\n    flex: 0 0 auto;\n    margin-left: auto;\n    background: none;\n    border: none;\n    color: var(--tempest-text-muted);\n    padding: 4px;\n    border-radius: var(--tempest-radius-sm);\n    display: flex;\n    align-items: center;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .close:hover {\n        background-color: var(--tempest-surface);\n        color: var(--tempest-text);\n    }\n}\n\n.close:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: var(--tempest-focus-ring-offset);\n}\n\n@keyframes tempest-toast-in {\n    from {\n        transform: translateX(24px);\n        opacity: 0;\n    }\n    to {\n        transform: translateX(0);\n        opacity: 1;\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .toast {\n        animation: none;\n    }\n}\n"],"mappings":";"}

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    Children,\n    Fragment,\n    createContext,\n    isValidElement,\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\";\nimport { usePortalHost } from \"../Portal/portal-host\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\n/**\n * Horizontal alignment of a toast's title and description.\n *\n * `\"start\"` is the default because a toast is read as a sentence beside a close\n * button: left-aligned lines share one edge with the icon and the stack, so a\n * two-line description stays scannable. `\"center\"` exists for the short\n * celebratory toast (an achievement with a badge) where the text is one line.\n */\nexport type ToastAlign = \"start\" | \"center\";\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     * Leading slot rendered before the text, e.g. `<img src=\"/badge.svg\" alt=\"\" />`.\n     *\n     * It is an app asset, so it takes any `ReactNode` — but it is a slot for an\n     * **icon**, not for a control. The wrapper is `inert`, so a button or link put\n     * here is neither focusable nor clickable; actions belong outside the toast.\n     *\n     * The slot is decorative (`aria-hidden`) unless {@link ToastOptions.iconLabel}\n     * is given: most icons repeat what the title already says, and an unlabelled\n     * image inside the live region would otherwise be announced as \"image\" or by\n     * its file name. An `<img>` or `<svg>` anywhere inside it is capped at 32px and\n     * keeps its aspect ratio. A node that renders nothing (`null`, a boolean, `\"\"`,\n     * `[]`, an empty fragment) counts as no icon, so the toast keeps two columns.\n     */\n    icon?: ReactNode;\n    /**\n     * Accessible name for {@link ToastOptions.icon} when the icon carries meaning\n     * the text does not. With it the slot becomes `role=\"img\"` with this label and\n     * is announced together with the toast; without it the slot is hidden from\n     * assistive technology.\n     */\n    iconLabel?: string;\n    /** Text alignment of title and description. Default `\"start\"`; see {@link ToastAlign}. */\n    align?: ToastAlign;\n}\n\ninterface ToastEntry extends Required<\n    Omit<ToastOptions, \"id\" | \"title\" | \"description\" | \"icon\" | \"iconLabel\">\n> {\n    id: string;\n    title?: string;\n    description?: string;\n    icon?: ReactNode;\n    iconLabel?: 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                icon: options.icon,\n                iconLabel: options.iconLabel,\n                align: options.align ?? \"start\",\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    const portalHost = usePortalHost();\n\n    if (!portalHost) 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        portalHost,\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 *\n * With an icon the toast becomes three columns (leading, content, close) and the\n * icon and text are centred vertically against each other, so a 32px badge sits\n * level with a one-line title. Toasts without an icon keep the top-aligned layout\n * and the same size for short text; what changed for them is long text: the text\n * column now wraps a long word (`overflow-wrap: anywhere`) and the close button no\n * longer shrinks (it used to drop from 22px to 16–17px beside a two-line\n * description).\n *\n * The leading wrapper gets `inert` through a callback ref instead of a prop,\n * because no prop value works on both supported Reacts: React 18 drops\n * `inert={true}` with a warning and renders `inert=\"\"`, while React 19 renders\n * `inert={true}` and drops `inert=\"\"`.\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    const hasIcon = rendersSomething(toast.icon);\n\n    return (\n        <div\n            className={cn(\n                styles.toast,\n                styles[toast.variant],\n                hasIcon && styles.withIcon,\n                toast.align === \"center\" && styles.alignCenter,\n            )}\n        >\n            {hasIcon && (\n                <div\n                    ref={makeInert}\n                    className={styles.leading}\n                    {...(toast.iconLabel\n                        ? { role: \"img\", \"aria-label\": toast.iconLabel }\n                        : { \"aria-hidden\": true })}\n                >\n                    {toast.icon}\n                </div>\n            )}\n            <div className={styles.content}>\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\n/**\n * Whether a node renders anything at all.\n *\n * `Children.toArray` drops `null`, `undefined` and booleans and flattens arrays,\n * but keeps a fragment as one element — so a fragment is unwrapped and checked\n * by its children. `\"\"` renders no text node worth a column either.\n *\n * @param node - The icon slot content.\n * @returns `true` when at least one child would produce output.\n */\nfunction rendersSomething(node: ReactNode): boolean {\n    return Children.toArray(node).some((child) => {\n        if (child === \"\") return false;\n        if (isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment) {\n            return rendersSomething(child.props.children);\n        }\n        return true;\n    });\n}\n\n/**\n * Callback ref that marks the icon wrapper `inert`, on React 18 and 19 alike.\n *\n * @param node - The wrapper element, or `null` on unmount.\n */\nfunction makeInert(node: HTMLDivElement | null): void {\n    node?.setAttribute(\"inert\", \"\");\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":["createContext","useContext","useState","useRef","useCallback","useMemo","styles","usePortalHost","createPortal","cn","Children","isValidElement","Fragment","require_cn","require_portal_host","require_Toast_module","react","react_jsx_runtime","react_dom","ToastContext","useToast","ctx","ToastProvider","toasts","setToasts","counter","dismiss","current","toast","id","show","options","entry","defaultDuration","api","children","ToastContainer","positionClass","position","portalHost","ToastItem","timer","onDismiss","hasIcon","rendersSomething","makeInert","CloseIcon","node","child"],"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    Children,\n    Fragment,\n    createContext,\n    isValidElement,\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\";\nimport { usePortalHost } from \"../Portal/portal-host\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\n/**\n * Horizontal alignment of a toast's title and description.\n *\n * `\"start\"` is the default because a toast is read as a sentence beside a close\n * button: left-aligned lines share one edge with the icon and the stack, so a\n * two-line description stays scannable. `\"center\"` exists for the short\n * celebratory toast (an achievement with a badge) where the text is one line.\n */\nexport type ToastAlign = \"start\" | \"center\";\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     * Leading slot rendered before the text, e.g. `<img src=\"/badge.svg\" alt=\"\" />`.\n     *\n     * It is an app asset, so it takes any `ReactNode` — but it is a slot for an\n     * **icon**, not for a control. The wrapper is `inert`, so a button or link put\n     * here is neither focusable nor clickable; actions belong outside the toast.\n     *\n     * The slot is decorative (`aria-hidden`) unless {@link ToastOptions.iconLabel}\n     * is given: most icons repeat what the title already says, and an unlabelled\n     * image inside the live region would otherwise be announced as \"image\" or by\n     * its file name. An `<img>` or `<svg>` anywhere inside it is capped at 32px and\n     * keeps its aspect ratio. A node that renders nothing (`null`, a boolean, `\"\"`,\n     * `[]`, an empty fragment) counts as no icon, so the toast keeps two columns.\n     */\n    icon?: ReactNode;\n    /**\n     * Accessible name for {@link ToastOptions.icon} when the icon carries meaning\n     * the text does not. With it the slot becomes `role=\"img\"` with this label and\n     * is announced together with the toast; without it the slot is hidden from\n     * assistive technology.\n     */\n    iconLabel?: string;\n    /** Text alignment of title and description. Default `\"start\"`; see {@link ToastAlign}. */\n    align?: ToastAlign;\n}\n\ninterface ToastEntry extends Required<\n    Omit<ToastOptions, \"id\" | \"title\" | \"description\" | \"icon\" | \"iconLabel\">\n> {\n    id: string;\n    title?: string;\n    description?: string;\n    icon?: ReactNode;\n    iconLabel?: 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                icon: options.icon,\n                iconLabel: options.iconLabel,\n                align: options.align ?? \"start\",\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    const portalHost = usePortalHost();\n\n    if (!portalHost) 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        portalHost,\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 *\n * With an icon the toast becomes three columns (leading, content, close) and the\n * icon and text are centred vertically against each other, so a 32px badge sits\n * level with a one-line title. Toasts without an icon keep the top-aligned layout\n * and the same size for short text; what changed for them is long text: the text\n * column now wraps a long word (`overflow-wrap: anywhere`) and the close button no\n * longer shrinks (it used to drop from 22px to 16–17px beside a two-line\n * description).\n *\n * The leading wrapper gets `inert` through a callback ref instead of a prop,\n * because no prop value works on both supported Reacts: React 18 drops\n * `inert={true}` with a warning and renders `inert=\"\"`, while React 19 renders\n * `inert={true}` and drops `inert=\"\"`.\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    const hasIcon = rendersSomething(toast.icon);\n\n    return (\n        <div\n            className={cn(\n                styles.toast,\n                styles[toast.variant],\n                hasIcon && styles.withIcon,\n                toast.align === \"center\" && styles.alignCenter,\n            )}\n        >\n            {hasIcon && (\n                <div\n                    ref={makeInert}\n                    className={styles.leading}\n                    {...(toast.iconLabel\n                        ? { role: \"img\", \"aria-label\": toast.iconLabel }\n                        : { \"aria-hidden\": true })}\n                >\n                    {toast.icon}\n                </div>\n            )}\n            <div className={styles.content}>\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\n/**\n * Whether a node renders anything at all.\n *\n * `Children.toArray` drops `null`, `undefined` and booleans and flattens arrays,\n * but keeps a fragment as one element — so a fragment is unwrapped and checked\n * by its children. `\"\"` renders no text node worth a column either.\n *\n * @param node - The icon slot content.\n * @returns `true` when at least one child would produce output.\n */\nfunction rendersSomething(node: ReactNode): boolean {\n    return Children.toArray(node).some((child) => {\n        if (child === \"\") return false;\n        if (isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment) {\n            return rendersSomething(child.props.children);\n        }\n        return true;\n    });\n}\n\n/**\n * Callback ref that marks the icon wrapper `inert`, on React 18 and 19 alike.\n *\n * @param node - The wrapper element, or `null` on unmount.\n */\nfunction makeInert(node: HTMLDivElement | null): void {\n    node?.setAttribute(\"inert\", \"\");\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/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    Children,\n    Fragment,\n    createContext,\n    isValidElement,\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\";\nimport { usePortalHost } from \"../Portal/portal-host\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\n/**\n * Horizontal alignment of a toast's title and description.\n *\n * `\"start\"` is the default because a toast is read as a sentence beside a close\n * button: left-aligned lines share one edge with the icon and the stack, so a\n * two-line description stays scannable. `\"center\"` exists for the short\n * celebratory toast (an achievement with a badge) where the text is one line.\n */\nexport type ToastAlign = \"start\" | \"center\";\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     * Leading slot rendered before the text, e.g. `<img src=\"/badge.svg\" alt=\"\" />`.\n     *\n     * It is an app asset, so it takes any `ReactNode` — but it is a slot for an\n     * **icon**, not for a control. The wrapper is `inert`, so a button or link put\n     * here is neither focusable nor clickable; actions belong outside the toast.\n     *\n     * The slot is decorative (`aria-hidden`) unless {@link ToastOptions.iconLabel}\n     * is given: most icons repeat what the title already says, and an unlabelled\n     * image inside the live region would otherwise be announced as \"image\" or by\n     * its file name. An `<img>` or `<svg>` anywhere inside it is capped at 32px and\n     * keeps its aspect ratio. A node that renders nothing (`null`, a boolean, `\"\"`,\n     * `[]`, an empty fragment) counts as no icon, so the toast keeps two columns.\n     */\n    icon?: ReactNode;\n    /**\n     * Accessible name for {@link ToastOptions.icon} when the icon carries meaning\n     * the text does not. With it the slot becomes `role=\"img\"` with this label and\n     * is announced together with the toast; without it the slot is hidden from\n     * assistive technology.\n     */\n    iconLabel?: string;\n    /** Text alignment of title and description. Default `\"start\"`; see {@link ToastAlign}. */\n    align?: ToastAlign;\n}\n\ninterface ToastEntry extends Required<\n    Omit<ToastOptions, \"id\" | \"title\" | \"description\" | \"icon\" | \"iconLabel\">\n> {\n    id: string;\n    title?: string;\n    description?: string;\n    icon?: ReactNode;\n    iconLabel?: 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                icon: options.icon,\n                iconLabel: options.iconLabel,\n                align: options.align ?? \"start\",\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    const portalHost = usePortalHost();\n\n    if (!portalHost) 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        portalHost,\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 *\n * With an icon the toast becomes three columns (leading, content, close) and the\n * icon and text are centred vertically against each other, so a 32px badge sits\n * level with a one-line title. Toasts without an icon keep the top-aligned layout\n * and the same size for short text; what changed for them is long text: the text\n * column now wraps a long word (`overflow-wrap: anywhere`) and the close button no\n * longer shrinks (it used to drop from 22px to 16–17px beside a two-line\n * description).\n *\n * The leading wrapper gets `inert` through a callback ref instead of a prop,\n * because no prop value works on both supported Reacts: React 18 drops\n * `inert={true}` with a warning and renders `inert=\"\"`, while React 19 renders\n * `inert={true}` and drops `inert=\"\"`.\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    const hasIcon = rendersSomething(toast.icon);\n\n    return (\n        <div\n            className={cn(\n                styles.toast,\n                styles[toast.variant],\n                hasIcon && styles.withIcon,\n                toast.align === \"center\" && styles.alignCenter,\n            )}\n        >\n            {hasIcon && (\n                <div\n                    ref={makeInert}\n                    className={styles.leading}\n                    {...(toast.iconLabel\n                        ? { role: \"img\", \"aria-label\": toast.iconLabel }\n                        : { \"aria-hidden\": true })}\n                >\n                    {toast.icon}\n                </div>\n            )}\n            <div className={styles.content}>\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\n/**\n * Whether a node renders anything at all.\n *\n * `Children.toArray` drops `null`, `undefined` and booleans and flattens arrays,\n * but keeps a fragment as one element — so a fragment is unwrapped and checked\n * by its children. `\"\"` renders no text node worth a column either.\n *\n * @param node - The icon slot content.\n * @returns `true` when at least one child would produce output.\n */\nfunction rendersSomething(node: ReactNode): boolean {\n    return Children.toArray(node).some((child) => {\n        if (child === \"\") return false;\n        if (isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment) {\n            return rendersSomething(child.props.children);\n        }\n        return true;\n    });\n}\n\n/**\n * Callback ref that marks the icon wrapper `inert`, on React 18 and 19 alike.\n *\n * @param node - The wrapper element, or `null` on unmount.\n */\nfunction makeInert(node: HTMLDivElement | null): void {\n    node?.setAttribute(\"inert\", \"\");\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":["styles","Toast_module_default","ToastContext","createContext","useToast","ctx","useContext","ToastProvider","toasts","setToasts","useState","counter","useRef","dismiss","useCallback","current","toast","id","show","options","entry","defaultDuration","api","useMemo","children","ToastContainer","positionClass","position","portalHost","usePortalHost","createPortal","cn","ToastItem","timer","onDismiss","hasIcon","rendersSomething","makeInert","CloseIcon","Children","node","child","isValidElement","Fragment"],"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    Children,\n    Fragment,\n    createContext,\n    isValidElement,\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\";\nimport { usePortalHost } from \"../Portal/portal-host\";\n\nexport type ToastVariant = \"success\" | \"warning\" | \"error\" | \"info\";\n\n/**\n * Horizontal alignment of a toast's title and description.\n *\n * `\"start\"` is the default because a toast is read as a sentence beside a close\n * button: left-aligned lines share one edge with the icon and the stack, so a\n * two-line description stays scannable. `\"center\"` exists for the short\n * celebratory toast (an achievement with a badge) where the text is one line.\n */\nexport type ToastAlign = \"start\" | \"center\";\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     * Leading slot rendered before the text, e.g. `<img src=\"/badge.svg\" alt=\"\" />`.\n     *\n     * It is an app asset, so it takes any `ReactNode` — but it is a slot for an\n     * **icon**, not for a control. The wrapper is `inert`, so a button or link put\n     * here is neither focusable nor clickable; actions belong outside the toast.\n     *\n     * The slot is decorative (`aria-hidden`) unless {@link ToastOptions.iconLabel}\n     * is given: most icons repeat what the title already says, and an unlabelled\n     * image inside the live region would otherwise be announced as \"image\" or by\n     * its file name. An `<img>` or `<svg>` anywhere inside it is capped at 32px and\n     * keeps its aspect ratio. A node that renders nothing (`null`, a boolean, `\"\"`,\n     * `[]`, an empty fragment) counts as no icon, so the toast keeps two columns.\n     */\n    icon?: ReactNode;\n    /**\n     * Accessible name for {@link ToastOptions.icon} when the icon carries meaning\n     * the text does not. With it the slot becomes `role=\"img\"` with this label and\n     * is announced together with the toast; without it the slot is hidden from\n     * assistive technology.\n     */\n    iconLabel?: string;\n    /** Text alignment of title and description. Default `\"start\"`; see {@link ToastAlign}. */\n    align?: ToastAlign;\n}\n\ninterface ToastEntry extends Required<\n    Omit<ToastOptions, \"id\" | \"title\" | \"description\" | \"icon\" | \"iconLabel\">\n> {\n    id: string;\n    title?: string;\n    description?: string;\n    icon?: ReactNode;\n    iconLabel?: 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                icon: options.icon,\n                iconLabel: options.iconLabel,\n                align: options.align ?? \"start\",\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    const portalHost = usePortalHost();\n\n    if (!portalHost) 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        portalHost,\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 *\n * With an icon the toast becomes three columns (leading, content, close) and the\n * icon and text are centred vertically against each other, so a 32px badge sits\n * level with a one-line title. Toasts without an icon keep the top-aligned layout\n * and the same size for short text; what changed for them is long text: the text\n * column now wraps a long word (`overflow-wrap: anywhere`) and the close button no\n * longer shrinks (it used to drop from 22px to 16–17px beside a two-line\n * description).\n *\n * The leading wrapper gets `inert` through a callback ref instead of a prop,\n * because no prop value works on both supported Reacts: React 18 drops\n * `inert={true}` with a warning and renders `inert=\"\"`, while React 19 renders\n * `inert={true}` and drops `inert=\"\"`.\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    const hasIcon = rendersSomething(toast.icon);\n\n    return (\n        <div\n            className={cn(\n                styles.toast,\n                styles[toast.variant],\n                hasIcon && styles.withIcon,\n                toast.align === \"center\" && styles.alignCenter,\n            )}\n        >\n            {hasIcon && (\n                <div\n                    ref={makeInert}\n                    className={styles.leading}\n                    {...(toast.iconLabel\n                        ? { role: \"img\", \"aria-label\": toast.iconLabel }\n                        : { \"aria-hidden\": true })}\n                >\n                    {toast.icon}\n                </div>\n            )}\n            <div className={styles.content}>\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\n/**\n * Whether a node renders anything at all.\n *\n * `Children.toArray` drops `null`, `undefined` and booleans and flattens arrays,\n * but keeps a fragment as one element — so a fragment is unwrapped and checked\n * by its children. `\"\"` renders no text node worth a column either.\n *\n * @param node - The icon slot content.\n * @returns `true` when at least one child would produce output.\n */\nfunction rendersSomething(node: ReactNode): boolean {\n    return Children.toArray(node).some((child) => {\n        if (child === \"\") return false;\n        if (isValidElement<{ children?: ReactNode }>(child) && child.type === Fragment) {\n            return rendersSomething(child.props.children);\n        }\n        return true;\n    });\n}\n\n/**\n * Callback ref that marks the icon wrapper `inert`, on React 18 and 19 alike.\n *\n * @param node - The wrapper element, or `null` on unmount.\n */\nfunction makeInert(node: HTMLDivElement | null): void {\n    node?.setAttribute(\"inert\", \"\");\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,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"}
+{"version":3,"file":"Toggle.cjs","names":["forwardRef","useState","useCallback","cn","styles","require_cn","require_Toggle_module","react","react_jsx_runtime","Toggle","props","isControlled","pressed","internalPressed","setInternalPressed","defaultPressed","isPressed","handleClick","onClick","event","next","onPressedChange","size","variant","className"],"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":"A,6HA+BA,IAAaS,GAAA,EAAST,EAAAA,WAAAA,CAA2C,SAC7D,CACI,UACA,iBAAiB,GACjB,kBACA,OAAO,KACP,UAAU,UACV,YACA,WACA,UACA,WACA,GAAGU,GAEP,EACF,CACE,IAAMC,EAAeC,IAAY,IAAA,GAC3B,CAACC,EAAiBC,IAAA,EAAsBb,EAAAA,SAAAA,CAAkBc,CAAc,EACxEC,EAAYL,EAAeC,EAAUC,EAErCI,GAAA,EAAcf,EAAAA,YAAAA,CACf,GAAqD,CAElD,GADAgB,IAAUC,CAAK,EACXA,EAAM,iBAAkB,OAC5B,IAAMC,EAAO,CAACJ,EACTL,GAAcG,EAAmBM,CAAI,EAC1CC,IAAkBD,CAAI,CAC1B,EACA,CAACJ,EAAWL,EAAcO,EAASG,CAAe,CACtD,EAEA,OACI,EAAAb,EAAA,IAAA,CAAC,SAAD,CACS,MACL,KAAK,SACL,eAAcQ,EACJ,WACV,aAAYA,EAAY,KAAO,MAC/B,UAAWb,EAAAA,GACPC,EAAAA,QAAO,OACPA,EAAAA,QAAOkB,GACPlB,EAAAA,QAAOmB,GACPP,GAAaZ,EAAAA,QAAO,QACpBoB,CACJ,EACA,QAASP,EACT,GAAIP,EAEH,UACG,CAAA,CAEhB,CAAC,E"}

package/dist/components/Toggle/Toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.js","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":";;;;;AA+BA,IAAa,IAAS,EAA2C,SAC7D,EACI,YACA,oBAAiB,IACjB,oBACA,UAAO,MACP,aAAU,WACV,cACA,aACA,YACA,aACA,GAAG,KAEP,GACF;CACE,IAAM,IAAe,MAAY,KAAA,GAC3B,CAAC,GAAiB,KAAsB,EAAkB,CAAc,GACxE,IAAY,IAAe,IAAU,GAErC,IAAc,GACf,MAAqD;EAElD,IADA,IAAU,CAAK,GACX,EAAM,kBAAkB;EAC5B,IAAM,IAAO,CAAC;EAEd,AADK,KAAc,EAAmB,CAAI,GAC1C,IAAkB,CAAI;CAC1B,GACA;EAAC;EAAW;EAAc;EAAS;CAAe,CACtD;CAEA,OACI,kBAAC,UAAD;EACS;EACL,MAAK;EACL,gBAAc;EACJ;EACV,cAAY,IAAY,OAAO;EAC/B,WAAW,EACP,EAAO,QACP,EAAO,IACP,EAAO,IACP,KAAa,EAAO,SACpB,CACJ;EACA,SAAS;EACT,GAAI;EAEH;CACG,CAAA;AAEhB,CAAC"}
+{"version":3,"file":"Toggle.js","names":["styles","Toggle_module_default","Toggle","forwardRef","props","isControlled","pressed","internalPressed","setInternalPressed","useState","defaultPressed","isPressed","handleClick","useCallback","onClick","event","next","onPressedChange","cn","size","variant","className"],"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":";;;;;AA+BA,IAAaE,IAASC,EAA2C,SAC7D,EACI,YACA,oBAAiB,IACjB,oBACA,UAAO,MACP,aAAU,WACV,cACA,aACA,YACA,aACA,GAAGC,KAEP,GACF;CACE,IAAMC,IAAeC,MAAY,KAAA,GAC3B,CAACC,GAAiBC,KAAsBC,EAAkBC,CAAc,GACxEC,IAAYN,IAAeC,IAAUC,GAErCK,IAAcC,GACf,MAAqD;EAElD,IADAC,IAAUC,CAAK,GACXA,EAAM,kBAAkB;EAC5B,IAAMC,IAAO,CAACL;EAEd,AADKN,KAAcG,EAAmBQ,CAAI,GAC1CC,IAAkBD,CAAI;CAC1B,GACA;EAACL;EAAWN;EAAcS;EAASG;CAAe,CACtD;CAEA,OACI,kBAAC,UAAD;EACS;EACL,MAAK;EACL,gBAAcN;EACJ;EACV,cAAYA,IAAY,OAAO;EAC/B,WAAWO,EACPlB,EAAO,QACPA,EAAOmB,IACPnB,EAAOoB,IACPT,KAAaX,EAAO,SACpBqB,CACJ;EACA,SAAST;EACT,GAAIR;EAEH;CACG,CAAA;AAEhB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Toggle.module.cjs","names":[],"sources":["../../../src/components/Toggle/Toggle.module.css"],"sourcesContent":[".toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-medium);\n    line-height: var(--tempest-leading-snug);\n    cursor: pointer;\n    transition:\n        var(--tempest-transition-color),\n        background-color var(--tempest-duration-base) var(--tempest-ease-emphasized);\n    white-space: nowrap;\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .toggle:hover {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.toggle:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n.toggle:disabled {\n    opacity: 0.55;\n    cursor: not-allowed;\n}\n\n.outline {\n    background-color: transparent;\n    border-color: var(--tempest-border);\n}\n\n.pressed {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    border-color: var(--tempest-primary-soft);\n}\n\n.outline.pressed {\n    border-color: var(--tempest-primary);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .pressed:hover {\n        background-color: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n    }\n}\n\n.sm {\n    min-height: 1.75rem;\n    padding: 0 var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    min-height: 2.25rem;\n    padding: 0 var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n.lg {\n    min-height: 2.75rem;\n    padding: 0 var(--tempest-space-4);\n    font-size: var(--tempest-text-base);\n}\n"],"mappings":";"}
+{"version":3,"file":"Toggle.module.cjs","names":["toggle","outline","pressed","sm","md","lg","Toggle_module_default"],"sources":["../../../src/components/Toggle/Toggle.module.css"],"sourcesContent":[".toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-medium);\n    line-height: var(--tempest-leading-snug);\n    cursor: pointer;\n    transition:\n        var(--tempest-transition-color),\n        background-color var(--tempest-duration-base) var(--tempest-ease-emphasized);\n    white-space: nowrap;\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .toggle:hover {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.toggle:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n.toggle:disabled {\n    opacity: 0.55;\n    cursor: not-allowed;\n}\n\n.outline {\n    background-color: transparent;\n    border-color: var(--tempest-border);\n}\n\n.pressed {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    border-color: var(--tempest-primary-soft);\n}\n\n.outline.pressed {\n    border-color: var(--tempest-primary);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .pressed:hover {\n        background-color: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n    }\n}\n\n.sm {\n    min-height: 1.75rem;\n    padding: 0 var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    min-height: 2.25rem;\n    padding: 0 var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n.lg {\n    min-height: 2.75rem;\n    padding: 0 var(--tempest-space-4);\n    font-size: var(--tempest-text-base);\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"Toggle.module.js","names":[],"sources":["../../../src/components/Toggle/Toggle.module.css"],"sourcesContent":[".toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-medium);\n    line-height: var(--tempest-leading-snug);\n    cursor: pointer;\n    transition:\n        var(--tempest-transition-color),\n        background-color var(--tempest-duration-base) var(--tempest-ease-emphasized);\n    white-space: nowrap;\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .toggle:hover {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.toggle:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n.toggle:disabled {\n    opacity: 0.55;\n    cursor: not-allowed;\n}\n\n.outline {\n    background-color: transparent;\n    border-color: var(--tempest-border);\n}\n\n.pressed {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    border-color: var(--tempest-primary-soft);\n}\n\n.outline.pressed {\n    border-color: var(--tempest-primary);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .pressed:hover {\n        background-color: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n    }\n}\n\n.sm {\n    min-height: 1.75rem;\n    padding: 0 var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    min-height: 2.25rem;\n    padding: 0 var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n.lg {\n    min-height: 2.75rem;\n    padding: 0 var(--tempest-space-4);\n    font-size: var(--tempest-text-base);\n}\n"],"mappings":";"}
+{"version":3,"file":"Toggle.module.js","names":["toggle","outline","pressed","sm","md","lg","Toggle_module_default"],"sources":["../../../src/components/Toggle/Toggle.module.css"],"sourcesContent":[".toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--tempest-space-2);\n    border: 1px solid transparent;\n    border-radius: var(--tempest-radius-md);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-weight: var(--tempest-weight-medium);\n    line-height: var(--tempest-leading-snug);\n    cursor: pointer;\n    transition:\n        var(--tempest-transition-color),\n        background-color var(--tempest-duration-base) var(--tempest-ease-emphasized);\n    white-space: nowrap;\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .toggle:hover {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.toggle:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: 2px;\n}\n\n.toggle:disabled {\n    opacity: 0.55;\n    cursor: not-allowed;\n}\n\n.outline {\n    background-color: transparent;\n    border-color: var(--tempest-border);\n}\n\n.pressed {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    border-color: var(--tempest-primary-soft);\n}\n\n.outline.pressed {\n    border-color: var(--tempest-primary);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .pressed:hover {\n        background-color: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n    }\n}\n\n.sm {\n    min-height: 1.75rem;\n    padding: 0 var(--tempest-space-2);\n    font-size: var(--tempest-text-xs);\n}\n\n.md {\n    min-height: 2.25rem;\n    padding: 0 var(--tempest-space-3);\n    font-size: var(--tempest-text-sm);\n}\n\n.lg {\n    min-height: 2.75rem;\n    padding: 0 var(--tempest-space-4);\n    font-size: var(--tempest-text-base);\n}\n"],"mappings":";"}

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,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"}
+{"version":3,"file":"ToggleGroup.cjs","names":["createContext","useContext","useState","useCallback","useMemo","cn","styles","require_cn","require_ToggleGroup_module","react","react_jsx_runtime","ToggleGroupContext","useToggleGroupContext","ctx","normalizeArray","value","ToggleGroup","props","isControlled","internalValue","setInternalValue","defaultValue","selected","commit","next","onValueChange","type","toggle","isOn","itemValue","v","className","ToggleGroupItem","isSelected"],"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":"A,kIAaA,IAAMW,GAAA,EAAqBX,EAAAA,cAAAA,CAA8C,IAAI,EAE7E,SAASY,GAAiD,CACtD,IAAMC,GAAA,EAAMZ,EAAAA,WAAAA,CAAWU,CAAkB,EACzC,GAAI,CAACE,EACD,MAAU,MAAM,mDAAmD,EAEvE,OAAOA,CACX,CAcA,SAASC,EAAe,EAAgD,CAEpE,OADIC,IAAU,IAAA,GAAkB,CAAC,EAC1B,MAAM,QAAQA,CAAK,EAAIA,EAAQ,CAACA,CAAK,CAChD,CAYA,SAAgBC,EAAY,CACxB,OAAO,SACP,QACA,eACA,gBACA,YACA,WACA,GAAGC,GACc,CACjB,IAAMC,EAAeH,IAAU,IAAA,GACzB,CAACI,EAAeC,IAAA,EAAoBlB,EAAAA,SAAAA,KACtCY,EAAeO,CAAY,CAC/B,EACMC,EAAWJ,EAAeJ,EAAeC,CAAK,EAAII,EAElDI,GAAA,EAASpB,EAAAA,YAAAA,CACV,GAAyB,CACjBe,GAAcE,EAAiBI,CAAI,EACxCC,IAAgBC,IAAS,SAAYF,EAAK,IAAM,GAAMA,CAAI,CAC9D,EACA,CAACN,EAAcO,EAAeC,CAAI,CACtC,EAEMC,GAAA,EAASxB,EAAAA,YAAAA,CACV,GAA4B,CACzB,IAAMyB,EAAON,EAAS,SAASO,CAAS,EAEpCN,EADAG,IAAS,SACFE,EAAO,CAAC,EAAI,CAACC,CAAS,EAEtBD,EAAON,EAAS,OAAQ,GAAMQ,IAAMD,CAAS,EAAI,CAAC,GAAGP,EAAUO,CAAS,CAAC,CAExF,EACA,CAACP,EAAUI,EAAMH,CAAM,CAC3B,EAEMV,GAAA,EAAMT,EAAAA,QAAAA,MACD,CACH,OACA,WAAa,GAAsBkB,EAAS,SAASO,CAAS,EAC9D,QACJ,GACA,CAACH,EAAMJ,EAAUK,CAAM,CAC3B,EAEA,OACI,EAAAjB,EAAA,IAAA,CAACC,EAAmB,SAApB,CAA6B,MAAOE,EAChC,UAAA,EAAAH,EAAA,IAAA,CAAC,MAAD,CAAK,KAAK,QAAQ,UAAWL,EAAAA,GAAGC,EAAAA,QAAO,MAAOyB,CAAS,EAAG,GAAId,EACzD,UACA,CAAA,CACoB,CAAA,CAErC,CAoBA,SAAgBe,EAAgB,CAC5B,QACA,WACA,YACA,WACA,GAAGf,GACkB,CACrB,GAAM,CAAE,aAAY,UAAWL,EAAsB,EAC/CU,EAAWW,EAAWlB,CAAK,EAEjC,OACI,EAAAL,EAAA,IAAA,CAAC,SAAD,CACI,KAAK,SACL,KAAK,SACL,eAAcY,EACJ,WACV,aAAYA,EAAW,KAAO,MAC9B,UAAWjB,EAAAA,GAAGC,EAAAA,QAAO,KAAMgB,GAAYhB,EAAAA,QAAO,SAAUyB,CAAS,EACjE,YAAeJ,EAAOZ,CAAK,EAC3B,GAAIE,EAEH,UACG,CAAA,CAEhB,C"}

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;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"}
+{"version":3,"file":"ToggleGroup.js","names":["styles","ToggleGroup_module_default","ToggleGroupContext","createContext","useToggleGroupContext","ctx","useContext","normalizeArray","value","ToggleGroup","props","isControlled","internalValue","setInternalValue","useState","defaultValue","selected","commit","useCallback","next","onValueChange","type","toggle","isOn","itemValue","v","useMemo","cn","className","ToggleGroupItem","isSelected"],"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,IAAME,IAAqBC,EAA8C,IAAI;AAE7E,SAASC,IAAiD;CACtD,IAAMC,IAAMC,EAAWJ,CAAkB;CACzC,IAAI,CAACG,GACD,MAAU,MAAM,mDAAmD;CAEvE,OAAOA;AACX;AAcA,SAASE,EAAe,GAAgD;CAEpE,OADIC,MAAU,KAAA,IAAkB,CAAC,IAC1B,MAAM,QAAQA,CAAK,IAAIA,IAAQ,CAACA,CAAK;AAChD;AAYA,SAAgBC,EAAY,EACxB,UAAO,UACP,UACA,iBACA,kBACA,cACA,aACA,GAAGC,KACc;CACjB,IAAMC,IAAeH,MAAU,KAAA,GACzB,CAACI,GAAeC,KAAoBC,QACtCP,EAAeQ,CAAY,CAC/B,GACMC,IAAWL,IAAeJ,EAAeC,CAAK,IAAII,GAElDK,IAASC,GACV,MAAyB;EAEtB,AADKP,KAAcE,EAAiBM,CAAI,GACxCC,IAAgBC,MAAS,WAAYF,EAAK,MAAM,KAAMA,CAAI;CAC9D,GACA;EAACR;EAAcS;EAAeC;CAAI,CACtC,GAEMC,IAASJ,GACV,MAA4B;EACzB,IAAMK,IAAOP,EAAS,SAASQ,CAAS;EACxC,AACIP,EADAI,MAAS,WACFE,IAAO,CAAC,IAAI,CAACC,CAAS,IAEtBD,IAAOP,EAAS,QAAQ,MAAMS,MAAMD,CAAS,IAAI,CAAC,GAAGR,GAAUQ,CAAS,CAAC;CAExF,GACA;EAACR;EAAUK;EAAMJ;CAAM,CAC3B,GAEMZ,IAAMqB,SACD;EACH;EACA,aAAa,MAAsBV,EAAS,SAASQ,CAAS;EAC9D;CACJ,IACA;EAACH;EAAML;EAAUM;CAAM,CAC3B;CAEA,OACI,kBAACpB,EAAmB,UAApB;EAA6B,OAAOG;EAChC,UAAA,kBAAC,OAAD;GAAK,MAAK;GAAQ,WAAWsB,EAAG3B,EAAO,OAAO4B,CAAS;GAAG,GAAIlB;GACzD;EACA,CAAA;CACoB,CAAA;AAErC;AAoBA,SAAgBmB,EAAgB,EAC5B,UACA,aACA,cACA,aACA,GAAGnB,KACkB;CACrB,IAAM,EAAE,eAAY,cAAWN,EAAsB,GAC/CY,IAAWc,EAAWtB,CAAK;CAEjC,OACI,kBAAC,UAAD;EACI,MAAK;EACL,MAAK;EACL,gBAAcQ;EACJ;EACV,cAAYA,IAAW,OAAO;EAC9B,WAAWW,EAAG3B,EAAO,MAAMgB,KAAYhB,EAAO,UAAU4B,CAAS;EACjE,eAAeN,EAAOd,CAAK;EAC3B,GAAIE;EAEH;CACG,CAAA;AAEhB"}

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

@@ -1 +1 @@
-{"version":3,"file":"ToggleGroup.module.cjs","names":[],"sources":["../../../src/components/ToggleGroup/ToggleGroup.module.css"],"sourcesContent":[".group {\n    display: inline-flex;\n    align-items: stretch;\n    gap: 0;\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-md);\n    overflow: hidden;\n}\n\n.item {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--tempest-space-2);\n    min-height: 2.25rem;\n    padding: 0 var(--tempest-space-3);\n    border: none;\n    border-left: 1px solid var(--tempest-border);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-medium);\n    line-height: var(--tempest-leading-snug);\n    cursor: pointer;\n    transition:\n        var(--tempest-transition-color),\n        background-color var(--tempest-duration-base) var(--tempest-ease-emphasized);\n    white-space: nowrap;\n}\n\n.item:first-child {\n    border-left: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .item:hover {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.item:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: -2px;\n    z-index: 1;\n}\n\n.item:disabled {\n    opacity: 0.55;\n    cursor: not-allowed;\n}\n\n.selected {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .selected:hover {\n        background-color: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n    }\n}\n"],"mappings":";"}
+{"version":3,"file":"ToggleGroup.module.cjs","names":["group","item","selected","ToggleGroup_module_default"],"sources":["../../../src/components/ToggleGroup/ToggleGroup.module.css"],"sourcesContent":[".group {\n    display: inline-flex;\n    align-items: stretch;\n    gap: 0;\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-md);\n    overflow: hidden;\n}\n\n.item {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: var(--tempest-space-2);\n    min-height: 2.25rem;\n    padding: 0 var(--tempest-space-3);\n    border: none;\n    border-left: 1px solid var(--tempest-border);\n    background-color: var(--tempest-surface);\n    color: var(--tempest-text);\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-medium);\n    line-height: var(--tempest-leading-snug);\n    cursor: pointer;\n    transition:\n        var(--tempest-transition-color),\n        background-color var(--tempest-duration-base) var(--tempest-ease-emphasized);\n    white-space: nowrap;\n}\n\n.item:first-child {\n    border-left: none;\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .item:hover {\n        background-color: var(--tempest-surface-2);\n    }\n}\n\n.item:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: -2px;\n    z-index: 1;\n}\n\n.item:disabled {\n    opacity: 0.55;\n    cursor: not-allowed;\n}\n\n.selected {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .selected:hover {\n        background-color: var(--tempest-primary-soft-hover, var(--tempest-primary-soft));\n    }\n}\n"],"mappings":";"}