tempest-react-sdk 0.77.0 → 0.79.0

package/dist/components/MultiSelect/MultiSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.js","names":[],"sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — options/value/onChange\n * plus the shared field contract, the knobs that make it multi (maxItems, filter,\n * emptyMessage) and portal. The body is the listbox with chip removal, type-ahead and\n * the ARIA active-descendant wiring reading one active index.\n */\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\";\nimport { Portal } from \"@/components/Portal\";\nimport { useAnchorPosition } from \"@/components/Portal/anchor-position\";\nimport { useListboxDismiss } from \"@/components/Combobox/use-listbox-dismiss\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./MultiSelect.module.css\";\n\nexport interface MultiSelectOption {\n    value: string;\n    label: string;\n    disabled?: boolean;\n}\n\nexport interface MultiSelectProps {\n    options: MultiSelectOption[];\n    /** Currently selected values. */\n    value: string[];\n    onChange: (value: string[]) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    disabled?: boolean;\n    /** Cap the number of selectable items. */\n    maxItems?: number;\n    /** Custom filter — return true to keep the option. Default: case-insensitive substring on label. */\n    filter?: (option: MultiSelectOption, query: string) => boolean;\n    /** Message shown when no option matches. */\n    emptyMessage?: string;\n    /**\n     * Render the list in a portal, positioned under the field. Default `true`.\n     *\n     * In flow, an ancestor with `overflow` other than `visible` clips the list —\n     * in the last row of a `DataTable` none of it was visible (measured in Chrome\n     * at 1440 px). In a portal it escapes the clip, takes the field's width,\n     * flips above the field when there is no room below, and follows it on\n     * scroll, resize and when the field grows a line of chips.\n     */\n    portal?: boolean;\n    className?: string;\n}\n\nfunction defaultFilter(option: MultiSelectOption, query: string): boolean {\n    if (!query) return true;\n    return option.label.toLowerCase().includes(query.toLowerCase());\n}\n\n/** Gap between field and list, in px — the in-flow CSS uses the same 4 px. */\nconst LIST_OFFSET = 4;\n\n/**\n * MultiSelect — a filterable dropdown that selects many options, shown as\n * removable chips inside the field. Selecting toggles a value; Backspace on an\n * empty query removes the last chip.\n *\n * Keyboard: ArrowUp/ArrowDown navigate — the active option is announced through\n * `aria-activedescendant`, focus stays on the input — Enter toggles the active\n * option, Esc closes, Backspace (empty input) pops the last chip, and\n * Tab/Shift+Tab leave the field closing the list.\n */\nexport function MultiSelect({\n    options,\n    value,\n    onChange,\n    label,\n    placeholder = \"Selecione\",\n    helperText,\n    error,\n    disabled,\n    maxItems,\n    filter = defaultFilter,\n    emptyMessage = \"Nenhuma opção encontrada\",\n    portal = true,\n    className,\n}: MultiSelectProps) {\n    const id = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const [open, setOpen] = useState(false);\n    const [query, setQuery] = useState(\"\");\n    const [activeIndex, setActiveIndex] = useState(0);\n    const [fieldNode, setFieldNode] = useState<HTMLDivElement | null>(null);\n    const [listNode, setListNode] = useState<HTMLUListElement | null>(null);\n    const floatingStyle = useAnchorPosition({\n        anchor: fieldNode,\n        floating: listNode,\n        side: \"bottom\",\n        align: \"start\",\n        offset: LIST_OFFSET,\n        enabled: portal && open,\n        matchWidth: true,\n    });\n\n    const selectedSet = useMemo(() => new Set(value), [value]);\n    const selectedOptions = useMemo(\n        () =>\n            value\n                .map((v) => options.find((o) => o.value === v))\n                .filter((o): o is MultiSelectOption => Boolean(o)),\n        [value, options],\n    );\n    const filtered = useMemo(\n        () => options.filter((o) => filter(o, query)),\n        [options, filter, query],\n    );\n\n    const atMax = maxItems !== undefined && value.length >= maxItems;\n\n    const toggle = useCallback(\n        (option: MultiSelectOption): void => {\n            if (option.disabled) return;\n            if (selectedSet.has(option.value)) {\n                onChange(value.filter((v) => v !== option.value));\n            } else {\n                if (atMax) return;\n                onChange([...value, option.value]);\n            }\n            setQuery(\"\");\n            inputRef.current?.focus();\n        },\n        [selectedSet, onChange, value, atMax],\n    );\n\n    const removeAt = useCallback(\n        (optionValue: string): void => {\n            onChange(value.filter((v) => v !== optionValue));\n        },\n        [onChange, value],\n    );\n\n    const close = useCallback((): void => {\n        setOpen(false);\n        setQuery(\"\");\n    }, []);\n\n    const { onInputBlur, onListMouseDown } = useListboxDismiss({\n        open,\n        rootRef,\n        listNode,\n        onDismiss: close,\n    });\n    const optionId = (index: number): string => `${id}-option-${index}`;\n    const activeOption = open ? filtered[activeIndex] : undefined;\n\n    /**\n     * Open the list and keep focus on the input when the empty part of the field\n     * is pressed.\n     *\n     * Only a press on the field itself counts: a press on a chip or on its remove\n     * button has its own handler, and the input focuses itself.\n     */\n    const handleFieldMouseDown = (event: React.MouseEvent<HTMLDivElement>): void => {\n        if (disabled || event.target !== event.currentTarget) return;\n        event.preventDefault();\n        inputRef.current?.focus();\n        setOpen(true);\n    };\n\n    /**\n     * Keyboard model of the input.\n     *\n     * `Escape` calls `preventDefault()` only while the list is open: that marks the\n     * key as consumed, so an enclosing `Modal` or `Drawer` stays open and the next\n     * `Escape` reaches it. With the list closed the key is left alone and dismisses\n     * the enclosing layer, as the user expects.\n     */\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            setOpen(true);\n            setActiveIndex((current) => Math.min(filtered.length - 1, current + 1));\n        } else if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            setActiveIndex((current) => Math.max(0, current - 1));\n        } else if (event.key === \"Enter\") {\n            event.preventDefault();\n            const option = filtered[activeIndex];\n            if (option) toggle(option);\n        } else if (event.key === \"Escape\") {\n            if (open) event.preventDefault();\n            close();\n        } else if (event.key === \"Backspace\" && query === \"\" && value.length > 0) {\n            removeAt(value[value.length - 1]);\n        }\n    };\n\n    const list = (\n        <ul\n            ref={setListNode}\n            id={`${id}-listbox`}\n            role=\"listbox\"\n            aria-multiselectable\n            className={cn(styles.menu, portal && styles.portalled)}\n            style={floatingStyle}\n            onMouseDown={onListMouseDown}\n        >\n            {filtered.length === 0 ? (\n                <li className={styles.empty}>{emptyMessage}</li>\n            ) : (\n                filtered.map((option, index) => {\n                    const isSelected = selectedSet.has(option.value);\n                    return (\n                        <li\n                            key={option.value}\n                            id={optionId(index)}\n                            role=\"option\"\n                            aria-selected={isSelected}\n                            aria-disabled={option.disabled || (!isSelected && atMax)}\n                            className={cn(\n                                styles.option,\n                                index === activeIndex && styles.active,\n                                isSelected && styles.selected,\n                            )}\n                            onMouseEnter={() => setActiveIndex(index)}\n                            onMouseDown={() => toggle(option)}\n                        >\n                            <span className={styles.check} aria-hidden>\n                                {isSelected ? \"✓\" : \"\"}\n                            </span>\n                            {option.label}\n                        </li>\n                    );\n                })\n            )}\n        </ul>\n    );\n\n    return (\n        <div ref={rootRef} className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={id} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div\n                ref={setFieldNode}\n                className={cn(styles.field, disabled && styles.disabled)}\n                onMouseDown={handleFieldMouseDown}\n            >\n                {selectedOptions.map((option) => (\n                    <span key={option.value} className={styles.chip}>\n                        {option.label}\n                        <button\n                            type=\"button\"\n                            className={styles.chipRemove}\n                            aria-label={`Remover ${option.label}`}\n                            disabled={disabled}\n                            onMouseDown={(event) => {\n                                event.preventDefault();\n                                removeAt(option.value);\n                            }}\n                        >\n                            ×\n                        </button>\n                    </span>\n                ))}\n                <input\n                    id={id}\n                    ref={inputRef}\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-expanded={open}\n                    aria-controls={`${id}-listbox`}\n                    aria-autocomplete=\"list\"\n                    aria-activedescendant={activeOption ? optionId(activeIndex) : undefined}\n                    className={styles.input}\n                    placeholder={value.length === 0 ? placeholder : \"\"}\n                    disabled={disabled}\n                    value={query}\n                    onFocus={() => setOpen(true)}\n                    onChange={(event) => {\n                        setQuery(event.target.value);\n                        setOpen(true);\n                        setActiveIndex(0);\n                    }}\n                    onKeyDown={handleKeyDown}\n                    onBlur={onInputBlur}\n                />\n            </div>\n            {open && (portal ? <Portal>{list}</Portal> : list)}\n            {error ? (\n                <span className={styles.errorText}>{error}</span>\n            ) : helperText ? (\n                <span className={styles.helper}>{helperText}</span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"MultiSelect.js","names":["styles","MultiSelect_module_default","defaultFilter","query","option","LIST_OFFSET","MultiSelect","id","useId","rootRef","useRef","inputRef","open","setOpen","useState","setQuery","activeIndex","setActiveIndex","fieldNode","setFieldNode","listNode","setListNode","floatingStyle","useAnchorPosition","portal","selectedSet","useMemo","value","selectedOptions","options","o","v","filtered","filter","atMax","maxItems","toggle","useCallback","onChange","removeAt","optionValue","close","useListboxDismiss","optionId","index","activeOption","handleFieldMouseDown","disabled","event","handleKeyDown","current","list","cn","onListMouseDown","emptyMessage","isSelected","error","className","label","placeholder","onInputBlur","Portal","helperText"],"sources":["../../../src/components/MultiSelect/MultiSelect.tsx"],"sourcesContent":["/**\n * @tempest-limits file-lines, props-count, function-lines — options/value/onChange\n * plus the shared field contract, the knobs that make it multi (maxItems, filter,\n * emptyMessage) and portal. The body is the listbox with chip removal, type-ahead and\n * the ARIA active-descendant wiring reading one active index.\n */\nimport { useCallback, useId, useMemo, useRef, useState } from \"react\";\nimport { Portal } from \"@/components/Portal\";\nimport { useAnchorPosition } from \"@/components/Portal/anchor-position\";\nimport { useListboxDismiss } from \"@/components/Combobox/use-listbox-dismiss\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./MultiSelect.module.css\";\n\nexport interface MultiSelectOption {\n    value: string;\n    label: string;\n    disabled?: boolean;\n}\n\nexport interface MultiSelectProps {\n    options: MultiSelectOption[];\n    /** Currently selected values. */\n    value: string[];\n    onChange: (value: string[]) => void;\n    label?: string;\n    placeholder?: string;\n    helperText?: string;\n    error?: string;\n    disabled?: boolean;\n    /** Cap the number of selectable items. */\n    maxItems?: number;\n    /** Custom filter — return true to keep the option. Default: case-insensitive substring on label. */\n    filter?: (option: MultiSelectOption, query: string) => boolean;\n    /** Message shown when no option matches. */\n    emptyMessage?: string;\n    /**\n     * Render the list in a portal, positioned under the field. Default `true`.\n     *\n     * In flow, an ancestor with `overflow` other than `visible` clips the list —\n     * in the last row of a `DataTable` none of it was visible (measured in Chrome\n     * at 1440 px). In a portal it escapes the clip, takes the field's width,\n     * flips above the field when there is no room below, and follows it on\n     * scroll, resize and when the field grows a line of chips.\n     */\n    portal?: boolean;\n    className?: string;\n}\n\nfunction defaultFilter(option: MultiSelectOption, query: string): boolean {\n    if (!query) return true;\n    return option.label.toLowerCase().includes(query.toLowerCase());\n}\n\n/** Gap between field and list, in px — the in-flow CSS uses the same 4 px. */\nconst LIST_OFFSET = 4;\n\n/**\n * MultiSelect — a filterable dropdown that selects many options, shown as\n * removable chips inside the field. Selecting toggles a value; Backspace on an\n * empty query removes the last chip.\n *\n * Keyboard: ArrowUp/ArrowDown navigate — the active option is announced through\n * `aria-activedescendant`, focus stays on the input — Enter toggles the active\n * option, Esc closes, Backspace (empty input) pops the last chip, and\n * Tab/Shift+Tab leave the field closing the list.\n */\nexport function MultiSelect({\n    options,\n    value,\n    onChange,\n    label,\n    placeholder = \"Selecione\",\n    helperText,\n    error,\n    disabled,\n    maxItems,\n    filter = defaultFilter,\n    emptyMessage = \"Nenhuma opção encontrada\",\n    portal = true,\n    className,\n}: MultiSelectProps) {\n    const id = useId();\n    const rootRef = useRef<HTMLDivElement>(null);\n    const inputRef = useRef<HTMLInputElement>(null);\n    const [open, setOpen] = useState(false);\n    const [query, setQuery] = useState(\"\");\n    const [activeIndex, setActiveIndex] = useState(0);\n    const [fieldNode, setFieldNode] = useState<HTMLDivElement | null>(null);\n    const [listNode, setListNode] = useState<HTMLUListElement | null>(null);\n    const floatingStyle = useAnchorPosition({\n        anchor: fieldNode,\n        floating: listNode,\n        side: \"bottom\",\n        align: \"start\",\n        offset: LIST_OFFSET,\n        enabled: portal && open,\n        matchWidth: true,\n    });\n\n    const selectedSet = useMemo(() => new Set(value), [value]);\n    const selectedOptions = useMemo(\n        () =>\n            value\n                .map((v) => options.find((o) => o.value === v))\n                .filter((o): o is MultiSelectOption => Boolean(o)),\n        [value, options],\n    );\n    const filtered = useMemo(\n        () => options.filter((o) => filter(o, query)),\n        [options, filter, query],\n    );\n\n    const atMax = maxItems !== undefined && value.length >= maxItems;\n\n    const toggle = useCallback(\n        (option: MultiSelectOption): void => {\n            if (option.disabled) return;\n            if (selectedSet.has(option.value)) {\n                onChange(value.filter((v) => v !== option.value));\n            } else {\n                if (atMax) return;\n                onChange([...value, option.value]);\n            }\n            setQuery(\"\");\n            inputRef.current?.focus();\n        },\n        [selectedSet, onChange, value, atMax],\n    );\n\n    const removeAt = useCallback(\n        (optionValue: string): void => {\n            onChange(value.filter((v) => v !== optionValue));\n        },\n        [onChange, value],\n    );\n\n    const close = useCallback((): void => {\n        setOpen(false);\n        setQuery(\"\");\n    }, []);\n\n    const { onInputBlur, onListMouseDown } = useListboxDismiss({\n        open,\n        rootRef,\n        listNode,\n        onDismiss: close,\n    });\n    const optionId = (index: number): string => `${id}-option-${index}`;\n    const activeOption = open ? filtered[activeIndex] : undefined;\n\n    /**\n     * Open the list and keep focus on the input when the empty part of the field\n     * is pressed.\n     *\n     * Only a press on the field itself counts: a press on a chip or on its remove\n     * button has its own handler, and the input focuses itself.\n     */\n    const handleFieldMouseDown = (event: React.MouseEvent<HTMLDivElement>): void => {\n        if (disabled || event.target !== event.currentTarget) return;\n        event.preventDefault();\n        inputRef.current?.focus();\n        setOpen(true);\n    };\n\n    /**\n     * Keyboard model of the input.\n     *\n     * `Escape` calls `preventDefault()` only while the list is open: that marks the\n     * key as consumed, so an enclosing `Modal` or `Drawer` stays open and the next\n     * `Escape` reaches it. With the list closed the key is left alone and dismisses\n     * the enclosing layer, as the user expects.\n     */\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        if (event.key === \"ArrowDown\") {\n            event.preventDefault();\n            setOpen(true);\n            setActiveIndex((current) => Math.min(filtered.length - 1, current + 1));\n        } else if (event.key === \"ArrowUp\") {\n            event.preventDefault();\n            setActiveIndex((current) => Math.max(0, current - 1));\n        } else if (event.key === \"Enter\") {\n            event.preventDefault();\n            const option = filtered[activeIndex];\n            if (option) toggle(option);\n        } else if (event.key === \"Escape\") {\n            if (open) event.preventDefault();\n            close();\n        } else if (event.key === \"Backspace\" && query === \"\" && value.length > 0) {\n            removeAt(value[value.length - 1]);\n        }\n    };\n\n    const list = (\n        <ul\n            ref={setListNode}\n            id={`${id}-listbox`}\n            role=\"listbox\"\n            aria-multiselectable\n            className={cn(styles.menu, portal && styles.portalled)}\n            style={floatingStyle}\n            onMouseDown={onListMouseDown}\n        >\n            {filtered.length === 0 ? (\n                <li className={styles.empty}>{emptyMessage}</li>\n            ) : (\n                filtered.map((option, index) => {\n                    const isSelected = selectedSet.has(option.value);\n                    return (\n                        <li\n                            key={option.value}\n                            id={optionId(index)}\n                            role=\"option\"\n                            aria-selected={isSelected}\n                            aria-disabled={option.disabled || (!isSelected && atMax)}\n                            className={cn(\n                                styles.option,\n                                index === activeIndex && styles.active,\n                                isSelected && styles.selected,\n                            )}\n                            onMouseEnter={() => setActiveIndex(index)}\n                            onMouseDown={() => toggle(option)}\n                        >\n                            <span className={styles.check} aria-hidden>\n                                {isSelected ? \"✓\" : \"\"}\n                            </span>\n                            {option.label}\n                        </li>\n                    );\n                })\n            )}\n        </ul>\n    );\n\n    return (\n        <div ref={rootRef} className={cn(styles.wrapper, error && styles.error, className)}>\n            {label && (\n                <label htmlFor={id} className={styles.label}>\n                    {label}\n                </label>\n            )}\n            <div\n                ref={setFieldNode}\n                className={cn(styles.field, disabled && styles.disabled)}\n                onMouseDown={handleFieldMouseDown}\n            >\n                {selectedOptions.map((option) => (\n                    <span key={option.value} className={styles.chip}>\n                        {option.label}\n                        <button\n                            type=\"button\"\n                            className={styles.chipRemove}\n                            aria-label={`Remover ${option.label}`}\n                            disabled={disabled}\n                            onMouseDown={(event) => {\n                                event.preventDefault();\n                                removeAt(option.value);\n                            }}\n                        >\n                            ×\n                        </button>\n                    </span>\n                ))}\n                <input\n                    id={id}\n                    ref={inputRef}\n                    type=\"text\"\n                    role=\"combobox\"\n                    aria-expanded={open}\n                    aria-controls={`${id}-listbox`}\n                    aria-autocomplete=\"list\"\n                    aria-activedescendant={activeOption ? optionId(activeIndex) : undefined}\n                    className={styles.input}\n                    placeholder={value.length === 0 ? placeholder : \"\"}\n                    disabled={disabled}\n                    value={query}\n                    onFocus={() => setOpen(true)}\n                    onChange={(event) => {\n                        setQuery(event.target.value);\n                        setOpen(true);\n                        setActiveIndex(0);\n                    }}\n                    onKeyDown={handleKeyDown}\n                    onBlur={onInputBlur}\n                />\n            </div>\n            {open && (portal ? <Portal>{list}</Portal> : list)}\n            {error ? (\n                <span className={styles.errorText}>{error}</span>\n            ) : helperText ? (\n                <span className={styles.helper}>{helperText}</span>\n            ) : null}\n        </div>\n    );\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.module.cjs","names":[],"sources":["../../../src/components/MultiSelect/MultiSelect.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    position: relative;\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n}\n\n.field {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    min-height: var(--tempest-control-height-md);\n    padding: 4px var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-control-radius);\n    background-color: var(--tempest-bg);\n    box-shadow: var(--tempest-shadow-xs);\n    cursor: text;\n    transition: var(--tempest-transition-color), var(--tempest-transition-shadow);\n}\n\n.field:focus-within {\n    border-color: var(--tempest-primary);\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.field.disabled {\n    background-color: var(--tempest-surface);\n    cursor: not-allowed;\n}\n\n.chip {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 4px 2px 8px;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    line-height: 1.4;\n}\n\n.chipRemove {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    border: none;\n    border-radius: 50%;\n    background: transparent;\n    color: inherit;\n    font-size: 14px;\n    line-height: 1;\n    cursor: pointer;\n}\n\n.chipRemove:hover {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.input {\n    flex: 1;\n    min-width: 80px;\n    border: none;\n    outline: none;\n    background: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-control-font-md);\n    height: 24px;\n}\n\n.input::placeholder {\n    color: var(--tempest-text-subtle);\n}\n\n.menu {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    right: 0;\n    z-index: var(--tempest-z-dropdown);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    max-height: 280px;\n    overflow-y: auto;\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n}\n\n.option {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border-radius: var(--tempest-radius-sm);\n    cursor: pointer;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-base);\n    line-height: var(--tempest-leading-snug);\n}\n\n.check {\n    display: inline-flex;\n    width: 16px;\n    justify-content: center;\n    color: var(--tempest-primary);\n    font-weight: var(--tempest-weight-bold);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .option:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.option.active {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n.option.selected {\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.empty {\n    padding: var(--tempest-space-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    text-align: center;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.errorText {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-danger);\n}\n\n.wrapper.error .field {\n    border-color: var(--tempest-danger);\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    right: auto;\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}
+{"version":3,"file":"MultiSelect.module.cjs","names":["wrapper","label","field","disabled","chip","chipRemove","input","menu","option","check","active","selected","empty","helper","errorText","error","portalled","MultiSelect_module_default"],"sources":["../../../src/components/MultiSelect/MultiSelect.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    position: relative;\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n}\n\n.field {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    min-height: var(--tempest-control-height-md);\n    padding: 4px var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-control-radius);\n    background-color: var(--tempest-bg);\n    box-shadow: var(--tempest-shadow-xs);\n    cursor: text;\n    transition: var(--tempest-transition-color), var(--tempest-transition-shadow);\n}\n\n.field:focus-within {\n    border-color: var(--tempest-primary);\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.field.disabled {\n    background-color: var(--tempest-surface);\n    cursor: not-allowed;\n}\n\n.chip {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 4px 2px 8px;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    line-height: 1.4;\n}\n\n.chipRemove {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    border: none;\n    border-radius: 50%;\n    background: transparent;\n    color: inherit;\n    font-size: 14px;\n    line-height: 1;\n    cursor: pointer;\n}\n\n.chipRemove:hover {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.input {\n    flex: 1;\n    min-width: 80px;\n    border: none;\n    outline: none;\n    background: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-control-font-md);\n    height: 24px;\n}\n\n.input::placeholder {\n    color: var(--tempest-text-subtle);\n}\n\n.menu {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    right: 0;\n    z-index: var(--tempest-z-dropdown);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    max-height: 280px;\n    overflow-y: auto;\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n}\n\n.option {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border-radius: var(--tempest-radius-sm);\n    cursor: pointer;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-base);\n    line-height: var(--tempest-leading-snug);\n}\n\n.check {\n    display: inline-flex;\n    width: 16px;\n    justify-content: center;\n    color: var(--tempest-primary);\n    font-weight: var(--tempest-weight-bold);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .option:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.option.active {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n.option.selected {\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.empty {\n    padding: var(--tempest-space-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    text-align: center;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.errorText {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-danger);\n}\n\n.wrapper.error .field {\n    border-color: var(--tempest-danger);\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    right: auto;\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.module.js","names":[],"sources":["../../../src/components/MultiSelect/MultiSelect.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    position: relative;\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n}\n\n.field {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    min-height: var(--tempest-control-height-md);\n    padding: 4px var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-control-radius);\n    background-color: var(--tempest-bg);\n    box-shadow: var(--tempest-shadow-xs);\n    cursor: text;\n    transition: var(--tempest-transition-color), var(--tempest-transition-shadow);\n}\n\n.field:focus-within {\n    border-color: var(--tempest-primary);\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.field.disabled {\n    background-color: var(--tempest-surface);\n    cursor: not-allowed;\n}\n\n.chip {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 4px 2px 8px;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    line-height: 1.4;\n}\n\n.chipRemove {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    border: none;\n    border-radius: 50%;\n    background: transparent;\n    color: inherit;\n    font-size: 14px;\n    line-height: 1;\n    cursor: pointer;\n}\n\n.chipRemove:hover {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.input {\n    flex: 1;\n    min-width: 80px;\n    border: none;\n    outline: none;\n    background: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-control-font-md);\n    height: 24px;\n}\n\n.input::placeholder {\n    color: var(--tempest-text-subtle);\n}\n\n.menu {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    right: 0;\n    z-index: var(--tempest-z-dropdown);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    max-height: 280px;\n    overflow-y: auto;\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n}\n\n.option {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border-radius: var(--tempest-radius-sm);\n    cursor: pointer;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-base);\n    line-height: var(--tempest-leading-snug);\n}\n\n.check {\n    display: inline-flex;\n    width: 16px;\n    justify-content: center;\n    color: var(--tempest-primary);\n    font-weight: var(--tempest-weight-bold);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .option:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.option.active {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n.option.selected {\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.empty {\n    padding: var(--tempest-space-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    text-align: center;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.errorText {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-danger);\n}\n\n.wrapper.error .field {\n    border-color: var(--tempest-danger);\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    right: auto;\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}
+{"version":3,"file":"MultiSelect.module.js","names":["wrapper","label","field","disabled","chip","chipRemove","input","menu","option","check","active","selected","empty","helper","errorText","error","portalled","MultiSelect_module_default"],"sources":["../../../src/components/MultiSelect/MultiSelect.module.css"],"sourcesContent":[".wrapper {\n    display: flex;\n    flex-direction: column;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    position: relative;\n}\n\n.label {\n    font-size: var(--tempest-text-sm);\n    font-weight: var(--tempest-weight-semibold);\n    color: var(--tempest-text);\n    line-height: var(--tempest-leading-snug);\n}\n\n.field {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    min-height: var(--tempest-control-height-md);\n    padding: 4px var(--tempest-space-2);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-control-radius);\n    background-color: var(--tempest-bg);\n    box-shadow: var(--tempest-shadow-xs);\n    cursor: text;\n    transition: var(--tempest-transition-color), var(--tempest-transition-shadow);\n}\n\n.field:focus-within {\n    border-color: var(--tempest-primary);\n    box-shadow: 0 0 0 var(--tempest-focus-ring-width) var(--tempest-focus-ring-color);\n}\n\n.field.disabled {\n    background-color: var(--tempest-surface);\n    cursor: not-allowed;\n}\n\n.chip {\n    display: inline-flex;\n    align-items: center;\n    gap: 4px;\n    padding: 2px 4px 2px 8px;\n    border-radius: var(--tempest-radius-full);\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n    font-size: var(--tempest-text-xs);\n    font-weight: var(--tempest-weight-medium);\n    line-height: 1.4;\n}\n\n.chipRemove {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    border: none;\n    border-radius: 50%;\n    background: transparent;\n    color: inherit;\n    font-size: 14px;\n    line-height: 1;\n    cursor: pointer;\n}\n\n.chipRemove:hover {\n    background-color: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.input {\n    flex: 1;\n    min-width: 80px;\n    border: none;\n    outline: none;\n    background: transparent;\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: var(--tempest-control-font-md);\n    height: 24px;\n}\n\n.input::placeholder {\n    color: var(--tempest-text-subtle);\n}\n\n.menu {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    right: 0;\n    z-index: var(--tempest-z-dropdown);\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    max-height: 280px;\n    overflow-y: auto;\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n}\n\n.option {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border-radius: var(--tempest-radius-sm);\n    cursor: pointer;\n    color: var(--tempest-text);\n    font-size: var(--tempest-text-base);\n    line-height: var(--tempest-leading-snug);\n}\n\n.check {\n    display: inline-flex;\n    width: 16px;\n    justify-content: center;\n    color: var(--tempest-primary);\n    font-weight: var(--tempest-weight-bold);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .option:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.option.active {\n    background-color: var(--tempest-primary-soft);\n    color: var(--tempest-primary-on-soft);\n}\n\n.option.selected {\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.empty {\n    padding: var(--tempest-space-3);\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-sm);\n    text-align: center;\n}\n\n.helper {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n}\n\n.errorText {\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-danger);\n}\n\n.wrapper.error .field {\n    border-color: var(--tempest-danger);\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    right: auto;\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}

package/dist/components/NProgress/NProgress.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NProgress.cjs","names":[],"sources":["../../../src/components/NProgress/NProgress.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport type { CSSProperties } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NProgress.module.css\";\n\n/** Snapshot of the progress controller state delivered to subscribers. */\nexport interface NProgressState {\n    /** Current progress, `0` (empty) to `1` (complete). */\n    value: number;\n    /** Whether the bar should be visible. */\n    active: boolean;\n}\n\n/** Listener invoked whenever the progress state changes. */\nexport type NProgressListener = (state: NProgressState) => void;\n\n/** Imperative top-loading-bar controller. */\nexport interface NProgressController {\n    /** Show the bar and start trickling toward ~0.9. */\n    start: () => void;\n    /** Complete to `1`, then hide the bar shortly after. */\n    done: () => void;\n    /** Set the progress explicitly. Values are clamped to `0..1`. */\n    set: (n: number) => void;\n    /** Increment progress by `amount` (default a small trickle step). */\n    inc: (amount?: number) => void;\n    /** Subscribe to state changes. Returns an unsubscribe function. */\n    subscribe: (listener: NProgressListener) => () => void;\n}\n\nconst TRICKLE_INTERVAL_MS = 300;\nconst TRICKLE_CEILING = 0.9;\nconst DONE_HIDE_DELAY_MS = 300;\n\nfunction clamp(n: number): number {\n    if (n < 0) return 0;\n    if (n > 1) return 1;\n    return n;\n}\n\nfunction createNProgress(): NProgressController {\n    let state: NProgressState = { value: 0, active: false };\n    const listeners = new Set<NProgressListener>();\n    let trickleTimer: ReturnType<typeof setInterval> | null = null;\n    let hideTimer: ReturnType<typeof setTimeout> | null = null;\n\n    const emit = (): void => {\n        for (const listener of listeners) listener(state);\n    };\n\n    const update = (next: Partial<NProgressState>): void => {\n        state = { ...state, ...next };\n        emit();\n    };\n\n    const stopTrickle = (): void => {\n        if (trickleTimer !== null) {\n            clearInterval(trickleTimer);\n            trickleTimer = null;\n        }\n    };\n\n    const clearHide = (): void => {\n        if (hideTimer !== null) {\n            clearTimeout(hideTimer);\n            hideTimer = null;\n        }\n    };\n\n    const inc = (amount?: number): void => {\n        const current = state.value;\n        if (current >= TRICKLE_CEILING) return;\n        const step = amount ?? (1 - current) * 0.1 + 0.01;\n        update({ value: Math.min(clamp(current + step), TRICKLE_CEILING) });\n    };\n\n    const start = (): void => {\n        clearHide();\n        if (state.active) return;\n        update({ active: true, value: state.value > 0 ? state.value : 0.08 });\n        stopTrickle();\n        trickleTimer = setInterval(() => inc(), TRICKLE_INTERVAL_MS);\n    };\n\n    const done = (): void => {\n        stopTrickle();\n        clearHide();\n        update({ value: 1, active: true });\n        hideTimer = setTimeout(() => {\n            update({ active: false, value: 0 });\n            hideTimer = null;\n        }, DONE_HIDE_DELAY_MS);\n    };\n\n    const set = (n: number): void => {\n        clearHide();\n        const value = clamp(n);\n        update({ value, active: value < 1 ? true : state.active });\n    };\n\n    const subscribe = (listener: NProgressListener): (() => void) => {\n        listeners.add(listener);\n        listener(state);\n        return () => {\n            listeners.delete(listener);\n        };\n    };\n\n    return { start, done, set, inc, subscribe };\n}\n\n/**\n * Module-level singleton progress controller. Drive it imperatively from\n * anywhere (router transitions, fetch interceptors) and render the visual bar\n * with {@link NProgressBar}.\n *\n * @example\n * nprogress.start();\n * await loadData();\n * nprogress.done();\n */\nexport const nprogress: NProgressController = createNProgress();\n\n/** Props for {@link NProgressBar}. */\nexport interface NProgressBarProps {\n    /** Bar color. Defaults to `var(--tempest-primary)`. */\n    color?: string;\n    /** Bar height in pixels. Default `3`. */\n    height?: number;\n    /** Extra class applied to the bar element. */\n    className?: string;\n}\n\n/**\n * Fixed top loading bar bound to the {@link nprogress} singleton. Mount once\n * near the app root; it renders nothing while inactive.\n *\n * @example\n * <NProgressBar />\n */\nexport function NProgressBar({ color, height = 3, className }: NProgressBarProps) {\n    const [state, setState] = useState<NProgressState>({ value: 0, active: false });\n\n    useEffect(() => nprogress.subscribe(setState), []);\n\n    if (!state.active) return null;\n\n    const style: CSSProperties = {\n        width: `${Math.round(state.value * 100)}%`,\n        height: `${height}px`,\n        background: color ?? \"var(--tempest-primary)\",\n    };\n\n    return (\n        <div\n            className={cn(styles.bar, className)}\n            style={style}\n            role=\"progressbar\"\n            aria-valuemin={0}\n            aria-valuemax={100}\n            aria-valuenow={Math.round(state.value * 100)}\n        />\n    );\n}\n"],"mappings":"gIA8BA,IAAM,EAAsB,IACtB,EAAkB,GAClB,EAAqB,IAE3B,SAAS,EAAM,EAAmB,CAG9B,OAFI,EAAI,EAAU,EACd,EAAI,EAAU,EACX,CACX,CAEA,SAAS,GAAuC,CAC5C,IAAI,EAAwB,CAAE,MAAO,EAAG,OAAQ,EAAM,EAChD,EAAY,IAAI,IAClB,EAAsD,KACtD,EAAkD,KAEhD,MAAmB,CACrB,IAAK,IAAM,KAAY,EAAW,EAAS,CAAK,CACpD,EAEM,EAAU,GAAwC,CACpD,EAAQ,CAAE,GAAG,EAAO,GAAG,CAAK,EAC5B,EAAK,CACT,EAEM,MAA0B,CACxB,IAAiB,OACjB,cAAc,CAAY,EAC1B,EAAe,KAEvB,EAEM,MAAwB,CACtB,IAAc,OACd,aAAa,CAAS,EACtB,EAAY,KAEpB,EAEM,EAAO,GAA0B,CACnC,IAAM,EAAU,EAAM,MACtB,GAAI,GAAW,EAAiB,OAChC,IAAM,EAAO,IAAW,EAAI,GAAW,GAAM,IAC7C,EAAO,CAAE,MAAO,KAAK,IAAI,EAAM,EAAU,CAAI,EAAG,CAAe,CAAE,CAAC,CACtE,EAkCA,MAAO,CAAE,UAhCiB,CACtB,EAAU,EACN,GAAM,SACV,EAAO,CAAE,OAAQ,GAAM,MAAO,EAAM,MAAQ,EAAI,EAAM,MAAQ,GAAK,CAAC,EACpE,EAAY,EACZ,EAAe,gBAAkB,EAAI,EAAG,CAAmB,EAC/D,EA0BgB,SAxBS,CACrB,EAAY,EACZ,EAAU,EACV,EAAO,CAAE,MAAO,EAAG,OAAQ,EAAK,CAAC,EACjC,EAAY,eAAiB,CACzB,EAAO,CAAE,OAAQ,GAAO,MAAO,CAAE,CAAC,EAClC,EAAY,IAChB,EAAG,CAAkB,CACzB,EAgBsB,IAdT,GAAoB,CAC7B,EAAU,EACV,IAAM,EAAQ,EAAM,CAAC,EACrB,EAAO,CAAE,QAAO,OAAQ,EAAQ,GAAW,EAAM,MAAO,CAAC,CAC7D,EAU2B,MAAK,UARb,IACf,EAAU,IAAI,CAAQ,EACtB,EAAS,CAAK,MACD,CACT,EAAU,OAAO,CAAQ,CAC7B,EAGsC,CAC9C,CAYA,IAAa,EAAiC,EAAgB,EAmB9D,SAAgB,EAAa,CAAE,QAAO,SAAS,EAAG,aAAgC,CAC9E,GAAM,CAAC,EAAO,IAAA,EAAY,EAAA,SAAA,CAAyB,CAAE,MAAO,EAAG,OAAQ,EAAM,CAAC,EAI9E,IAFA,EAAA,EAAA,UAAA,KAAgB,EAAU,UAAU,CAAQ,EAAG,CAAC,CAAC,EAE7C,CAAC,EAAM,OAAQ,OAAO,KAE1B,IAAM,EAAuB,CACzB,MAAO,GAAG,KAAK,MAAM,EAAM,MAAQ,GAAG,EAAE,GACxC,OAAQ,GAAG,EAAO,IAClB,WAAY,GAAS,wBACzB,EAEA,OACI,EAAA,EAAA,IAAA,CAAC,MAAD,CACI,UAAW,EAAA,GAAG,EAAA,QAAO,IAAK,CAAS,EAC5B,QACP,KAAK,cACL,gBAAe,EACf,gBAAe,IACf,gBAAe,KAAK,MAAM,EAAM,MAAQ,GAAG,CAC9C,CAAA,CAET"}
+{"version":3,"file":"NProgress.cjs","names":["useState","cn","styles","require_cn","require_NProgress_module","react","react_jsx_runtime","TRICKLE_INTERVAL_MS","TRICKLE_CEILING","DONE_HIDE_DELAY_MS","clamp","n","createNProgress","state","listeners","trickleTimer","hideTimer","emit","listener","update","next","stopTrickle","clearHide","inc","current","step","amount","value","nprogress","NProgressBar","setState","style","height","color","className"],"sources":["../../../src/components/NProgress/NProgress.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport type { CSSProperties } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NProgress.module.css\";\n\n/** Snapshot of the progress controller state delivered to subscribers. */\nexport interface NProgressState {\n    /** Current progress, `0` (empty) to `1` (complete). */\n    value: number;\n    /** Whether the bar should be visible. */\n    active: boolean;\n}\n\n/** Listener invoked whenever the progress state changes. */\nexport type NProgressListener = (state: NProgressState) => void;\n\n/** Imperative top-loading-bar controller. */\nexport interface NProgressController {\n    /** Show the bar and start trickling toward ~0.9. */\n    start: () => void;\n    /** Complete to `1`, then hide the bar shortly after. */\n    done: () => void;\n    /** Set the progress explicitly. Values are clamped to `0..1`. */\n    set: (n: number) => void;\n    /** Increment progress by `amount` (default a small trickle step). */\n    inc: (amount?: number) => void;\n    /** Subscribe to state changes. Returns an unsubscribe function. */\n    subscribe: (listener: NProgressListener) => () => void;\n}\n\nconst TRICKLE_INTERVAL_MS = 300;\nconst TRICKLE_CEILING = 0.9;\nconst DONE_HIDE_DELAY_MS = 300;\n\nfunction clamp(n: number): number {\n    if (n < 0) return 0;\n    if (n > 1) return 1;\n    return n;\n}\n\nfunction createNProgress(): NProgressController {\n    let state: NProgressState = { value: 0, active: false };\n    const listeners = new Set<NProgressListener>();\n    let trickleTimer: ReturnType<typeof setInterval> | null = null;\n    let hideTimer: ReturnType<typeof setTimeout> | null = null;\n\n    const emit = (): void => {\n        for (const listener of listeners) listener(state);\n    };\n\n    const update = (next: Partial<NProgressState>): void => {\n        state = { ...state, ...next };\n        emit();\n    };\n\n    const stopTrickle = (): void => {\n        if (trickleTimer !== null) {\n            clearInterval(trickleTimer);\n            trickleTimer = null;\n        }\n    };\n\n    const clearHide = (): void => {\n        if (hideTimer !== null) {\n            clearTimeout(hideTimer);\n            hideTimer = null;\n        }\n    };\n\n    const inc = (amount?: number): void => {\n        const current = state.value;\n        if (current >= TRICKLE_CEILING) return;\n        const step = amount ?? (1 - current) * 0.1 + 0.01;\n        update({ value: Math.min(clamp(current + step), TRICKLE_CEILING) });\n    };\n\n    const start = (): void => {\n        clearHide();\n        if (state.active) return;\n        update({ active: true, value: state.value > 0 ? state.value : 0.08 });\n        stopTrickle();\n        trickleTimer = setInterval(() => inc(), TRICKLE_INTERVAL_MS);\n    };\n\n    const done = (): void => {\n        stopTrickle();\n        clearHide();\n        update({ value: 1, active: true });\n        hideTimer = setTimeout(() => {\n            update({ active: false, value: 0 });\n            hideTimer = null;\n        }, DONE_HIDE_DELAY_MS);\n    };\n\n    const set = (n: number): void => {\n        clearHide();\n        const value = clamp(n);\n        update({ value, active: value < 1 ? true : state.active });\n    };\n\n    const subscribe = (listener: NProgressListener): (() => void) => {\n        listeners.add(listener);\n        listener(state);\n        return () => {\n            listeners.delete(listener);\n        };\n    };\n\n    return { start, done, set, inc, subscribe };\n}\n\n/**\n * Module-level singleton progress controller. Drive it imperatively from\n * anywhere (router transitions, fetch interceptors) and render the visual bar\n * with {@link NProgressBar}.\n *\n * @example\n * nprogress.start();\n * await loadData();\n * nprogress.done();\n */\nexport const nprogress: NProgressController = createNProgress();\n\n/** Props for {@link NProgressBar}. */\nexport interface NProgressBarProps {\n    /** Bar color. Defaults to `var(--tempest-primary)`. */\n    color?: string;\n    /** Bar height in pixels. Default `3`. */\n    height?: number;\n    /** Extra class applied to the bar element. */\n    className?: string;\n}\n\n/**\n * Fixed top loading bar bound to the {@link nprogress} singleton. Mount once\n * near the app root; it renders nothing while inactive.\n *\n * @example\n * <NProgressBar />\n */\nexport function NProgressBar({ color, height = 3, className }: NProgressBarProps) {\n    const [state, setState] = useState<NProgressState>({ value: 0, active: false });\n\n    useEffect(() => nprogress.subscribe(setState), []);\n\n    if (!state.active) return null;\n\n    const style: CSSProperties = {\n        width: `${Math.round(state.value * 100)}%`,\n        height: `${height}px`,\n        background: color ?? \"var(--tempest-primary)\",\n    };\n\n    return (\n        <div\n            className={cn(styles.bar, className)}\n            style={style}\n            role=\"progressbar\"\n            aria-valuemin={0}\n            aria-valuemax={100}\n            aria-valuenow={Math.round(state.value * 100)}\n        />\n    );\n}\n"],"mappings":"A,gIA8BA,IAAMO,EAAsB,IACtBC,EAAkB,GAClBC,EAAqB,IAE3B,SAASC,EAAM,EAAmB,CAG9B,OAFIC,EAAI,EAAU,EACdA,EAAI,EAAU,EACXA,CACX,CAEA,SAASC,GAAuC,CAC5C,IAAIC,EAAwB,CAAE,MAAO,EAAG,OAAQ,EAAM,EAChDC,EAAY,IAAI,IAClBC,EAAsD,KACtDC,EAAkD,KAEhDC,MAAmB,CACrB,IAAK,IAAMC,KAAYJ,EAAWI,EAASL,CAAK,CACpD,EAEMM,EAAU,GAAwC,CACpD,EAAQ,CAAE,GAAGN,EAAO,GAAGO,CAAK,EAC5BH,EAAK,CACT,EAEMI,MAA0B,CACxBN,IAAiB,OACjB,cAAcA,CAAY,EAC1B,EAAe,KAEvB,EAEMO,MAAwB,CACtBN,IAAc,OACd,aAAaA,CAAS,EACtB,EAAY,KAEpB,EAEMO,EAAO,GAA0B,CACnC,IAAMC,EAAUX,EAAM,MACtB,GAAIW,GAAWhB,EAAiB,OAChC,IAAMiB,EAAOC,IAAW,EAAIF,GAAW,GAAM,IAC7CL,EAAO,CAAE,MAAO,KAAK,IAAIT,EAAMc,EAAUC,CAAI,EAAGjB,CAAe,CAAE,CAAC,CACtE,EAkCA,MAAO,CAAE,UAhCiB,CACtBc,EAAU,EACN,GAAM,SACVH,EAAO,CAAE,OAAQ,GAAM,MAAON,EAAM,MAAQ,EAAIA,EAAM,MAAQ,GAAK,CAAC,EACpEQ,EAAY,EACZ,EAAe,gBAAkBE,EAAI,EAAGhB,CAAmB,EAC/D,EA0BgB,SAxBS,CACrBc,EAAY,EACZC,EAAU,EACVH,EAAO,CAAE,MAAO,EAAG,OAAQ,EAAK,CAAC,EACjC,EAAY,eAAiB,CACzBA,EAAO,CAAE,OAAQ,GAAO,MAAO,CAAE,CAAC,EAClC,EAAY,IAChB,EAAGV,CAAkB,CACzB,EAgBsB,IAdT,GAAoB,CAC7Ba,EAAU,EACV,IAAMK,EAAQjB,EAAMC,CAAC,EACrBQ,EAAO,CAAE,QAAO,OAAQQ,EAAQ,GAAWd,EAAM,MAAO,CAAC,CAC7D,EAU2B,MAAK,UARb,IACfC,EAAU,IAAII,CAAQ,EACtBA,EAASL,CAAK,MACD,CACTC,EAAU,OAAOI,CAAQ,CAC7B,EAGsC,CAC9C,CAYA,IAAaU,EAAiChB,EAAgB,EAmB9D,SAAgBiB,EAAa,CAAE,QAAO,SAAS,EAAG,aAAgC,CAC9E,GAAM,CAAChB,EAAOiB,IAAA,EAAY9B,EAAAA,SAAAA,CAAyB,CAAE,MAAO,EAAG,OAAQ,EAAM,CAAC,EAI9E,IAFA,EAAAK,EAAA,UAAA,KAAgBuB,EAAU,UAAUE,CAAQ,EAAG,CAAC,CAAC,EAE7C,CAACjB,EAAM,OAAQ,OAAO,KAE1B,IAAMkB,EAAuB,CACzB,MAAO,GAAG,KAAK,MAAMlB,EAAM,MAAQ,GAAG,EAAE,GACxC,OAAQ,GAAGmB,EAAO,IAClB,WAAYC,GAAS,wBACzB,EAEA,OACI,EAAA3B,EAAA,IAAA,CAAC,MAAD,CACI,UAAWL,EAAAA,GAAGC,EAAAA,QAAO,IAAKgC,CAAS,EAC5B,QACP,KAAK,cACL,gBAAe,EACf,gBAAe,IACf,gBAAe,KAAK,MAAMrB,EAAM,MAAQ,GAAG,CAC9C,CAAA,CAET,C"}

package/dist/components/NProgress/NProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"NProgress.js","names":[],"sources":["../../../src/components/NProgress/NProgress.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport type { CSSProperties } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NProgress.module.css\";\n\n/** Snapshot of the progress controller state delivered to subscribers. */\nexport interface NProgressState {\n    /** Current progress, `0` (empty) to `1` (complete). */\n    value: number;\n    /** Whether the bar should be visible. */\n    active: boolean;\n}\n\n/** Listener invoked whenever the progress state changes. */\nexport type NProgressListener = (state: NProgressState) => void;\n\n/** Imperative top-loading-bar controller. */\nexport interface NProgressController {\n    /** Show the bar and start trickling toward ~0.9. */\n    start: () => void;\n    /** Complete to `1`, then hide the bar shortly after. */\n    done: () => void;\n    /** Set the progress explicitly. Values are clamped to `0..1`. */\n    set: (n: number) => void;\n    /** Increment progress by `amount` (default a small trickle step). */\n    inc: (amount?: number) => void;\n    /** Subscribe to state changes. Returns an unsubscribe function. */\n    subscribe: (listener: NProgressListener) => () => void;\n}\n\nconst TRICKLE_INTERVAL_MS = 300;\nconst TRICKLE_CEILING = 0.9;\nconst DONE_HIDE_DELAY_MS = 300;\n\nfunction clamp(n: number): number {\n    if (n < 0) return 0;\n    if (n > 1) return 1;\n    return n;\n}\n\nfunction createNProgress(): NProgressController {\n    let state: NProgressState = { value: 0, active: false };\n    const listeners = new Set<NProgressListener>();\n    let trickleTimer: ReturnType<typeof setInterval> | null = null;\n    let hideTimer: ReturnType<typeof setTimeout> | null = null;\n\n    const emit = (): void => {\n        for (const listener of listeners) listener(state);\n    };\n\n    const update = (next: Partial<NProgressState>): void => {\n        state = { ...state, ...next };\n        emit();\n    };\n\n    const stopTrickle = (): void => {\n        if (trickleTimer !== null) {\n            clearInterval(trickleTimer);\n            trickleTimer = null;\n        }\n    };\n\n    const clearHide = (): void => {\n        if (hideTimer !== null) {\n            clearTimeout(hideTimer);\n            hideTimer = null;\n        }\n    };\n\n    const inc = (amount?: number): void => {\n        const current = state.value;\n        if (current >= TRICKLE_CEILING) return;\n        const step = amount ?? (1 - current) * 0.1 + 0.01;\n        update({ value: Math.min(clamp(current + step), TRICKLE_CEILING) });\n    };\n\n    const start = (): void => {\n        clearHide();\n        if (state.active) return;\n        update({ active: true, value: state.value > 0 ? state.value : 0.08 });\n        stopTrickle();\n        trickleTimer = setInterval(() => inc(), TRICKLE_INTERVAL_MS);\n    };\n\n    const done = (): void => {\n        stopTrickle();\n        clearHide();\n        update({ value: 1, active: true });\n        hideTimer = setTimeout(() => {\n            update({ active: false, value: 0 });\n            hideTimer = null;\n        }, DONE_HIDE_DELAY_MS);\n    };\n\n    const set = (n: number): void => {\n        clearHide();\n        const value = clamp(n);\n        update({ value, active: value < 1 ? true : state.active });\n    };\n\n    const subscribe = (listener: NProgressListener): (() => void) => {\n        listeners.add(listener);\n        listener(state);\n        return () => {\n            listeners.delete(listener);\n        };\n    };\n\n    return { start, done, set, inc, subscribe };\n}\n\n/**\n * Module-level singleton progress controller. Drive it imperatively from\n * anywhere (router transitions, fetch interceptors) and render the visual bar\n * with {@link NProgressBar}.\n *\n * @example\n * nprogress.start();\n * await loadData();\n * nprogress.done();\n */\nexport const nprogress: NProgressController = createNProgress();\n\n/** Props for {@link NProgressBar}. */\nexport interface NProgressBarProps {\n    /** Bar color. Defaults to `var(--tempest-primary)`. */\n    color?: string;\n    /** Bar height in pixels. Default `3`. */\n    height?: number;\n    /** Extra class applied to the bar element. */\n    className?: string;\n}\n\n/**\n * Fixed top loading bar bound to the {@link nprogress} singleton. Mount once\n * near the app root; it renders nothing while inactive.\n *\n * @example\n * <NProgressBar />\n */\nexport function NProgressBar({ color, height = 3, className }: NProgressBarProps) {\n    const [state, setState] = useState<NProgressState>({ value: 0, active: false });\n\n    useEffect(() => nprogress.subscribe(setState), []);\n\n    if (!state.active) return null;\n\n    const style: CSSProperties = {\n        width: `${Math.round(state.value * 100)}%`,\n        height: `${height}px`,\n        background: color ?? \"var(--tempest-primary)\",\n    };\n\n    return (\n        <div\n            className={cn(styles.bar, className)}\n            style={style}\n            role=\"progressbar\"\n            aria-valuemin={0}\n            aria-valuemax={100}\n            aria-valuenow={Math.round(state.value * 100)}\n        />\n    );\n}\n"],"mappings":";;;;;AA8BA,IAAM,IAAsB,KACtB,IAAkB,IAClB,IAAqB;AAE3B,SAAS,EAAM,GAAmB;CAG9B,OAFI,IAAI,IAAU,IACd,IAAI,IAAU,IACX;AACX;AAEA,SAAS,IAAuC;CAC5C,IAAI,IAAwB;EAAE,OAAO;EAAG,QAAQ;CAAM,GAChD,oBAAY,IAAI,IAAuB,GACzC,IAAsD,MACtD,IAAkD,MAEhD,UAAmB;EACrB,KAAK,IAAM,KAAY,GAAW,EAAS,CAAK;CACpD,GAEM,KAAU,MAAwC;EAEpD,AADA,IAAQ;GAAE,GAAG;GAAO,GAAG;EAAK,GAC5B,EAAK;CACT,GAEM,UAA0B;EAC5B,AAAI,MAAiB,SACjB,cAAc,CAAY,GAC1B,IAAe;CAEvB,GAEM,UAAwB;EAC1B,AAAI,MAAc,SACd,aAAa,CAAS,GACtB,IAAY;CAEpB,GAEM,KAAO,MAA0B;EACnC,IAAM,IAAU,EAAM;EACtB,IAAI,KAAW,GAAiB;EAChC,IAAM,IAAO,MAAW,IAAI,KAAW,KAAM;EAC7C,EAAO,EAAE,OAAO,KAAK,IAAI,EAAM,IAAU,CAAI,GAAG,CAAe,EAAE,CAAC;CACtE;CAkCA,OAAO;EAAE,aAhCiB;GACtB,EAAU,GACN,GAAM,WACV,EAAO;IAAE,QAAQ;IAAM,OAAO,EAAM,QAAQ,IAAI,EAAM,QAAQ;GAAK,CAAC,GACpE,EAAY,GACZ,IAAe,kBAAkB,EAAI,GAAG,CAAmB;EAC/D;EA0BgB,YAxBS;GAIrB,AAHA,EAAY,GACZ,EAAU,GACV,EAAO;IAAE,OAAO;IAAG,QAAQ;GAAK,CAAC,GACjC,IAAY,iBAAiB;IAEzB,AADA,EAAO;KAAE,QAAQ;KAAO,OAAO;IAAE,CAAC,GAClC,IAAY;GAChB,GAAG,CAAkB;EACzB;EAgBsB,MAdT,MAAoB;GAC7B,EAAU;GACV,IAAM,IAAQ,EAAM,CAAC;GACrB,EAAO;IAAE;IAAO,QAAQ,IAAQ,KAAW,EAAM;GAAO,CAAC;EAC7D;EAU2B;EAAK,YARb,OACf,EAAU,IAAI,CAAQ,GACtB,EAAS,CAAK,SACD;GACT,EAAU,OAAO,CAAQ;EAC7B;CAGsC;AAC9C;AAYA,IAAa,IAAiC,EAAgB;AAmB9D,SAAgB,EAAa,EAAE,UAAO,YAAS,GAAG,gBAAgC;CAC9E,IAAM,CAAC,GAAO,KAAY,EAAyB;EAAE,OAAO;EAAG,QAAQ;CAAM,CAAC;CAI9E,IAFA,QAAgB,EAAU,UAAU,CAAQ,GAAG,CAAC,CAAC,GAE7C,CAAC,EAAM,QAAQ,OAAO;CAE1B,IAAM,IAAuB;EACzB,OAAO,GAAG,KAAK,MAAM,EAAM,QAAQ,GAAG,EAAE;EACxC,QAAQ,GAAG,EAAO;EAClB,YAAY,KAAS;CACzB;CAEA,OACI,kBAAC,OAAD;EACI,WAAW,EAAG,EAAO,KAAK,CAAS;EAC5B;EACP,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe,KAAK,MAAM,EAAM,QAAQ,GAAG;CAC9C,CAAA;AAET"}
+{"version":3,"file":"NProgress.js","names":["styles","NProgress_module_default","TRICKLE_INTERVAL_MS","TRICKLE_CEILING","DONE_HIDE_DELAY_MS","clamp","n","createNProgress","state","listeners","trickleTimer","hideTimer","emit","listener","update","next","stopTrickle","clearHide","inc","current","step","amount","value","nprogress","NProgressBar","setState","useState","useEffect","style","height","color","cn","className"],"sources":["../../../src/components/NProgress/NProgress.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport type { CSSProperties } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NProgress.module.css\";\n\n/** Snapshot of the progress controller state delivered to subscribers. */\nexport interface NProgressState {\n    /** Current progress, `0` (empty) to `1` (complete). */\n    value: number;\n    /** Whether the bar should be visible. */\n    active: boolean;\n}\n\n/** Listener invoked whenever the progress state changes. */\nexport type NProgressListener = (state: NProgressState) => void;\n\n/** Imperative top-loading-bar controller. */\nexport interface NProgressController {\n    /** Show the bar and start trickling toward ~0.9. */\n    start: () => void;\n    /** Complete to `1`, then hide the bar shortly after. */\n    done: () => void;\n    /** Set the progress explicitly. Values are clamped to `0..1`. */\n    set: (n: number) => void;\n    /** Increment progress by `amount` (default a small trickle step). */\n    inc: (amount?: number) => void;\n    /** Subscribe to state changes. Returns an unsubscribe function. */\n    subscribe: (listener: NProgressListener) => () => void;\n}\n\nconst TRICKLE_INTERVAL_MS = 300;\nconst TRICKLE_CEILING = 0.9;\nconst DONE_HIDE_DELAY_MS = 300;\n\nfunction clamp(n: number): number {\n    if (n < 0) return 0;\n    if (n > 1) return 1;\n    return n;\n}\n\nfunction createNProgress(): NProgressController {\n    let state: NProgressState = { value: 0, active: false };\n    const listeners = new Set<NProgressListener>();\n    let trickleTimer: ReturnType<typeof setInterval> | null = null;\n    let hideTimer: ReturnType<typeof setTimeout> | null = null;\n\n    const emit = (): void => {\n        for (const listener of listeners) listener(state);\n    };\n\n    const update = (next: Partial<NProgressState>): void => {\n        state = { ...state, ...next };\n        emit();\n    };\n\n    const stopTrickle = (): void => {\n        if (trickleTimer !== null) {\n            clearInterval(trickleTimer);\n            trickleTimer = null;\n        }\n    };\n\n    const clearHide = (): void => {\n        if (hideTimer !== null) {\n            clearTimeout(hideTimer);\n            hideTimer = null;\n        }\n    };\n\n    const inc = (amount?: number): void => {\n        const current = state.value;\n        if (current >= TRICKLE_CEILING) return;\n        const step = amount ?? (1 - current) * 0.1 + 0.01;\n        update({ value: Math.min(clamp(current + step), TRICKLE_CEILING) });\n    };\n\n    const start = (): void => {\n        clearHide();\n        if (state.active) return;\n        update({ active: true, value: state.value > 0 ? state.value : 0.08 });\n        stopTrickle();\n        trickleTimer = setInterval(() => inc(), TRICKLE_INTERVAL_MS);\n    };\n\n    const done = (): void => {\n        stopTrickle();\n        clearHide();\n        update({ value: 1, active: true });\n        hideTimer = setTimeout(() => {\n            update({ active: false, value: 0 });\n            hideTimer = null;\n        }, DONE_HIDE_DELAY_MS);\n    };\n\n    const set = (n: number): void => {\n        clearHide();\n        const value = clamp(n);\n        update({ value, active: value < 1 ? true : state.active });\n    };\n\n    const subscribe = (listener: NProgressListener): (() => void) => {\n        listeners.add(listener);\n        listener(state);\n        return () => {\n            listeners.delete(listener);\n        };\n    };\n\n    return { start, done, set, inc, subscribe };\n}\n\n/**\n * Module-level singleton progress controller. Drive it imperatively from\n * anywhere (router transitions, fetch interceptors) and render the visual bar\n * with {@link NProgressBar}.\n *\n * @example\n * nprogress.start();\n * await loadData();\n * nprogress.done();\n */\nexport const nprogress: NProgressController = createNProgress();\n\n/** Props for {@link NProgressBar}. */\nexport interface NProgressBarProps {\n    /** Bar color. Defaults to `var(--tempest-primary)`. */\n    color?: string;\n    /** Bar height in pixels. Default `3`. */\n    height?: number;\n    /** Extra class applied to the bar element. */\n    className?: string;\n}\n\n/**\n * Fixed top loading bar bound to the {@link nprogress} singleton. Mount once\n * near the app root; it renders nothing while inactive.\n *\n * @example\n * <NProgressBar />\n */\nexport function NProgressBar({ color, height = 3, className }: NProgressBarProps) {\n    const [state, setState] = useState<NProgressState>({ value: 0, active: false });\n\n    useEffect(() => nprogress.subscribe(setState), []);\n\n    if (!state.active) return null;\n\n    const style: CSSProperties = {\n        width: `${Math.round(state.value * 100)}%`,\n        height: `${height}px`,\n        background: color ?? \"var(--tempest-primary)\",\n    };\n\n    return (\n        <div\n            className={cn(styles.bar, className)}\n            style={style}\n            role=\"progressbar\"\n            aria-valuemin={0}\n            aria-valuemax={100}\n            aria-valuenow={Math.round(state.value * 100)}\n        />\n    );\n}\n"],"mappings":";;;;;AA8BA,IAAME,IAAsB,KACtBC,IAAkB,IAClBC,IAAqB;AAE3B,SAASC,EAAM,GAAmB;CAG9B,OAFIC,IAAI,IAAU,IACdA,IAAI,IAAU,IACXA;AACX;AAEA,SAASC,IAAuC;CAC5C,IAAIC,IAAwB;EAAE,OAAO;EAAG,QAAQ;CAAM,GAChDC,oBAAY,IAAI,IAAuB,GACzCC,IAAsD,MACtDC,IAAkD,MAEhDC,UAAmB;EACrB,KAAK,IAAMC,KAAYJ,GAAW,EAASD,CAAK;CACpD,GAEMM,KAAU,MAAwC;EAEpD,AADA,IAAQ;GAAE,GAAGN;GAAO,GAAGO;EAAK,GAC5BH,EAAK;CACT,GAEMI,UAA0B;EAC5B,AAAIN,MAAiB,SACjB,cAAcA,CAAY,GAC1B,IAAe;CAEvB,GAEMO,UAAwB;EAC1B,AAAIN,MAAc,SACd,aAAaA,CAAS,GACtB,IAAY;CAEpB,GAEMO,KAAO,MAA0B;EACnC,IAAMC,IAAUX,EAAM;EACtB,IAAIW,KAAWhB,GAAiB;EAChC,IAAMiB,IAAOC,MAAW,IAAIF,KAAW,KAAM;EAC7C,EAAO,EAAE,OAAO,KAAK,IAAId,EAAMc,IAAUC,CAAI,GAAGjB,CAAe,EAAE,CAAC;CACtE;CAkCA,OAAO;EAAE,aAhCiB;GAEtB,AADAc,EAAU,GACN,GAAM,WACVH,EAAO;IAAE,QAAQ;IAAM,OAAON,EAAM,QAAQ,IAAIA,EAAM,QAAQ;GAAK,CAAC,GACpEQ,EAAY,GACZ,IAAe,kBAAkBE,EAAI,GAAGhB,CAAmB;EAC/D;EA0BgB,YAxBS;GAIrB,AAHAc,EAAY,GACZC,EAAU,GACVH,EAAO;IAAE,OAAO;IAAG,QAAQ;GAAK,CAAC,GACjC,IAAY,iBAAiB;IAEzB,AADAA,EAAO;KAAE,QAAQ;KAAO,OAAO;IAAE,CAAC,GAClC,IAAY;GAChB,GAAGV,CAAkB;EACzB;EAgBsB,MAdT,MAAoB;GAC7B,EAAU;GACV,IAAMkB,IAAQjB,EAAMC,CAAC;GACrB,EAAO;IAAE;IAAO,QAAQgB,IAAQ,KAAWd,EAAM;GAAO,CAAC;EAC7D;EAU2B;EAAK,YARb,OACfC,EAAU,IAAII,CAAQ,GACtBA,EAASL,CAAK,SACD;GACT,EAAU,OAAOK,CAAQ;EAC7B;CAGsC;AAC9C;AAYA,IAAaU,IAAiChB,EAAgB;AAmB9D,SAAgBiB,EAAa,EAAE,UAAO,YAAS,GAAG,gBAAgC;CAC9E,IAAM,CAAChB,GAAOiB,KAAYC,EAAyB;EAAE,OAAO;EAAG,QAAQ;CAAM,CAAC;CAI9E,IAFAC,QAAgBJ,EAAU,UAAUE,CAAQ,GAAG,CAAC,CAAC,GAE7C,CAACjB,EAAM,QAAQ,OAAO;CAE1B,IAAMoB,IAAuB;EACzB,OAAO,GAAG,KAAK,MAAMpB,EAAM,QAAQ,GAAG,EAAE;EACxC,QAAQ,GAAGqB,EAAO;EAClB,YAAYC,KAAS;CACzB;CAEA,OACI,kBAAC,OAAD;EACI,WAAWC,EAAG/B,EAAO,KAAKgC,CAAS;EAC5B;EACP,MAAK;EACL,iBAAe;EACf,iBAAe;EACf,iBAAe,KAAK,MAAMxB,EAAM,QAAQ,GAAG;CAC9C,CAAA;AAET"}

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

@@ -1 +1 @@
-{"version":3,"file":"NProgress.module.cjs","names":[],"sources":["../../../src/components/NProgress/NProgress.module.css"],"sourcesContent":[".bar {\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: var(--tempest-z-toast, 1100);\n    border-radius: 0 var(--tempest-radius-full) var(--tempest-radius-full) 0;\n    box-shadow:\n        0 0 8px var(--tempest-primary),\n        0 0 4px var(--tempest-primary);\n    transition: width var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n    pointer-events: none;\n}\n"],"mappings":";"}
+{"version":3,"file":"NProgress.module.cjs","names":["bar","NProgress_module_default"],"sources":["../../../src/components/NProgress/NProgress.module.css"],"sourcesContent":[".bar {\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: var(--tempest-z-toast, 1100);\n    border-radius: 0 var(--tempest-radius-full) var(--tempest-radius-full) 0;\n    box-shadow:\n        0 0 8px var(--tempest-primary),\n        0 0 4px var(--tempest-primary);\n    transition: width var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n    pointer-events: none;\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"NProgress.module.js","names":[],"sources":["../../../src/components/NProgress/NProgress.module.css"],"sourcesContent":[".bar {\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: var(--tempest-z-toast, 1100);\n    border-radius: 0 var(--tempest-radius-full) var(--tempest-radius-full) 0;\n    box-shadow:\n        0 0 8px var(--tempest-primary),\n        0 0 4px var(--tempest-primary);\n    transition: width var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n    pointer-events: none;\n}\n"],"mappings":";"}
+{"version":3,"file":"NProgress.module.js","names":["bar","NProgress_module_default"],"sources":["../../../src/components/NProgress/NProgress.module.css"],"sourcesContent":[".bar {\n    position: fixed;\n    top: 0;\n    left: 0;\n    z-index: var(--tempest-z-toast, 1100);\n    border-radius: 0 var(--tempest-radius-full) var(--tempest-radius-full) 0;\n    box-shadow:\n        0 0 8px var(--tempest-primary),\n        0 0 4px var(--tempest-primary);\n    transition: width var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n    pointer-events: none;\n}\n"],"mappings":";"}

package/dist/components/Navbar/Navbar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Navbar.cjs","names":[],"sources":["../../../src/components/Navbar/Navbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Navbar.module.css\";\n\n/**\n * Visual tone of a {@link Navbar}.\n *\n * - `\"surface\"` — the page's surface and text.\n * - `\"primary\"` — the brand fill (`--tempest-primary`) with\n *   `--tempest-primary-foreground` ink. Only the bar's own text follows the fill:\n *   components inside it keep the page's tokens. Measured in Chromium over the\n *   SDK's `#0066ff`, a link button inside it reads 1:1, muted text 1.59:1 and the\n *   focus ring 1.41:1. Fine for a bar that holds a logo and plain text.\n * - `\"inverse\"` — the inverse surface: every color token inverted inside the bar,\n *   so a primary `Button`, a link, the focus ring and muted text are measured\n *   against the fill. See {@link NavbarProps.tone}.\n * - `\"transparent\"` — no background; the text inherits.\n */\nexport type NavbarTone = \"surface\" | \"primary\" | \"inverse\" | \"transparent\";\n\nexport interface NavbarProps extends HTMLAttributes<HTMLElement> {\n    /** Left slot — typically logo + brand name. */\n    logo?: ReactNode;\n    /** Center slot — typically nav links. */\n    nav?: ReactNode;\n    /** Right slot — typically user menu / actions. */\n    actions?: ReactNode;\n    /** Make the bar sticky at the top of the scroll container. Default `true`. */\n    sticky?: boolean;\n    /**\n     * Visual tone. Default `\"surface\"`.\n     *\n     * `\"inverse\"` writes `data-tempest-tone=\"inverse\"` and paints the bar with the\n     * inverse surface's `--tempest-bg`, so the components in the slots invert with\n     * it. The tokens are opt-in: `tempest-react-sdk/styles/inverse.css` for the\n     * SDK's own blue, or `createTheme({ primary, inverse: createInverseSurface })`\n     * for yours. With neither loaded the bar falls back to the page's\n     * `--tempest-bg` and `--tempest-text` — legible, not inverted.\n     *\n     * A separate tone rather than a change to `\"primary\"`, because the inverse\n     * fill is not always the brand's `500`: for `#0066ff` it is the `800`\n     * (`#042e75`), and turning `\"primary\"` into it would repaint every bar that\n     * uses it today.\n     */\n    tone?: NavbarTone;\n    /** When set, renders a thin bottom border. Default `true`. */\n    bordered?: boolean;\n}\n\n/**\n * Top app bar. Three-slot layout (logo / nav / actions) that collapses\n * gracefully on mobile (nav slot wraps below).\n *\n * @example\n * <Navbar\n *     logo={<img src=\"/logo.svg\" alt=\"App\" />}\n *     nav={<NavLinks />}\n *     actions={<UserMenu />}\n * />\n */\nexport function Navbar({\n    logo,\n    nav,\n    actions,\n    sticky = true,\n    tone = \"surface\",\n    bordered = true,\n    className,\n    ...props\n}: NavbarProps) {\n    return (\n        <header\n            className={cn(\n                styles.navbar,\n                styles[tone],\n                sticky && styles.sticky,\n                bordered && styles.bordered,\n                className,\n            )}\n            data-tempest-tone={tone === \"inverse\" ? \"inverse\" : undefined}\n            {...props}\n        >\n            {logo && <div className={styles.logo}>{logo}</div>}\n            {nav && <nav className={styles.nav}>{nav}</nav>}\n            {actions && <div className={styles.actions}>{actions}</div>}\n        </header>\n    );\n}\n"],"mappings":"0GA4DA,SAAgB,EAAO,CACnB,OACA,MACA,UACA,SAAS,GACT,OAAO,UACP,WAAW,GACX,YACA,GAAG,GACS,CACZ,OACI,EAAA,EAAA,KAAA,CAAC,SAAD,CACI,UAAW,EAAA,GACP,EAAA,QAAO,OACP,EAAA,QAAO,GACP,GAAU,EAAA,QAAO,OACjB,GAAY,EAAA,QAAO,SACnB,CACJ,EACA,oBAAmB,IAAS,UAAY,UAAY,IAAA,GACpD,GAAI,EATR,SAAA,CAWK,IAAQ,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,KAAO,SAAA,CAAU,CAAA,EAChD,IAAO,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,IAAM,SAAA,CAAS,CAAA,EAC7C,IAAW,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,QAAU,SAAA,CAAa,CAAA,CACtD,GAEhB"}
+{"version":3,"file":"Navbar.cjs","names":["cn","styles","require_cn","require_Navbar_module","react_jsx_runtime","Navbar","props","tone","sticky","bordered","className","logo","nav","actions"],"sources":["../../../src/components/Navbar/Navbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Navbar.module.css\";\n\n/**\n * Visual tone of a {@link Navbar}.\n *\n * - `\"surface\"` — the page's surface and text.\n * - `\"primary\"` — the brand fill (`--tempest-primary`) with\n *   `--tempest-primary-foreground` ink. Only the bar's own text follows the fill:\n *   components inside it keep the page's tokens. Measured in Chromium over the\n *   SDK's `#0066ff`, a link button inside it reads 1:1, muted text 1.59:1 and the\n *   focus ring 1.41:1. Fine for a bar that holds a logo and plain text.\n * - `\"inverse\"` — the inverse surface: every color token inverted inside the bar,\n *   so a primary `Button`, a link, the focus ring and muted text are measured\n *   against the fill. See {@link NavbarProps.tone}.\n * - `\"transparent\"` — no background; the text inherits.\n */\nexport type NavbarTone = \"surface\" | \"primary\" | \"inverse\" | \"transparent\";\n\nexport interface NavbarProps extends HTMLAttributes<HTMLElement> {\n    /** Left slot — typically logo + brand name. */\n    logo?: ReactNode;\n    /** Center slot — typically nav links. */\n    nav?: ReactNode;\n    /** Right slot — typically user menu / actions. */\n    actions?: ReactNode;\n    /** Make the bar sticky at the top of the scroll container. Default `true`. */\n    sticky?: boolean;\n    /**\n     * Visual tone. Default `\"surface\"`.\n     *\n     * `\"inverse\"` writes `data-tempest-tone=\"inverse\"` and paints the bar with the\n     * inverse surface's `--tempest-bg`, so the components in the slots invert with\n     * it. The tokens are opt-in: `tempest-react-sdk/styles/inverse.css` for the\n     * SDK's own blue, or `createTheme({ primary, inverse: createInverseSurface })`\n     * for yours. With neither loaded the bar falls back to the page's\n     * `--tempest-bg` and `--tempest-text` — legible, not inverted.\n     *\n     * A separate tone rather than a change to `\"primary\"`, because the inverse\n     * fill is not always the brand's `500`: for `#0066ff` it is the `800`\n     * (`#042e75`), and turning `\"primary\"` into it would repaint every bar that\n     * uses it today.\n     */\n    tone?: NavbarTone;\n    /** When set, renders a thin bottom border. Default `true`. */\n    bordered?: boolean;\n}\n\n/**\n * Top app bar. Three-slot layout (logo / nav / actions) that collapses\n * gracefully on mobile (nav slot wraps below).\n *\n * @example\n * <Navbar\n *     logo={<img src=\"/logo.svg\" alt=\"App\" />}\n *     nav={<NavLinks />}\n *     actions={<UserMenu />}\n * />\n */\nexport function Navbar({\n    logo,\n    nav,\n    actions,\n    sticky = true,\n    tone = \"surface\",\n    bordered = true,\n    className,\n    ...props\n}: NavbarProps) {\n    return (\n        <header\n            className={cn(\n                styles.navbar,\n                styles[tone],\n                sticky && styles.sticky,\n                bordered && styles.bordered,\n                className,\n            )}\n            data-tempest-tone={tone === \"inverse\" ? \"inverse\" : undefined}\n            {...props}\n        >\n            {logo && <div className={styles.logo}>{logo}</div>}\n            {nav && <nav className={styles.nav}>{nav}</nav>}\n            {actions && <div className={styles.actions}>{actions}</div>}\n        </header>\n    );\n}\n"],"mappings":"A,0GA4DA,SAAgBK,EAAO,CACnB,OACA,MACA,UACA,SAAS,GACT,OAAO,UACP,WAAW,GACX,YACA,GAAGC,GACS,CACZ,OACI,EAAAF,EAAA,KAAA,CAAC,SAAD,CACI,UAAWJ,EAAAA,GACPC,EAAAA,QAAO,OACPA,EAAAA,QAAOM,GACPC,GAAUP,EAAAA,QAAO,OACjBQ,GAAYR,EAAAA,QAAO,SACnBS,CACJ,EACA,oBAAmBH,IAAS,UAAY,UAAY,IAAA,GACpD,GAAID,EATR,SAAA,CAWKK,IAAQ,EAAAP,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWH,EAAAA,QAAO,KAAO,SAAAU,CAAU,CAAA,EAChDC,IAAO,EAAAR,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWH,EAAAA,QAAO,IAAM,SAAAW,CAAS,CAAA,EAC7CC,IAAW,EAAAT,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWH,EAAAA,QAAO,QAAU,SAAAY,CAAa,CAAA,CACtD,C,EAEhB,C"}

package/dist/components/Navbar/Navbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navbar.js","names":[],"sources":["../../../src/components/Navbar/Navbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Navbar.module.css\";\n\n/**\n * Visual tone of a {@link Navbar}.\n *\n * - `\"surface\"` — the page's surface and text.\n * - `\"primary\"` — the brand fill (`--tempest-primary`) with\n *   `--tempest-primary-foreground` ink. Only the bar's own text follows the fill:\n *   components inside it keep the page's tokens. Measured in Chromium over the\n *   SDK's `#0066ff`, a link button inside it reads 1:1, muted text 1.59:1 and the\n *   focus ring 1.41:1. Fine for a bar that holds a logo and plain text.\n * - `\"inverse\"` — the inverse surface: every color token inverted inside the bar,\n *   so a primary `Button`, a link, the focus ring and muted text are measured\n *   against the fill. See {@link NavbarProps.tone}.\n * - `\"transparent\"` — no background; the text inherits.\n */\nexport type NavbarTone = \"surface\" | \"primary\" | \"inverse\" | \"transparent\";\n\nexport interface NavbarProps extends HTMLAttributes<HTMLElement> {\n    /** Left slot — typically logo + brand name. */\n    logo?: ReactNode;\n    /** Center slot — typically nav links. */\n    nav?: ReactNode;\n    /** Right slot — typically user menu / actions. */\n    actions?: ReactNode;\n    /** Make the bar sticky at the top of the scroll container. Default `true`. */\n    sticky?: boolean;\n    /**\n     * Visual tone. Default `\"surface\"`.\n     *\n     * `\"inverse\"` writes `data-tempest-tone=\"inverse\"` and paints the bar with the\n     * inverse surface's `--tempest-bg`, so the components in the slots invert with\n     * it. The tokens are opt-in: `tempest-react-sdk/styles/inverse.css` for the\n     * SDK's own blue, or `createTheme({ primary, inverse: createInverseSurface })`\n     * for yours. With neither loaded the bar falls back to the page's\n     * `--tempest-bg` and `--tempest-text` — legible, not inverted.\n     *\n     * A separate tone rather than a change to `\"primary\"`, because the inverse\n     * fill is not always the brand's `500`: for `#0066ff` it is the `800`\n     * (`#042e75`), and turning `\"primary\"` into it would repaint every bar that\n     * uses it today.\n     */\n    tone?: NavbarTone;\n    /** When set, renders a thin bottom border. Default `true`. */\n    bordered?: boolean;\n}\n\n/**\n * Top app bar. Three-slot layout (logo / nav / actions) that collapses\n * gracefully on mobile (nav slot wraps below).\n *\n * @example\n * <Navbar\n *     logo={<img src=\"/logo.svg\" alt=\"App\" />}\n *     nav={<NavLinks />}\n *     actions={<UserMenu />}\n * />\n */\nexport function Navbar({\n    logo,\n    nav,\n    actions,\n    sticky = true,\n    tone = \"surface\",\n    bordered = true,\n    className,\n    ...props\n}: NavbarProps) {\n    return (\n        <header\n            className={cn(\n                styles.navbar,\n                styles[tone],\n                sticky && styles.sticky,\n                bordered && styles.bordered,\n                className,\n            )}\n            data-tempest-tone={tone === \"inverse\" ? \"inverse\" : undefined}\n            {...props}\n        >\n            {logo && <div className={styles.logo}>{logo}</div>}\n            {nav && <nav className={styles.nav}>{nav}</nav>}\n            {actions && <div className={styles.actions}>{actions}</div>}\n        </header>\n    );\n}\n"],"mappings":";;;;AA4DA,SAAgB,EAAO,EACnB,SACA,QACA,YACA,YAAS,IACT,UAAO,WACP,cAAW,IACX,cACA,GAAG,KACS;CACZ,OACI,kBAAC,UAAD;EACI,WAAW,EACP,EAAO,QACP,EAAO,IACP,KAAU,EAAO,QACjB,KAAY,EAAO,UACnB,CACJ;EACA,qBAAmB,MAAS,YAAY,YAAY,KAAA;EACpD,GAAI;EATR,UAAA;GAWK,KAAQ,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAO,UAAA;GAAU,CAAA;GAChD,KAAO,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAM,UAAA;GAAS,CAAA;GAC7C,KAAW,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAU,UAAA;GAAa,CAAA;EACtD;;AAEhB"}
+{"version":3,"file":"Navbar.js","names":["styles","Navbar_module_default","Navbar","props","cn","tone","sticky","bordered","className","logo","nav","actions"],"sources":["../../../src/components/Navbar/Navbar.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./Navbar.module.css\";\n\n/**\n * Visual tone of a {@link Navbar}.\n *\n * - `\"surface\"` — the page's surface and text.\n * - `\"primary\"` — the brand fill (`--tempest-primary`) with\n *   `--tempest-primary-foreground` ink. Only the bar's own text follows the fill:\n *   components inside it keep the page's tokens. Measured in Chromium over the\n *   SDK's `#0066ff`, a link button inside it reads 1:1, muted text 1.59:1 and the\n *   focus ring 1.41:1. Fine for a bar that holds a logo and plain text.\n * - `\"inverse\"` — the inverse surface: every color token inverted inside the bar,\n *   so a primary `Button`, a link, the focus ring and muted text are measured\n *   against the fill. See {@link NavbarProps.tone}.\n * - `\"transparent\"` — no background; the text inherits.\n */\nexport type NavbarTone = \"surface\" | \"primary\" | \"inverse\" | \"transparent\";\n\nexport interface NavbarProps extends HTMLAttributes<HTMLElement> {\n    /** Left slot — typically logo + brand name. */\n    logo?: ReactNode;\n    /** Center slot — typically nav links. */\n    nav?: ReactNode;\n    /** Right slot — typically user menu / actions. */\n    actions?: ReactNode;\n    /** Make the bar sticky at the top of the scroll container. Default `true`. */\n    sticky?: boolean;\n    /**\n     * Visual tone. Default `\"surface\"`.\n     *\n     * `\"inverse\"` writes `data-tempest-tone=\"inverse\"` and paints the bar with the\n     * inverse surface's `--tempest-bg`, so the components in the slots invert with\n     * it. The tokens are opt-in: `tempest-react-sdk/styles/inverse.css` for the\n     * SDK's own blue, or `createTheme({ primary, inverse: createInverseSurface })`\n     * for yours. With neither loaded the bar falls back to the page's\n     * `--tempest-bg` and `--tempest-text` — legible, not inverted.\n     *\n     * A separate tone rather than a change to `\"primary\"`, because the inverse\n     * fill is not always the brand's `500`: for `#0066ff` it is the `800`\n     * (`#042e75`), and turning `\"primary\"` into it would repaint every bar that\n     * uses it today.\n     */\n    tone?: NavbarTone;\n    /** When set, renders a thin bottom border. Default `true`. */\n    bordered?: boolean;\n}\n\n/**\n * Top app bar. Three-slot layout (logo / nav / actions) that collapses\n * gracefully on mobile (nav slot wraps below).\n *\n * @example\n * <Navbar\n *     logo={<img src=\"/logo.svg\" alt=\"App\" />}\n *     nav={<NavLinks />}\n *     actions={<UserMenu />}\n * />\n */\nexport function Navbar({\n    logo,\n    nav,\n    actions,\n    sticky = true,\n    tone = \"surface\",\n    bordered = true,\n    className,\n    ...props\n}: NavbarProps) {\n    return (\n        <header\n            className={cn(\n                styles.navbar,\n                styles[tone],\n                sticky && styles.sticky,\n                bordered && styles.bordered,\n                className,\n            )}\n            data-tempest-tone={tone === \"inverse\" ? \"inverse\" : undefined}\n            {...props}\n        >\n            {logo && <div className={styles.logo}>{logo}</div>}\n            {nav && <nav className={styles.nav}>{nav}</nav>}\n            {actions && <div className={styles.actions}>{actions}</div>}\n        </header>\n    );\n}\n"],"mappings":";;;;AA4DA,SAAgBE,EAAO,EACnB,SACA,QACA,YACA,YAAS,IACT,UAAO,WACP,cAAW,IACX,cACA,GAAGC,KACS;CACZ,OACI,kBAAC,UAAD;EACI,WAAWC,EACPJ,EAAO,QACPA,EAAOK,IACPC,KAAUN,EAAO,QACjBO,KAAYP,EAAO,UACnBQ,CACJ;EACA,qBAAmBH,MAAS,YAAY,YAAY,KAAA;EACpD,GAAIF;EATR,UAAA;GAWKM,KAAQ,kBAAC,OAAD;IAAK,WAAWT,EAAO;IAAO,UAAAS;GAAU,CAAA;GAChDC,KAAO,kBAAC,OAAD;IAAK,WAAWV,EAAO;IAAM,UAAAU;GAAS,CAAA;GAC7CC,KAAW,kBAAC,OAAD;IAAK,WAAWX,EAAO;IAAU,UAAAW;GAAa,CAAA;EACtD;;AAEhB"}

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

@@ -1 +1 @@
-{"version":3,"file":"Navbar.module.cjs","names":[],"sources":["../../../src/components/Navbar/Navbar.module.css"],"sourcesContent":[".navbar {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-4);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    min-height: 56px;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    padding-top: max(var(--tempest-space-3), env(safe-area-inset-top, 0));\n}\n\n.navbar.surface {\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n}\n\n.navbar.primary {\n    background: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.navbar.inverse {\n    background: var(--tempest-bg);\n    color: var(--tempest-text);\n}\n\n.navbar.transparent {\n    background: transparent;\n    color: inherit;\n}\n\n.navbar.bordered {\n    border-bottom: 1px solid var(--tempest-border);\n}\n\n.navbar.sticky {\n    position: sticky;\n    top: 0;\n    z-index: 30;\n    backdrop-filter: saturate(180%) blur(8px);\n}\n\n.logo {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n}\n\n.nav {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-x: auto;\n}\n\n.actions {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 0 0 auto;\n    margin-left: auto;\n}\n"],"mappings":";"}
+{"version":3,"file":"Navbar.module.cjs","names":["navbar","surface","primary","inverse","transparent","bordered","sticky","logo","nav","actions","Navbar_module_default"],"sources":["../../../src/components/Navbar/Navbar.module.css"],"sourcesContent":[".navbar {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-4);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    min-height: 56px;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    padding-top: max(var(--tempest-space-3), env(safe-area-inset-top, 0));\n}\n\n.navbar.surface {\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n}\n\n.navbar.primary {\n    background: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.navbar.inverse {\n    background: var(--tempest-bg);\n    color: var(--tempest-text);\n}\n\n.navbar.transparent {\n    background: transparent;\n    color: inherit;\n}\n\n.navbar.bordered {\n    border-bottom: 1px solid var(--tempest-border);\n}\n\n.navbar.sticky {\n    position: sticky;\n    top: 0;\n    z-index: 30;\n    backdrop-filter: saturate(180%) blur(8px);\n}\n\n.logo {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n}\n\n.nav {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-x: auto;\n}\n\n.actions {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 0 0 auto;\n    margin-left: auto;\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"Navbar.module.js","names":[],"sources":["../../../src/components/Navbar/Navbar.module.css"],"sourcesContent":[".navbar {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-4);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    min-height: 56px;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    padding-top: max(var(--tempest-space-3), env(safe-area-inset-top, 0));\n}\n\n.navbar.surface {\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n}\n\n.navbar.primary {\n    background: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.navbar.inverse {\n    background: var(--tempest-bg);\n    color: var(--tempest-text);\n}\n\n.navbar.transparent {\n    background: transparent;\n    color: inherit;\n}\n\n.navbar.bordered {\n    border-bottom: 1px solid var(--tempest-border);\n}\n\n.navbar.sticky {\n    position: sticky;\n    top: 0;\n    z-index: 30;\n    backdrop-filter: saturate(180%) blur(8px);\n}\n\n.logo {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n}\n\n.nav {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-x: auto;\n}\n\n.actions {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 0 0 auto;\n    margin-left: auto;\n}\n"],"mappings":";"}
+{"version":3,"file":"Navbar.module.js","names":["navbar","surface","primary","inverse","transparent","bordered","sticky","logo","nav","actions","Navbar_module_default"],"sources":["../../../src/components/Navbar/Navbar.module.css"],"sourcesContent":[".navbar {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-4);\n    padding: var(--tempest-space-3) var(--tempest-space-4);\n    min-height: 56px;\n    width: 100%;\n    font-family: var(--tempest-font-sans);\n    padding-top: max(var(--tempest-space-3), env(safe-area-inset-top, 0));\n}\n\n.navbar.surface {\n    background: var(--tempest-surface);\n    color: var(--tempest-text);\n}\n\n.navbar.primary {\n    background: var(--tempest-primary);\n    color: var(--tempest-primary-foreground);\n}\n\n.navbar.inverse {\n    background: var(--tempest-bg);\n    color: var(--tempest-text);\n}\n\n.navbar.transparent {\n    background: transparent;\n    color: inherit;\n}\n\n.navbar.bordered {\n    border-bottom: 1px solid var(--tempest-border);\n}\n\n.navbar.sticky {\n    position: sticky;\n    top: 0;\n    z-index: 30;\n    backdrop-filter: saturate(180%) blur(8px);\n}\n\n.logo {\n    display: inline-flex;\n    align-items: center;\n    flex: 0 0 auto;\n}\n\n.nav {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 1 1 auto;\n    min-width: 0;\n    overflow-x: auto;\n}\n\n.actions {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    flex: 0 0 auto;\n    margin-left: auto;\n}\n"],"mappings":";"}

package/dist/components/NavigationMenu/NavigationMenu.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.cjs","names":[],"sources":["../../../src/components/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["/**\n * @tempest-limits function-lines — the body resolves the active item from the\n * current path, owns the open submenu and the hover-intent delay, all of which\n * decide the same highlighted row.\n */\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { Portal } from \"@/components/Portal\";\nimport { useAnchorPosition } from \"@/components/Portal/anchor-position\";\nimport { useEscapeLayer } from \"@/components/Portal/escape-layer\";\nimport { usePortalTabOrder } from \"@/components/Portal/tab-bridge\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationMenu.module.css\";\n\nexport interface NavigationMenuItem {\n    /** Visible label for the entry. */\n    label: ReactNode;\n    /** When set, the entry renders as an anchor. */\n    href?: string;\n    /** Invoked when the entry is activated (click / Enter). */\n    onSelect?: () => void;\n    /** Nested entries — presence turns the item into a submenu trigger. */\n    children?: NavigationMenuItem[];\n}\n\nexport interface NavigationMenuProps extends HTMLAttributes<HTMLElement> {\n    /** Top-level navigation entries. */\n    items: NavigationMenuItem[];\n    /**\n     * Render the open panel in a portal, positioned under its trigger. Default\n     * `true`.\n     *\n     * In flow, an ancestor with `overflow` other than `visible` clips the panel,\n     * and the SDK's own `Navbar` is one: its `nav` slot scrolls horizontally, and\n     * `overflow-x: auto` forces `overflow-y` to `auto` too — a submenu showed\n     * 0% of its panel there (measured in Chrome at 1440 px). In a portal the\n     * panel escapes the clip, flips at the viewport edge, stays in the tab order\n     * right after its trigger, and follows it on scroll and resize.\n     */\n    portal?: boolean;\n}\n\n/** Gap between trigger and panel, in px — the in-flow CSS uses the same 4 px. */\nconst PANEL_OFFSET = 4;\n\n/**\n * Horizontal navigation menu with hover/click/focus dropdown submenus.\n *\n * - Top-level items render in a `<nav><ul>`.\n * - Items with `children` open a submenu panel (`role=\"menu\"`) on hover, focus,\n *   or click. Only one panel is open at a time.\n * - Closes on outside click, Escape, or selecting a leaf entry.\n *\n * @example\n * <NavigationMenu\n *     items={[\n *         { label: \"Home\", href: \"/\" },\n *         {\n *             label: \"Products\",\n *             children: [\n *                 { label: \"Analytics\", href: \"/analytics\" },\n *                 { label: \"Billing\", onSelect: () => openBilling() },\n *             ],\n *         },\n *     ]}\n * />\n */\nexport function NavigationMenu({ items, portal = true, className, ...props }: NavigationMenuProps) {\n    const [clickedIndex, setClickedIndex] = useState<number>(-1);\n    const [hovered, setHovered] = useState<number>(-1);\n    const baseId = useId();\n    const rootRef = useRef<HTMLElement>(null);\n\n    const close = useCallback((): void => {\n        setClickedIndex(-1);\n        setHovered(-1);\n    }, []);\n\n    const openIndex = clickedIndex !== -1 ? clickedIndex : hovered;\n\n    const [anchorNode, setAnchorNode] = useState<HTMLLIElement | null>(null);\n    const [panelNode, setPanelNode] = useState<HTMLUListElement | null>(null);\n    const floating = portal && openIndex !== -1;\n    const floatingStyle = useAnchorPosition({\n        anchor: anchorNode,\n        floating: panelNode,\n        side: \"bottom\",\n        align: \"start\",\n        offset: PANEL_OFFSET,\n        enabled: floating,\n    });\n    usePortalTabOrder({ enabled: floating, anchor: anchorNode, panel: panelNode });\n\n    useEscapeLayer(openIndex !== -1, close);\n\n    /**\n     * Close on a press outside both the menu and the open panel.\n     *\n     * The panel is checked on its own because in a portal it is not inside the\n     * menu's root: a press on one of its entries would otherwise count as\n     * outside, close the panel on `mousedown`, and swallow the entry's click.\n     */\n    useEffect(() => {\n        if (openIndex === -1) return;\n        const onDown = (event: MouseEvent): void => {\n            const target = event.target as Node;\n            if (rootRef.current?.contains(target) || panelNode?.contains(target)) return;\n            close();\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [openIndex, close, panelNode]);\n\n    const renderLeaf = (item: NavigationMenuItem, role: \"none\" | \"menuitem\"): ReactNode => {\n        const handleClick = (): void => {\n            item.onSelect?.();\n            close();\n        };\n        if (item.href) {\n            return (\n                <a\n                    href={item.href}\n                    role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                    className={styles.link}\n                    onClick={handleClick}\n                >\n                    {item.label}\n                </a>\n            );\n        }\n        return (\n            <button\n                type=\"button\"\n                role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                className={styles.link}\n                onClick={handleClick}\n            >\n                {item.label}\n            </button>\n        );\n    };\n\n    return (\n        <nav ref={rootRef} className={cn(styles.root, className)} {...props}>\n            <ul className={styles.list}>\n                {items.map((item, index) => {\n                    const hasChildren = !!item.children && item.children.length > 0;\n                    if (!hasChildren) {\n                        return (\n                            <li key={index} className={styles.item}>\n                                {renderLeaf(item, \"none\")}\n                            </li>\n                        );\n                    }\n                    const open = openIndex === index;\n                    const panelId = `${baseId}-panel-${index}`;\n                    const panel = (\n                        <ul\n                            ref={setPanelNode}\n                            id={panelId}\n                            role=\"menu\"\n                            className={cn(styles.panel, portal && styles.portalled)}\n                            style={floatingStyle}\n                        >\n                            {item.children!.map((child, childIndex) => (\n                                <li key={childIndex} role=\"none\" className={styles.subItem}>\n                                    {renderLeaf(child, \"menuitem\")}\n                                </li>\n                            ))}\n                        </ul>\n                    );\n                    return (\n                        <li\n                            key={index}\n                            ref={open ? setAnchorNode : undefined}\n                            className={styles.item}\n                            onMouseEnter={() => setHovered(index)}\n                            onMouseLeave={() => setHovered((prev) => (prev === index ? -1 : prev))}\n                        >\n                            <button\n                                type=\"button\"\n                                className={styles.trigger}\n                                aria-haspopup=\"menu\"\n                                aria-expanded={open}\n                                aria-controls={panelId}\n                                onClick={() =>\n                                    setClickedIndex((prev) => (prev === index ? -1 : index))\n                                }\n                                onFocus={() => setHovered(index)}\n                            >\n                                {item.label}\n                            </button>\n                            {open && (portal ? <Portal>{panel}</Portal> : panel)}\n                        </li>\n                    );\n                })}\n            </ul>\n        </nav>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"NavigationMenu.cjs","names":["useState","useId","useRef","useCallback","useAnchorPosition","styles","cn","Portal","require_cn","require_escape_layer","require_Portal","require_anchor_position","require_tab_bridge","require_NavigationMenu_module","react","react_jsx_runtime","PANEL_OFFSET","NavigationMenu","props","clickedIndex","setClickedIndex","hovered","setHovered","baseId","rootRef","close","openIndex","anchorNode","setAnchorNode","panelNode","setPanelNode","floating","portal","floatingStyle","onDown","target","event","renderLeaf","handleClick","item","role","className","items","index","open","panelId","panel","child","childIndex","prev"],"sources":["../../../src/components/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["/**\n * @tempest-limits function-lines — the body resolves the active item from the\n * current path, owns the open submenu and the hover-intent delay, all of which\n * decide the same highlighted row.\n */\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { Portal } from \"@/components/Portal\";\nimport { useAnchorPosition } from \"@/components/Portal/anchor-position\";\nimport { useEscapeLayer } from \"@/components/Portal/escape-layer\";\nimport { usePortalTabOrder } from \"@/components/Portal/tab-bridge\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationMenu.module.css\";\n\nexport interface NavigationMenuItem {\n    /** Visible label for the entry. */\n    label: ReactNode;\n    /** When set, the entry renders as an anchor. */\n    href?: string;\n    /** Invoked when the entry is activated (click / Enter). */\n    onSelect?: () => void;\n    /** Nested entries — presence turns the item into a submenu trigger. */\n    children?: NavigationMenuItem[];\n}\n\nexport interface NavigationMenuProps extends HTMLAttributes<HTMLElement> {\n    /** Top-level navigation entries. */\n    items: NavigationMenuItem[];\n    /**\n     * Render the open panel in a portal, positioned under its trigger. Default\n     * `true`.\n     *\n     * In flow, an ancestor with `overflow` other than `visible` clips the panel,\n     * and the SDK's own `Navbar` is one: its `nav` slot scrolls horizontally, and\n     * `overflow-x: auto` forces `overflow-y` to `auto` too — a submenu showed\n     * 0% of its panel there (measured in Chrome at 1440 px). In a portal the\n     * panel escapes the clip, flips at the viewport edge, stays in the tab order\n     * right after its trigger, and follows it on scroll and resize.\n     */\n    portal?: boolean;\n}\n\n/** Gap between trigger and panel, in px — the in-flow CSS uses the same 4 px. */\nconst PANEL_OFFSET = 4;\n\n/**\n * Horizontal navigation menu with hover/click/focus dropdown submenus.\n *\n * - Top-level items render in a `<nav><ul>`.\n * - Items with `children` open a submenu panel (`role=\"menu\"`) on hover, focus,\n *   or click. Only one panel is open at a time.\n * - Closes on outside click, Escape, or selecting a leaf entry.\n *\n * @example\n * <NavigationMenu\n *     items={[\n *         { label: \"Home\", href: \"/\" },\n *         {\n *             label: \"Products\",\n *             children: [\n *                 { label: \"Analytics\", href: \"/analytics\" },\n *                 { label: \"Billing\", onSelect: () => openBilling() },\n *             ],\n *         },\n *     ]}\n * />\n */\nexport function NavigationMenu({ items, portal = true, className, ...props }: NavigationMenuProps) {\n    const [clickedIndex, setClickedIndex] = useState<number>(-1);\n    const [hovered, setHovered] = useState<number>(-1);\n    const baseId = useId();\n    const rootRef = useRef<HTMLElement>(null);\n\n    const close = useCallback((): void => {\n        setClickedIndex(-1);\n        setHovered(-1);\n    }, []);\n\n    const openIndex = clickedIndex !== -1 ? clickedIndex : hovered;\n\n    const [anchorNode, setAnchorNode] = useState<HTMLLIElement | null>(null);\n    const [panelNode, setPanelNode] = useState<HTMLUListElement | null>(null);\n    const floating = portal && openIndex !== -1;\n    const floatingStyle = useAnchorPosition({\n        anchor: anchorNode,\n        floating: panelNode,\n        side: \"bottom\",\n        align: \"start\",\n        offset: PANEL_OFFSET,\n        enabled: floating,\n    });\n    usePortalTabOrder({ enabled: floating, anchor: anchorNode, panel: panelNode });\n\n    useEscapeLayer(openIndex !== -1, close);\n\n    /**\n     * Close on a press outside both the menu and the open panel.\n     *\n     * The panel is checked on its own because in a portal it is not inside the\n     * menu's root: a press on one of its entries would otherwise count as\n     * outside, close the panel on `mousedown`, and swallow the entry's click.\n     */\n    useEffect(() => {\n        if (openIndex === -1) return;\n        const onDown = (event: MouseEvent): void => {\n            const target = event.target as Node;\n            if (rootRef.current?.contains(target) || panelNode?.contains(target)) return;\n            close();\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [openIndex, close, panelNode]);\n\n    const renderLeaf = (item: NavigationMenuItem, role: \"none\" | \"menuitem\"): ReactNode => {\n        const handleClick = (): void => {\n            item.onSelect?.();\n            close();\n        };\n        if (item.href) {\n            return (\n                <a\n                    href={item.href}\n                    role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                    className={styles.link}\n                    onClick={handleClick}\n                >\n                    {item.label}\n                </a>\n            );\n        }\n        return (\n            <button\n                type=\"button\"\n                role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                className={styles.link}\n                onClick={handleClick}\n            >\n                {item.label}\n            </button>\n        );\n    };\n\n    return (\n        <nav ref={rootRef} className={cn(styles.root, className)} {...props}>\n            <ul className={styles.list}>\n                {items.map((item, index) => {\n                    const hasChildren = !!item.children && item.children.length > 0;\n                    if (!hasChildren) {\n                        return (\n                            <li key={index} className={styles.item}>\n                                {renderLeaf(item, \"none\")}\n                            </li>\n                        );\n                    }\n                    const open = openIndex === index;\n                    const panelId = `${baseId}-panel-${index}`;\n                    const panel = (\n                        <ul\n                            ref={setPanelNode}\n                            id={panelId}\n                            role=\"menu\"\n                            className={cn(styles.panel, portal && styles.portalled)}\n                            style={floatingStyle}\n                        >\n                            {item.children!.map((child, childIndex) => (\n                                <li key={childIndex} role=\"none\" className={styles.subItem}>\n                                    {renderLeaf(child, \"menuitem\")}\n                                </li>\n                            ))}\n                        </ul>\n                    );\n                    return (\n                        <li\n                            key={index}\n                            ref={open ? setAnchorNode : undefined}\n                            className={styles.item}\n                            onMouseEnter={() => setHovered(index)}\n                            onMouseLeave={() => setHovered((prev) => (prev === index ? -1 : prev))}\n                        >\n                            <button\n                                type=\"button\"\n                                className={styles.trigger}\n                                aria-haspopup=\"menu\"\n                                aria-expanded={open}\n                                aria-controls={panelId}\n                                onClick={() =>\n                                    setClickedIndex((prev) => (prev === index ? -1 : index))\n                                }\n                                onFocus={() => setHovered(index)}\n                            >\n                                {item.label}\n                            </button>\n                            {open && (portal ? <Portal>{panel}</Portal> : panel)}\n                        </li>\n                    );\n                })}\n            </ul>\n        </nav>\n    );\n}\n"],"mappings":"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"}

package/dist/components/NavigationMenu/NavigationMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.js","names":[],"sources":["../../../src/components/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["/**\n * @tempest-limits function-lines — the body resolves the active item from the\n * current path, owns the open submenu and the hover-intent delay, all of which\n * decide the same highlighted row.\n */\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { Portal } from \"@/components/Portal\";\nimport { useAnchorPosition } from \"@/components/Portal/anchor-position\";\nimport { useEscapeLayer } from \"@/components/Portal/escape-layer\";\nimport { usePortalTabOrder } from \"@/components/Portal/tab-bridge\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationMenu.module.css\";\n\nexport interface NavigationMenuItem {\n    /** Visible label for the entry. */\n    label: ReactNode;\n    /** When set, the entry renders as an anchor. */\n    href?: string;\n    /** Invoked when the entry is activated (click / Enter). */\n    onSelect?: () => void;\n    /** Nested entries — presence turns the item into a submenu trigger. */\n    children?: NavigationMenuItem[];\n}\n\nexport interface NavigationMenuProps extends HTMLAttributes<HTMLElement> {\n    /** Top-level navigation entries. */\n    items: NavigationMenuItem[];\n    /**\n     * Render the open panel in a portal, positioned under its trigger. Default\n     * `true`.\n     *\n     * In flow, an ancestor with `overflow` other than `visible` clips the panel,\n     * and the SDK's own `Navbar` is one: its `nav` slot scrolls horizontally, and\n     * `overflow-x: auto` forces `overflow-y` to `auto` too — a submenu showed\n     * 0% of its panel there (measured in Chrome at 1440 px). In a portal the\n     * panel escapes the clip, flips at the viewport edge, stays in the tab order\n     * right after its trigger, and follows it on scroll and resize.\n     */\n    portal?: boolean;\n}\n\n/** Gap between trigger and panel, in px — the in-flow CSS uses the same 4 px. */\nconst PANEL_OFFSET = 4;\n\n/**\n * Horizontal navigation menu with hover/click/focus dropdown submenus.\n *\n * - Top-level items render in a `<nav><ul>`.\n * - Items with `children` open a submenu panel (`role=\"menu\"`) on hover, focus,\n *   or click. Only one panel is open at a time.\n * - Closes on outside click, Escape, or selecting a leaf entry.\n *\n * @example\n * <NavigationMenu\n *     items={[\n *         { label: \"Home\", href: \"/\" },\n *         {\n *             label: \"Products\",\n *             children: [\n *                 { label: \"Analytics\", href: \"/analytics\" },\n *                 { label: \"Billing\", onSelect: () => openBilling() },\n *             ],\n *         },\n *     ]}\n * />\n */\nexport function NavigationMenu({ items, portal = true, className, ...props }: NavigationMenuProps) {\n    const [clickedIndex, setClickedIndex] = useState<number>(-1);\n    const [hovered, setHovered] = useState<number>(-1);\n    const baseId = useId();\n    const rootRef = useRef<HTMLElement>(null);\n\n    const close = useCallback((): void => {\n        setClickedIndex(-1);\n        setHovered(-1);\n    }, []);\n\n    const openIndex = clickedIndex !== -1 ? clickedIndex : hovered;\n\n    const [anchorNode, setAnchorNode] = useState<HTMLLIElement | null>(null);\n    const [panelNode, setPanelNode] = useState<HTMLUListElement | null>(null);\n    const floating = portal && openIndex !== -1;\n    const floatingStyle = useAnchorPosition({\n        anchor: anchorNode,\n        floating: panelNode,\n        side: \"bottom\",\n        align: \"start\",\n        offset: PANEL_OFFSET,\n        enabled: floating,\n    });\n    usePortalTabOrder({ enabled: floating, anchor: anchorNode, panel: panelNode });\n\n    useEscapeLayer(openIndex !== -1, close);\n\n    /**\n     * Close on a press outside both the menu and the open panel.\n     *\n     * The panel is checked on its own because in a portal it is not inside the\n     * menu's root: a press on one of its entries would otherwise count as\n     * outside, close the panel on `mousedown`, and swallow the entry's click.\n     */\n    useEffect(() => {\n        if (openIndex === -1) return;\n        const onDown = (event: MouseEvent): void => {\n            const target = event.target as Node;\n            if (rootRef.current?.contains(target) || panelNode?.contains(target)) return;\n            close();\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [openIndex, close, panelNode]);\n\n    const renderLeaf = (item: NavigationMenuItem, role: \"none\" | \"menuitem\"): ReactNode => {\n        const handleClick = (): void => {\n            item.onSelect?.();\n            close();\n        };\n        if (item.href) {\n            return (\n                <a\n                    href={item.href}\n                    role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                    className={styles.link}\n                    onClick={handleClick}\n                >\n                    {item.label}\n                </a>\n            );\n        }\n        return (\n            <button\n                type=\"button\"\n                role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                className={styles.link}\n                onClick={handleClick}\n            >\n                {item.label}\n            </button>\n        );\n    };\n\n    return (\n        <nav ref={rootRef} className={cn(styles.root, className)} {...props}>\n            <ul className={styles.list}>\n                {items.map((item, index) => {\n                    const hasChildren = !!item.children && item.children.length > 0;\n                    if (!hasChildren) {\n                        return (\n                            <li key={index} className={styles.item}>\n                                {renderLeaf(item, \"none\")}\n                            </li>\n                        );\n                    }\n                    const open = openIndex === index;\n                    const panelId = `${baseId}-panel-${index}`;\n                    const panel = (\n                        <ul\n                            ref={setPanelNode}\n                            id={panelId}\n                            role=\"menu\"\n                            className={cn(styles.panel, portal && styles.portalled)}\n                            style={floatingStyle}\n                        >\n                            {item.children!.map((child, childIndex) => (\n                                <li key={childIndex} role=\"none\" className={styles.subItem}>\n                                    {renderLeaf(child, \"menuitem\")}\n                                </li>\n                            ))}\n                        </ul>\n                    );\n                    return (\n                        <li\n                            key={index}\n                            ref={open ? setAnchorNode : undefined}\n                            className={styles.item}\n                            onMouseEnter={() => setHovered(index)}\n                            onMouseLeave={() => setHovered((prev) => (prev === index ? -1 : prev))}\n                        >\n                            <button\n                                type=\"button\"\n                                className={styles.trigger}\n                                aria-haspopup=\"menu\"\n                                aria-expanded={open}\n                                aria-controls={panelId}\n                                onClick={() =>\n                                    setClickedIndex((prev) => (prev === index ? -1 : index))\n                                }\n                                onFocus={() => setHovered(index)}\n                            >\n                                {item.label}\n                            </button>\n                            {open && (portal ? <Portal>{panel}</Portal> : panel)}\n                        </li>\n                    );\n                })}\n            </ul>\n        </nav>\n    );\n}\n"],"mappings":"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"}
+{"version":3,"file":"NavigationMenu.js","names":["styles","NavigationMenu_module_default","PANEL_OFFSET","NavigationMenu","props","clickedIndex","setClickedIndex","useState","hovered","setHovered","baseId","useId","rootRef","useRef","close","useCallback","openIndex","anchorNode","setAnchorNode","panelNode","setPanelNode","floating","portal","floatingStyle","useAnchorPosition","usePortalTabOrder","useEscapeLayer","useEffect","onDown","target","event","renderLeaf","handleClick","item","role","cn","className","items","index","open","panelId","panel","child","childIndex","prev","Portal"],"sources":["../../../src/components/NavigationMenu/NavigationMenu.tsx"],"sourcesContent":["/**\n * @tempest-limits function-lines — the body resolves the active item from the\n * current path, owns the open submenu and the hover-intent delay, all of which\n * decide the same highlighted row.\n */\nimport { useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { Portal } from \"@/components/Portal\";\nimport { useAnchorPosition } from \"@/components/Portal/anchor-position\";\nimport { useEscapeLayer } from \"@/components/Portal/escape-layer\";\nimport { usePortalTabOrder } from \"@/components/Portal/tab-bridge\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationMenu.module.css\";\n\nexport interface NavigationMenuItem {\n    /** Visible label for the entry. */\n    label: ReactNode;\n    /** When set, the entry renders as an anchor. */\n    href?: string;\n    /** Invoked when the entry is activated (click / Enter). */\n    onSelect?: () => void;\n    /** Nested entries — presence turns the item into a submenu trigger. */\n    children?: NavigationMenuItem[];\n}\n\nexport interface NavigationMenuProps extends HTMLAttributes<HTMLElement> {\n    /** Top-level navigation entries. */\n    items: NavigationMenuItem[];\n    /**\n     * Render the open panel in a portal, positioned under its trigger. Default\n     * `true`.\n     *\n     * In flow, an ancestor with `overflow` other than `visible` clips the panel,\n     * and the SDK's own `Navbar` is one: its `nav` slot scrolls horizontally, and\n     * `overflow-x: auto` forces `overflow-y` to `auto` too — a submenu showed\n     * 0% of its panel there (measured in Chrome at 1440 px). In a portal the\n     * panel escapes the clip, flips at the viewport edge, stays in the tab order\n     * right after its trigger, and follows it on scroll and resize.\n     */\n    portal?: boolean;\n}\n\n/** Gap between trigger and panel, in px — the in-flow CSS uses the same 4 px. */\nconst PANEL_OFFSET = 4;\n\n/**\n * Horizontal navigation menu with hover/click/focus dropdown submenus.\n *\n * - Top-level items render in a `<nav><ul>`.\n * - Items with `children` open a submenu panel (`role=\"menu\"`) on hover, focus,\n *   or click. Only one panel is open at a time.\n * - Closes on outside click, Escape, or selecting a leaf entry.\n *\n * @example\n * <NavigationMenu\n *     items={[\n *         { label: \"Home\", href: \"/\" },\n *         {\n *             label: \"Products\",\n *             children: [\n *                 { label: \"Analytics\", href: \"/analytics\" },\n *                 { label: \"Billing\", onSelect: () => openBilling() },\n *             ],\n *         },\n *     ]}\n * />\n */\nexport function NavigationMenu({ items, portal = true, className, ...props }: NavigationMenuProps) {\n    const [clickedIndex, setClickedIndex] = useState<number>(-1);\n    const [hovered, setHovered] = useState<number>(-1);\n    const baseId = useId();\n    const rootRef = useRef<HTMLElement>(null);\n\n    const close = useCallback((): void => {\n        setClickedIndex(-1);\n        setHovered(-1);\n    }, []);\n\n    const openIndex = clickedIndex !== -1 ? clickedIndex : hovered;\n\n    const [anchorNode, setAnchorNode] = useState<HTMLLIElement | null>(null);\n    const [panelNode, setPanelNode] = useState<HTMLUListElement | null>(null);\n    const floating = portal && openIndex !== -1;\n    const floatingStyle = useAnchorPosition({\n        anchor: anchorNode,\n        floating: panelNode,\n        side: \"bottom\",\n        align: \"start\",\n        offset: PANEL_OFFSET,\n        enabled: floating,\n    });\n    usePortalTabOrder({ enabled: floating, anchor: anchorNode, panel: panelNode });\n\n    useEscapeLayer(openIndex !== -1, close);\n\n    /**\n     * Close on a press outside both the menu and the open panel.\n     *\n     * The panel is checked on its own because in a portal it is not inside the\n     * menu's root: a press on one of its entries would otherwise count as\n     * outside, close the panel on `mousedown`, and swallow the entry's click.\n     */\n    useEffect(() => {\n        if (openIndex === -1) return;\n        const onDown = (event: MouseEvent): void => {\n            const target = event.target as Node;\n            if (rootRef.current?.contains(target) || panelNode?.contains(target)) return;\n            close();\n        };\n        window.addEventListener(\"mousedown\", onDown);\n        return () => {\n            window.removeEventListener(\"mousedown\", onDown);\n        };\n    }, [openIndex, close, panelNode]);\n\n    const renderLeaf = (item: NavigationMenuItem, role: \"none\" | \"menuitem\"): ReactNode => {\n        const handleClick = (): void => {\n            item.onSelect?.();\n            close();\n        };\n        if (item.href) {\n            return (\n                <a\n                    href={item.href}\n                    role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                    className={styles.link}\n                    onClick={handleClick}\n                >\n                    {item.label}\n                </a>\n            );\n        }\n        return (\n            <button\n                type=\"button\"\n                role={role === \"menuitem\" ? \"menuitem\" : undefined}\n                className={styles.link}\n                onClick={handleClick}\n            >\n                {item.label}\n            </button>\n        );\n    };\n\n    return (\n        <nav ref={rootRef} className={cn(styles.root, className)} {...props}>\n            <ul className={styles.list}>\n                {items.map((item, index) => {\n                    const hasChildren = !!item.children && item.children.length > 0;\n                    if (!hasChildren) {\n                        return (\n                            <li key={index} className={styles.item}>\n                                {renderLeaf(item, \"none\")}\n                            </li>\n                        );\n                    }\n                    const open = openIndex === index;\n                    const panelId = `${baseId}-panel-${index}`;\n                    const panel = (\n                        <ul\n                            ref={setPanelNode}\n                            id={panelId}\n                            role=\"menu\"\n                            className={cn(styles.panel, portal && styles.portalled)}\n                            style={floatingStyle}\n                        >\n                            {item.children!.map((child, childIndex) => (\n                                <li key={childIndex} role=\"none\" className={styles.subItem}>\n                                    {renderLeaf(child, \"menuitem\")}\n                                </li>\n                            ))}\n                        </ul>\n                    );\n                    return (\n                        <li\n                            key={index}\n                            ref={open ? setAnchorNode : undefined}\n                            className={styles.item}\n                            onMouseEnter={() => setHovered(index)}\n                            onMouseLeave={() => setHovered((prev) => (prev === index ? -1 : prev))}\n                        >\n                            <button\n                                type=\"button\"\n                                className={styles.trigger}\n                                aria-haspopup=\"menu\"\n                                aria-expanded={open}\n                                aria-controls={panelId}\n                                onClick={() =>\n                                    setClickedIndex((prev) => (prev === index ? -1 : index))\n                                }\n                                onFocus={() => setHovered(index)}\n                            >\n                                {item.label}\n                            </button>\n                            {open && (portal ? <Portal>{panel}</Portal> : panel)}\n                        </li>\n                    );\n                })}\n            </ul>\n        </nav>\n    );\n}\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.module.cjs","names":[],"sources":["../../../src/components/NavigationMenu/NavigationMenu.module.css"],"sourcesContent":[".root {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n}\n\n.list {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n}\n\n.item {\n    position: relative;\n}\n\n.link,\n.trigger {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    background: none;\n    border: none;\n    border-radius: var(--tempest-radius-sm);\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: inherit;\n    line-height: var(--tempest-leading-snug);\n    text-align: left;\n    text-decoration: none;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .link:hover,\n    .trigger:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.link:focus-visible,\n.trigger: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.panel {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    z-index: var(--tempest-z-dropdown);\n    min-width: 180px;\n    max-width: 320px;\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    animation: tempest-nav-menu-in var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.subItem {\n    display: block;\n}\n\n.subItem .link {\n    width: 100%;\n}\n\n@keyframes tempest-nav-menu-in {\n    from {\n        opacity: 0;\n        transform: translateY(-4px);\n    }\n    to {\n        opacity: 1;\n        transform: translateY(0);\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .panel {\n        animation: none;\n    }\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}
+{"version":3,"file":"NavigationMenu.module.cjs","names":["root","list","item","link","trigger","panel","tempestNavMenuIn","subItem","portalled","NavigationMenu_module_default"],"sources":["../../../src/components/NavigationMenu/NavigationMenu.module.css"],"sourcesContent":[".root {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n}\n\n.list {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n}\n\n.item {\n    position: relative;\n}\n\n.link,\n.trigger {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    background: none;\n    border: none;\n    border-radius: var(--tempest-radius-sm);\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: inherit;\n    line-height: var(--tempest-leading-snug);\n    text-align: left;\n    text-decoration: none;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .link:hover,\n    .trigger:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.link:focus-visible,\n.trigger: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.panel {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    z-index: var(--tempest-z-dropdown);\n    min-width: 180px;\n    max-width: 320px;\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    animation: tempest-nav-menu-in var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.subItem {\n    display: block;\n}\n\n.subItem .link {\n    width: 100%;\n}\n\n@keyframes tempest-nav-menu-in {\n    from {\n        opacity: 0;\n        transform: translateY(-4px);\n    }\n    to {\n        opacity: 1;\n        transform: translateY(0);\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .panel {\n        animation: none;\n    }\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationMenu.module.js","names":[],"sources":["../../../src/components/NavigationMenu/NavigationMenu.module.css"],"sourcesContent":[".root {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n}\n\n.list {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n}\n\n.item {\n    position: relative;\n}\n\n.link,\n.trigger {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    background: none;\n    border: none;\n    border-radius: var(--tempest-radius-sm);\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: inherit;\n    line-height: var(--tempest-leading-snug);\n    text-align: left;\n    text-decoration: none;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .link:hover,\n    .trigger:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.link:focus-visible,\n.trigger: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.panel {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    z-index: var(--tempest-z-dropdown);\n    min-width: 180px;\n    max-width: 320px;\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    animation: tempest-nav-menu-in var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.subItem {\n    display: block;\n}\n\n.subItem .link {\n    width: 100%;\n}\n\n@keyframes tempest-nav-menu-in {\n    from {\n        opacity: 0;\n        transform: translateY(-4px);\n    }\n    to {\n        opacity: 1;\n        transform: translateY(0);\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .panel {\n        animation: none;\n    }\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}
+{"version":3,"file":"NavigationMenu.module.js","names":["root","list","item","link","trigger","panel","tempestNavMenuIn","subItem","portalled","NavigationMenu_module_default"],"sources":["../../../src/components/NavigationMenu/NavigationMenu.module.css"],"sourcesContent":[".root {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n}\n\n.list {\n    display: flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    padding: 0;\n}\n\n.item {\n    position: relative;\n}\n\n.link,\n.trigger {\n    display: inline-flex;\n    align-items: center;\n    gap: var(--tempest-space-1);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    background: none;\n    border: none;\n    border-radius: var(--tempest-radius-sm);\n    color: var(--tempest-text);\n    font-family: inherit;\n    font-size: inherit;\n    line-height: var(--tempest-leading-snug);\n    text-align: left;\n    text-decoration: none;\n    cursor: pointer;\n    transition: var(--tempest-transition-color);\n}\n\n@media (hover: hover) and (pointer: fine) {\n    .link:hover,\n    .trigger:hover {\n        background-color: var(--tempest-surface);\n    }\n}\n\n.link:focus-visible,\n.trigger: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.panel {\n    position: absolute;\n    top: calc(100% + 4px);\n    left: 0;\n    z-index: var(--tempest-z-dropdown);\n    min-width: 180px;\n    max-width: 320px;\n    background-color: var(--tempest-bg);\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    box-shadow: var(--tempest-shadow-lg);\n    padding: var(--tempest-space-1);\n    list-style: none;\n    margin: 0;\n    animation: tempest-nav-menu-in var(--tempest-duration-fast) var(--tempest-ease-out);\n}\n\n.subItem {\n    display: block;\n}\n\n.subItem .link {\n    width: 100%;\n}\n\n@keyframes tempest-nav-menu-in {\n    from {\n        opacity: 0;\n        transform: translateY(-4px);\n    }\n    to {\n        opacity: 1;\n        transform: translateY(0);\n    }\n}\n\n@media (prefers-reduced-motion: reduce) {\n    .panel {\n        animation: none;\n    }\n}\n\n.portalled {\n    font-family: var(--tempest-font-sans);\n    font-size: var(--tempest-text-base);\n    z-index: var(--tempest-z-popover);\n}\n"],"mappings":";"}

package/dist/components/NavigationRail/NavigationRail.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationRail.cjs","names":[],"sources":["../../../src/components/NavigationRail/NavigationRail.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationRail.module.css\";\n\nexport interface NavigationRailItem {\n    /** Unique identifier — used as React key and for value matching. */\n    key: string;\n    /** Visible label. */\n    label: ReactNode;\n    /** Icon rendered above the label. */\n    icon?: ReactNode;\n    /** Optional badge content rendered over the icon. */\n    badge?: ReactNode;\n    /** When true, the item is not selectable. */\n    disabled?: boolean;\n}\n\nexport type NavigationRailLabelVisibility = \"all\" | \"selected\" | \"none\";\n\nexport interface NavigationRailProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    items: NavigationRailItem[];\n    /** Selected key. */\n    value: string;\n    /** Called with the new selected key on click. */\n    onChange: (key: string) => void;\n    /** Top slot — e.g. a FAB or logo. */\n    header?: ReactNode;\n    /** Bottom slot — pushed to the bottom of the rail. */\n    footer?: ReactNode;\n    /** Which item labels to show. Default `\"all\"`. */\n    labelVisibility?: NavigationRailLabelVisibility;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * Vertical, compact navigation column for desktop and tablet layouts. Each item\n * stacks an icon over its label, with the active item flagged via\n * `aria-current=\"page\"`. Use `labelVisibility=\"selected\"` to show only the\n * active item's label, or `\"none\"` for an icon-only rail.\n *\n * @example\n * <NavigationRail\n *     header={<FloatingActionButton icon={<Plus />} position=\"none\" />}\n *     items={[\n *         { key: \"home\", label: \"Início\", icon: <Home /> },\n *         { key: \"inbox\", label: \"Caixa\", icon: <Inbox />, badge: 3 },\n *     ]}\n *     value={tab}\n *     onChange={setTab}\n * />\n */\nexport function NavigationRail({\n    items,\n    value,\n    onChange,\n    header,\n    footer,\n    labelVisibility = \"all\",\n    className,\n    ...props\n}: NavigationRailProps) {\n    return (\n        <nav className={cn(styles.rail, className)} aria-label=\"Navegação lateral\" {...props}>\n            {header !== undefined && <div className={styles.header}>{header}</div>}\n            <ul className={styles.list}>\n                {items.map((item) => {\n                    const active = item.key === value;\n                    const showLabel =\n                        labelVisibility === \"all\" || (labelVisibility === \"selected\" && active);\n                    return (\n                        <li key={item.key}>\n                            <button\n                                type=\"button\"\n                                className={cn(styles.item, active && styles.active)}\n                                aria-current={active ? \"page\" : undefined}\n                                disabled={item.disabled}\n                                onClick={() => onChange(item.key)}\n                            >\n                                <span className={styles.iconWrap}>\n                                    {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                                    {item.badge !== undefined && (\n                                        <span className={styles.badge}>{item.badge}</span>\n                                    )}\n                                </span>\n                                {showLabel && <span className={styles.label}>{item.label}</span>}\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n            {footer !== undefined && <div className={styles.footer}>{footer}</div>}\n        </nav>\n    );\n}\n"],"mappings":"kHAoDA,SAAgB,EAAe,CAC3B,QACA,QACA,WACA,SACA,SACA,kBAAkB,MAClB,YACA,GAAG,GACiB,CACpB,OACI,EAAA,EAAA,KAAA,CAAC,MAAD,CAAK,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,CAAS,EAAG,aAAW,oBAAoB,GAAI,EAA/E,SAAA,CACK,IAAW,IAAA,KAAa,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,OAAS,SAAA,CAAY,CAAA,GACrE,EAAA,EAAA,IAAA,CAAC,KAAD,CAAI,UAAW,EAAA,QAAO,KACjB,SAAA,EAAM,IAAK,GAAS,CACjB,IAAM,EAAS,EAAK,MAAQ,EACtB,EACF,IAAoB,OAAU,IAAoB,YAAc,EACpE,OACI,EAAA,EAAA,IAAA,CAAC,KAAD,CAAA,UACI,EAAA,EAAA,KAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAW,EAAA,GAAG,EAAA,QAAO,KAAM,GAAU,EAAA,QAAO,MAAM,EAClD,eAAc,EAAS,OAAS,IAAA,GAChC,SAAU,EAAK,SACf,YAAe,EAAS,EAAK,GAAG,EALpC,SAAA,EAOI,EAAA,EAAA,KAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,SAAxB,SAAA,CACK,EAAK,OAAQ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,KAAO,SAAA,EAAK,IAAW,CAAA,EAC5D,EAAK,QAAU,IAAA,KACZ,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAK,KAAY,CAAA,CAEnD,CACL,CAAA,EAAA,IAAa,EAAA,EAAA,IAAA,CAAC,OAAD,CAAM,UAAW,EAAA,QAAO,MAAQ,SAAA,EAAK,KAAY,CAAA,CAC3D,CACR,CAAA,CAAA,EAhBK,EAAK,GAgBV,CAEZ,CAAC,CACD,CAAA,EACH,IAAW,IAAA,KAAa,EAAA,EAAA,IAAA,CAAC,MAAD,CAAK,UAAW,EAAA,QAAO,OAAS,SAAA,CAAY,CAAA,CACpE,GAEb"}
+{"version":3,"file":"NavigationRail.cjs","names":["cn","styles","require_cn","require_NavigationRail_module","react_jsx_runtime","NavigationRail","props","className","header","items","active","item","value","showLabel","labelVisibility","onChange","footer"],"sources":["../../../src/components/NavigationRail/NavigationRail.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationRail.module.css\";\n\nexport interface NavigationRailItem {\n    /** Unique identifier — used as React key and for value matching. */\n    key: string;\n    /** Visible label. */\n    label: ReactNode;\n    /** Icon rendered above the label. */\n    icon?: ReactNode;\n    /** Optional badge content rendered over the icon. */\n    badge?: ReactNode;\n    /** When true, the item is not selectable. */\n    disabled?: boolean;\n}\n\nexport type NavigationRailLabelVisibility = \"all\" | \"selected\" | \"none\";\n\nexport interface NavigationRailProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    items: NavigationRailItem[];\n    /** Selected key. */\n    value: string;\n    /** Called with the new selected key on click. */\n    onChange: (key: string) => void;\n    /** Top slot — e.g. a FAB or logo. */\n    header?: ReactNode;\n    /** Bottom slot — pushed to the bottom of the rail. */\n    footer?: ReactNode;\n    /** Which item labels to show. Default `\"all\"`. */\n    labelVisibility?: NavigationRailLabelVisibility;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * Vertical, compact navigation column for desktop and tablet layouts. Each item\n * stacks an icon over its label, with the active item flagged via\n * `aria-current=\"page\"`. Use `labelVisibility=\"selected\"` to show only the\n * active item's label, or `\"none\"` for an icon-only rail.\n *\n * @example\n * <NavigationRail\n *     header={<FloatingActionButton icon={<Plus />} position=\"none\" />}\n *     items={[\n *         { key: \"home\", label: \"Início\", icon: <Home /> },\n *         { key: \"inbox\", label: \"Caixa\", icon: <Inbox />, badge: 3 },\n *     ]}\n *     value={tab}\n *     onChange={setTab}\n * />\n */\nexport function NavigationRail({\n    items,\n    value,\n    onChange,\n    header,\n    footer,\n    labelVisibility = \"all\",\n    className,\n    ...props\n}: NavigationRailProps) {\n    return (\n        <nav className={cn(styles.rail, className)} aria-label=\"Navegação lateral\" {...props}>\n            {header !== undefined && <div className={styles.header}>{header}</div>}\n            <ul className={styles.list}>\n                {items.map((item) => {\n                    const active = item.key === value;\n                    const showLabel =\n                        labelVisibility === \"all\" || (labelVisibility === \"selected\" && active);\n                    return (\n                        <li key={item.key}>\n                            <button\n                                type=\"button\"\n                                className={cn(styles.item, active && styles.active)}\n                                aria-current={active ? \"page\" : undefined}\n                                disabled={item.disabled}\n                                onClick={() => onChange(item.key)}\n                            >\n                                <span className={styles.iconWrap}>\n                                    {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                                    {item.badge !== undefined && (\n                                        <span className={styles.badge}>{item.badge}</span>\n                                    )}\n                                </span>\n                                {showLabel && <span className={styles.label}>{item.label}</span>}\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n            {footer !== undefined && <div className={styles.footer}>{footer}</div>}\n        </nav>\n    );\n}\n"],"mappings":"A,kHAoDA,SAAgBK,EAAe,CAC3B,QACA,QACA,WACA,SACA,SACA,kBAAkB,MAClB,YACA,GAAGC,GACiB,CACpB,OACI,EAAAF,EAAA,KAAA,CAAC,MAAD,CAAK,UAAWJ,EAAAA,GAAGC,EAAAA,QAAO,KAAMM,CAAS,EAAG,aAAW,oBAAoB,GAAID,EAA/E,SAAA,CACKE,IAAW,IAAA,KAAa,EAAAJ,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWH,EAAAA,QAAO,OAAS,SAAAO,CAAY,CAAA,GACrE,EAAAJ,EAAA,IAAA,CAAC,KAAD,CAAI,UAAWH,EAAAA,QAAO,KACjB,SAAAQ,EAAM,IAAK,GAAS,CACjB,IAAMC,EAASC,EAAK,MAAQC,EACtBC,EACFC,IAAoB,OAAUA,IAAoB,YAAcJ,EACpE,OACI,EAAAN,EAAA,IAAA,CAAC,KAAD,CAAA,UACI,EAAAA,EAAA,KAAA,CAAC,SAAD,CACI,KAAK,SACL,UAAWJ,EAAAA,GAAGC,EAAAA,QAAO,KAAMS,GAAUT,EAAAA,QAAO,MAAM,EAClD,eAAcS,EAAS,OAAS,IAAA,GAChC,SAAUC,EAAK,SACf,YAAeI,EAASJ,EAAK,GAAG,EALpC,SAAA,EAOI,EAAAP,EAAA,KAAA,CAAC,OAAD,CAAM,UAAWH,EAAAA,QAAO,SAAxB,SAAA,CACKU,EAAK,OAAQ,EAAAP,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWH,EAAAA,QAAO,KAAO,SAAAU,EAAK,IAAW,CAAA,EAC5DA,EAAK,QAAU,IAAA,KACZ,EAAAP,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWH,EAAAA,QAAO,MAAQ,SAAAU,EAAK,KAAY,CAAA,CAEnD,CACL,CAAA,EAAAE,IAAa,EAAAT,EAAA,IAAA,CAAC,OAAD,CAAM,UAAWH,EAAAA,QAAO,MAAQ,SAAAU,EAAK,KAAY,CAAA,CAC3D,CACR,CAAA,CAAA,EAhBKA,EAAK,GAgBV,CAEZ,CAAC,CACD,CAAA,EACHK,IAAW,IAAA,KAAa,EAAAZ,EAAA,IAAA,CAAC,MAAD,CAAK,UAAWH,EAAAA,QAAO,OAAS,SAAAe,CAAY,CAAA,CACpE,C,EAEb,C"}

package/dist/components/NavigationRail/NavigationRail.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationRail.js","names":[],"sources":["../../../src/components/NavigationRail/NavigationRail.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationRail.module.css\";\n\nexport interface NavigationRailItem {\n    /** Unique identifier — used as React key and for value matching. */\n    key: string;\n    /** Visible label. */\n    label: ReactNode;\n    /** Icon rendered above the label. */\n    icon?: ReactNode;\n    /** Optional badge content rendered over the icon. */\n    badge?: ReactNode;\n    /** When true, the item is not selectable. */\n    disabled?: boolean;\n}\n\nexport type NavigationRailLabelVisibility = \"all\" | \"selected\" | \"none\";\n\nexport interface NavigationRailProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    items: NavigationRailItem[];\n    /** Selected key. */\n    value: string;\n    /** Called with the new selected key on click. */\n    onChange: (key: string) => void;\n    /** Top slot — e.g. a FAB or logo. */\n    header?: ReactNode;\n    /** Bottom slot — pushed to the bottom of the rail. */\n    footer?: ReactNode;\n    /** Which item labels to show. Default `\"all\"`. */\n    labelVisibility?: NavigationRailLabelVisibility;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * Vertical, compact navigation column for desktop and tablet layouts. Each item\n * stacks an icon over its label, with the active item flagged via\n * `aria-current=\"page\"`. Use `labelVisibility=\"selected\"` to show only the\n * active item's label, or `\"none\"` for an icon-only rail.\n *\n * @example\n * <NavigationRail\n *     header={<FloatingActionButton icon={<Plus />} position=\"none\" />}\n *     items={[\n *         { key: \"home\", label: \"Início\", icon: <Home /> },\n *         { key: \"inbox\", label: \"Caixa\", icon: <Inbox />, badge: 3 },\n *     ]}\n *     value={tab}\n *     onChange={setTab}\n * />\n */\nexport function NavigationRail({\n    items,\n    value,\n    onChange,\n    header,\n    footer,\n    labelVisibility = \"all\",\n    className,\n    ...props\n}: NavigationRailProps) {\n    return (\n        <nav className={cn(styles.rail, className)} aria-label=\"Navegação lateral\" {...props}>\n            {header !== undefined && <div className={styles.header}>{header}</div>}\n            <ul className={styles.list}>\n                {items.map((item) => {\n                    const active = item.key === value;\n                    const showLabel =\n                        labelVisibility === \"all\" || (labelVisibility === \"selected\" && active);\n                    return (\n                        <li key={item.key}>\n                            <button\n                                type=\"button\"\n                                className={cn(styles.item, active && styles.active)}\n                                aria-current={active ? \"page\" : undefined}\n                                disabled={item.disabled}\n                                onClick={() => onChange(item.key)}\n                            >\n                                <span className={styles.iconWrap}>\n                                    {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                                    {item.badge !== undefined && (\n                                        <span className={styles.badge}>{item.badge}</span>\n                                    )}\n                                </span>\n                                {showLabel && <span className={styles.label}>{item.label}</span>}\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n            {footer !== undefined && <div className={styles.footer}>{footer}</div>}\n        </nav>\n    );\n}\n"],"mappings":";;;;AAoDA,SAAgB,EAAe,EAC3B,UACA,UACA,aACA,WACA,WACA,qBAAkB,OAClB,cACA,GAAG,KACiB;CACpB,OACI,kBAAC,OAAD;EAAK,WAAW,EAAG,EAAO,MAAM,CAAS;EAAG,cAAW;EAAoB,GAAI;EAA/E,UAAA;GACK,MAAW,KAAA,KAAa,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAS,UAAA;GAAY,CAAA;GACrE,kBAAC,MAAD;IAAI,WAAW,EAAO;IACjB,UAAA,EAAM,KAAK,MAAS;KACjB,IAAM,IAAS,EAAK,QAAQ,GACtB,IACF,MAAoB,SAAU,MAAoB,cAAc;KACpE,OACI,kBAAC,MAAD,EAAA,UACI,kBAAC,UAAD;MACI,MAAK;MACL,WAAW,EAAG,EAAO,MAAM,KAAU,EAAO,MAAM;MAClD,gBAAc,IAAS,SAAS,KAAA;MAChC,UAAU,EAAK;MACf,eAAe,EAAS,EAAK,GAAG;MALpC,UAAA,CAOI,kBAAC,QAAD;OAAM,WAAW,EAAO;OAAxB,UAAA,CACK,EAAK,QAAQ,kBAAC,QAAD;QAAM,WAAW,EAAO;QAAO,UAAA,EAAK;OAAW,CAAA,GAC5D,EAAK,UAAU,KAAA,KACZ,kBAAC,QAAD;QAAM,WAAW,EAAO;QAAQ,UAAA,EAAK;OAAY,CAAA,CAEnD;MACL,CAAA,GAAA,KAAa,kBAAC,QAAD;OAAM,WAAW,EAAO;OAAQ,UAAA,EAAK;MAAY,CAAA,CAC3D;KACR,CAAA,EAAA,GAhBK,EAAK,GAgBV;IAEZ,CAAC;GACD,CAAA;GACH,MAAW,KAAA,KAAa,kBAAC,OAAD;IAAK,WAAW,EAAO;IAAS,UAAA;GAAY,CAAA;EACpE;;AAEb"}
+{"version":3,"file":"NavigationRail.js","names":["styles","NavigationRail_module_default","NavigationRail","props","cn","className","header","items","active","item","value","showLabel","labelVisibility","onChange","footer"],"sources":["../../../src/components/NavigationRail/NavigationRail.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport styles from \"./NavigationRail.module.css\";\n\nexport interface NavigationRailItem {\n    /** Unique identifier — used as React key and for value matching. */\n    key: string;\n    /** Visible label. */\n    label: ReactNode;\n    /** Icon rendered above the label. */\n    icon?: ReactNode;\n    /** Optional badge content rendered over the icon. */\n    badge?: ReactNode;\n    /** When true, the item is not selectable. */\n    disabled?: boolean;\n}\n\nexport type NavigationRailLabelVisibility = \"all\" | \"selected\" | \"none\";\n\nexport interface NavigationRailProps extends Omit<HTMLAttributes<HTMLElement>, \"onChange\"> {\n    items: NavigationRailItem[];\n    /** Selected key. */\n    value: string;\n    /** Called with the new selected key on click. */\n    onChange: (key: string) => void;\n    /** Top slot — e.g. a FAB or logo. */\n    header?: ReactNode;\n    /** Bottom slot — pushed to the bottom of the rail. */\n    footer?: ReactNode;\n    /** Which item labels to show. Default `\"all\"`. */\n    labelVisibility?: NavigationRailLabelVisibility;\n    /** Extra class names merged onto the root. */\n    className?: string;\n}\n\n/**\n * Vertical, compact navigation column for desktop and tablet layouts. Each item\n * stacks an icon over its label, with the active item flagged via\n * `aria-current=\"page\"`. Use `labelVisibility=\"selected\"` to show only the\n * active item's label, or `\"none\"` for an icon-only rail.\n *\n * @example\n * <NavigationRail\n *     header={<FloatingActionButton icon={<Plus />} position=\"none\" />}\n *     items={[\n *         { key: \"home\", label: \"Início\", icon: <Home /> },\n *         { key: \"inbox\", label: \"Caixa\", icon: <Inbox />, badge: 3 },\n *     ]}\n *     value={tab}\n *     onChange={setTab}\n * />\n */\nexport function NavigationRail({\n    items,\n    value,\n    onChange,\n    header,\n    footer,\n    labelVisibility = \"all\",\n    className,\n    ...props\n}: NavigationRailProps) {\n    return (\n        <nav className={cn(styles.rail, className)} aria-label=\"Navegação lateral\" {...props}>\n            {header !== undefined && <div className={styles.header}>{header}</div>}\n            <ul className={styles.list}>\n                {items.map((item) => {\n                    const active = item.key === value;\n                    const showLabel =\n                        labelVisibility === \"all\" || (labelVisibility === \"selected\" && active);\n                    return (\n                        <li key={item.key}>\n                            <button\n                                type=\"button\"\n                                className={cn(styles.item, active && styles.active)}\n                                aria-current={active ? \"page\" : undefined}\n                                disabled={item.disabled}\n                                onClick={() => onChange(item.key)}\n                            >\n                                <span className={styles.iconWrap}>\n                                    {item.icon && <span className={styles.icon}>{item.icon}</span>}\n                                    {item.badge !== undefined && (\n                                        <span className={styles.badge}>{item.badge}</span>\n                                    )}\n                                </span>\n                                {showLabel && <span className={styles.label}>{item.label}</span>}\n                            </button>\n                        </li>\n                    );\n                })}\n            </ul>\n            {footer !== undefined && <div className={styles.footer}>{footer}</div>}\n        </nav>\n    );\n}\n"],"mappings":";;;;AAoDA,SAAgBE,EAAe,EAC3B,UACA,UACA,aACA,WACA,WACA,qBAAkB,OAClB,cACA,GAAGC,KACiB;CACpB,OACI,kBAAC,OAAD;EAAK,WAAWC,EAAGJ,EAAO,MAAMK,CAAS;EAAG,cAAW;EAAoB,GAAIF;EAA/E,UAAA;GACKG,MAAW,KAAA,KAAa,kBAAC,OAAD;IAAK,WAAWN,EAAO;IAAS,UAAAM;GAAY,CAAA;GACrE,kBAAC,MAAD;IAAI,WAAWN,EAAO;IACjB,UAAAO,EAAM,KAAK,MAAS;KACjB,IAAMC,IAASC,EAAK,QAAQC,GACtBC,IACFC,MAAoB,SAAUA,MAAoB,cAAcJ;KACpE,OACI,kBAAC,MAAD,EAAA,UACI,kBAAC,UAAD;MACI,MAAK;MACL,WAAWJ,EAAGJ,EAAO,MAAMQ,KAAUR,EAAO,MAAM;MAClD,gBAAcQ,IAAS,SAAS,KAAA;MAChC,UAAUC,EAAK;MACf,eAAeI,EAASJ,EAAK,GAAG;MALpC,UAAA,CAOI,kBAAC,QAAD;OAAM,WAAWT,EAAO;OAAxB,UAAA,CACKS,EAAK,QAAQ,kBAAC,QAAD;QAAM,WAAWT,EAAO;QAAO,UAAAS,EAAK;OAAW,CAAA,GAC5DA,EAAK,UAAU,KAAA,KACZ,kBAAC,QAAD;QAAM,WAAWT,EAAO;QAAQ,UAAAS,EAAK;OAAY,CAAA,CAEnD;MACL,CAAA,GAAAE,KAAa,kBAAC,QAAD;OAAM,WAAWX,EAAO;OAAQ,UAAAS,EAAK;MAAY,CAAA,CAC3D;KACR,CAAA,EAAA,GAhBKA,EAAK,GAgBV;IAEZ,CAAC;GACD,CAAA;GACHK,MAAW,KAAA,KAAa,kBAAC,OAAD;IAAK,WAAWd,EAAO;IAAS,UAAAc;GAAY,CAAA;EACpE;;AAEb"}

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationRail.module.cjs","names":[],"sources":["../../../src/components/NavigationRail/NavigationRail.module.css"],"sourcesContent":[".rail {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    width: 80px;\n    height: 100%;\n    padding: var(--tempest-space-3) var(--tempest-space-2);\n    background: var(--tempest-surface);\n    border-right: 1px solid var(--tempest-border);\n    font-family: var(--tempest-font-sans);\n}\n\n.header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-bottom: var(--tempest-space-2);\n}\n\n.list {\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n\n.footer {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-top: auto;\n    padding-top: var(--tempest-space-2);\n}\n\n.item {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 4px;\n    width: 100%;\n    padding: var(--tempest-space-2) var(--tempest-space-1);\n    background: none;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n    cursor: pointer;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-2xs);\n    transition:\n        color var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out),\n        background var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n}\n\n.item:hover {\n    color: var(--tempest-text);\n    background: var(--tempest-surface-2);\n}\n\n.item:focus-visible {\n    outline: var(--tempest-focus-ring-width, 2px) solid\n        var(--tempest-focus-ring-color, currentColor);\n    outline-offset: var(--tempest-focus-ring-offset, 2px);\n}\n\n.item.active {\n    color: var(--tempest-primary-on-soft);\n    background: var(--tempest-primary-soft);\n}\n\n.item:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.iconWrap {\n    position: relative;\n    display: inline-flex;\n}\n\n.icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n    font-size: 24px;\n}\n\n.badge {\n    position: absolute;\n    top: -4px;\n    right: -8px;\n    min-width: 14px;\n    height: 14px;\n    padding: 0 4px;\n    border-radius: var(--tempest-radius-full);\n    background: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n    font-size: 10px;\n    line-height: 14px;\n    text-align: center;\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.label {\n    line-height: 1;\n    text-align: center;\n}\n"],"mappings":";"}
+{"version":3,"file":"NavigationRail.module.cjs","names":["rail","header","list","footer","item","active","iconWrap","icon","badge","label","NavigationRail_module_default"],"sources":["../../../src/components/NavigationRail/NavigationRail.module.css"],"sourcesContent":[".rail {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    width: 80px;\n    height: 100%;\n    padding: var(--tempest-space-3) var(--tempest-space-2);\n    background: var(--tempest-surface);\n    border-right: 1px solid var(--tempest-border);\n    font-family: var(--tempest-font-sans);\n}\n\n.header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-bottom: var(--tempest-space-2);\n}\n\n.list {\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n\n.footer {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-top: auto;\n    padding-top: var(--tempest-space-2);\n}\n\n.item {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 4px;\n    width: 100%;\n    padding: var(--tempest-space-2) var(--tempest-space-1);\n    background: none;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n    cursor: pointer;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-2xs);\n    transition:\n        color var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out),\n        background var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n}\n\n.item:hover {\n    color: var(--tempest-text);\n    background: var(--tempest-surface-2);\n}\n\n.item:focus-visible {\n    outline: var(--tempest-focus-ring-width, 2px) solid\n        var(--tempest-focus-ring-color, currentColor);\n    outline-offset: var(--tempest-focus-ring-offset, 2px);\n}\n\n.item.active {\n    color: var(--tempest-primary-on-soft);\n    background: var(--tempest-primary-soft);\n}\n\n.item:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.iconWrap {\n    position: relative;\n    display: inline-flex;\n}\n\n.icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n    font-size: 24px;\n}\n\n.badge {\n    position: absolute;\n    top: -4px;\n    right: -8px;\n    min-width: 14px;\n    height: 14px;\n    padding: 0 4px;\n    border-radius: var(--tempest-radius-full);\n    background: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n    font-size: 10px;\n    line-height: 14px;\n    text-align: center;\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.label {\n    line-height: 1;\n    text-align: center;\n}\n"],"mappings":";"}

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

@@ -1 +1 @@
-{"version":3,"file":"NavigationRail.module.js","names":[],"sources":["../../../src/components/NavigationRail/NavigationRail.module.css"],"sourcesContent":[".rail {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    width: 80px;\n    height: 100%;\n    padding: var(--tempest-space-3) var(--tempest-space-2);\n    background: var(--tempest-surface);\n    border-right: 1px solid var(--tempest-border);\n    font-family: var(--tempest-font-sans);\n}\n\n.header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-bottom: var(--tempest-space-2);\n}\n\n.list {\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n\n.footer {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-top: auto;\n    padding-top: var(--tempest-space-2);\n}\n\n.item {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 4px;\n    width: 100%;\n    padding: var(--tempest-space-2) var(--tempest-space-1);\n    background: none;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n    cursor: pointer;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-2xs);\n    transition:\n        color var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out),\n        background var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n}\n\n.item:hover {\n    color: var(--tempest-text);\n    background: var(--tempest-surface-2);\n}\n\n.item:focus-visible {\n    outline: var(--tempest-focus-ring-width, 2px) solid\n        var(--tempest-focus-ring-color, currentColor);\n    outline-offset: var(--tempest-focus-ring-offset, 2px);\n}\n\n.item.active {\n    color: var(--tempest-primary-on-soft);\n    background: var(--tempest-primary-soft);\n}\n\n.item:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.iconWrap {\n    position: relative;\n    display: inline-flex;\n}\n\n.icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n    font-size: 24px;\n}\n\n.badge {\n    position: absolute;\n    top: -4px;\n    right: -8px;\n    min-width: 14px;\n    height: 14px;\n    padding: 0 4px;\n    border-radius: var(--tempest-radius-full);\n    background: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n    font-size: 10px;\n    line-height: 14px;\n    text-align: center;\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.label {\n    line-height: 1;\n    text-align: center;\n}\n"],"mappings":";"}
+{"version":3,"file":"NavigationRail.module.js","names":["rail","header","list","footer","item","active","iconWrap","icon","badge","label","NavigationRail_module_default"],"sources":["../../../src/components/NavigationRail/NavigationRail.module.css"],"sourcesContent":[".rail {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: var(--tempest-space-2);\n    width: 80px;\n    height: 100%;\n    padding: var(--tempest-space-3) var(--tempest-space-2);\n    background: var(--tempest-surface);\n    border-right: 1px solid var(--tempest-border);\n    font-family: var(--tempest-font-sans);\n}\n\n.header {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-bottom: var(--tempest-space-2);\n}\n\n.list {\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    gap: var(--tempest-space-1);\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    list-style: none;\n}\n\n.footer {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    margin-top: auto;\n    padding-top: var(--tempest-space-2);\n}\n\n.item {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 4px;\n    width: 100%;\n    padding: var(--tempest-space-2) var(--tempest-space-1);\n    background: none;\n    border: 0;\n    border-radius: var(--tempest-radius-md);\n    cursor: pointer;\n    color: var(--tempest-text-muted);\n    font-size: var(--tempest-text-2xs);\n    transition:\n        color var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out),\n        background var(--tempest-duration-fast, 120ms) var(--tempest-ease-out, ease-out);\n}\n\n.item:hover {\n    color: var(--tempest-text);\n    background: var(--tempest-surface-2);\n}\n\n.item:focus-visible {\n    outline: var(--tempest-focus-ring-width, 2px) solid\n        var(--tempest-focus-ring-color, currentColor);\n    outline-offset: var(--tempest-focus-ring-offset, 2px);\n}\n\n.item.active {\n    color: var(--tempest-primary-on-soft);\n    background: var(--tempest-primary-soft);\n}\n\n.item:disabled {\n    opacity: 0.4;\n    cursor: not-allowed;\n}\n\n.iconWrap {\n    position: relative;\n    display: inline-flex;\n}\n\n.icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n    font-size: 24px;\n}\n\n.badge {\n    position: absolute;\n    top: -4px;\n    right: -8px;\n    min-width: 14px;\n    height: 14px;\n    padding: 0 4px;\n    border-radius: var(--tempest-radius-full);\n    background: var(--tempest-danger-solid);\n    color: var(--tempest-danger-on-solid);\n    font-size: 10px;\n    line-height: 14px;\n    text-align: center;\n    font-weight: var(--tempest-weight-semibold);\n}\n\n.label {\n    line-height: 1;\n    text-align: center;\n}\n"],"mappings":";"}