web-mojo 2.3.4 → 2.3.6

package/dist/chunks/TokenManager-SXKHJseu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TokenManager-SXKHJseu.js","sources":["../../src/core/views/navigation/SimpleSearchView.js","../../src/core/views/navigation/GroupSelectorButton.js","../../src/core/views/navigation/TopNav.js","../../src/core/services/TokenManager.js"],"sourcesContent":["/**\n * SimpleSearchView - Generic searchable list component\n * Displays a searchable, scrollable list of items from any Collection\n * Emits item:selected event when user selects an item\n */\n\nimport { View } from '@core/View.js';\n\n/**\n * ResultsView - Internal child view for rendering search results\n * This is only used within SimpleSearchView and handles the scrollable results area\n */\nclass ResultsView extends View {\n    constructor(options = {}) {\n        super({\n            className: 'search-results-view flex-grow-1 overflow-auto d-flex flex-column',\n            template: `\n                <div id=\"results-container\" class=\"flex-grow-1 overflow-auto\">\n                {{#data.loading}}\n                    <div class=\"text-center p-4\">\n                        <div class=\"spinner-border spinner-border-sm text-muted\" role=\"status\">\n                            <span class=\"visually-hidden\">Loading...</span>\n                        </div>\n                        <div class=\"mt-2 small text-muted\">{{data.loadingText}}</div>\n                    </div>\n                {{/data.loading}}\n\n                {{^data.loading}}\n                    {{#data.items}}\n                        <div class=\"simple-search-item position-relative\"\n                             data-action=\"select-item\"\n                             data-item-index=\"{{index}}\">\n                            {{{itemContent}}}\n\n                        </div>\n                    {{/data.items}}\n\n                    {{#data.showNoResults}}\n                        <div class=\"text-center p-4\">\n                            <i class=\"bi bi-search text-muted mb-2\" style=\"font-size: 1.5rem;\"></i>\n                            <div class=\"text-muted small\">{{data.noResultsText}}</div>\n                            <button type=\"button\"\n                                    class=\"btn btn-link btn-sm mt-2 p-0\"\n                                    data-action=\"clear-search\">\n                                Clear search\n                            </button>\n                        </div>\n                    {{/data.showNoResults}}\n\n                    {{#data.showEmpty}}\n                        <div class=\"text-center p-4\">\n                            <i class=\"{{data.emptyIcon}} text-muted mb-2\" style=\"font-size: 2rem;\"></i>\n                            <div class=\"text-muted small mb-2\">{{data.emptyText}}</div>\n                            {{#data.emptySubtext}}\n                            <div class=\"text-muted\" style=\"font-size: 0.75rem;\">\n                                {{data.emptySubtext}}\n                            </div>\n                            {{/data.emptySubtext}}\n                        </div>\n                    {{/data.showEmpty}}\n                {{/data.loading}}\n                </div>\n\n                {{#data.showResultsCount}}\n                <div class=\"border-top bg-body-tertiary p-2 text-center\">\n                    <small class=\"text-muted\">\n                        {{data.filteredCount}} of {{data.totalCount}}\n                    </small>\n                </div>\n                {{/data.showResultsCount}}\n            `,\n            ...options\n        });\n\n        this.parentView = options.parentView;\n    }\n\n    async handleActionSelectItem(event, element) {\n        event.preventDefault();\n        const itemIndex = parseInt(element.getAttribute('data-item-index'));\n        if (this.parentView) {\n            this.parentView.handleItemSelection(itemIndex);\n        }\n    }\n\n    async handleActionClearSearch(event, _element) {\n        event.preventDefault();\n\n        if (this.parentView) {\n            this.parentView.clearSearch();\n        }\n    }\n\n    async onAfterRender() {\n        if (this.parentView && this.parentView.maxHeight) {\n            const container = this.element.querySelector('#results-container');\n            if (container) {\n                container.style.maxHeight = `${this.parentView.maxHeight}px`;\n            }\n        }\n    }\n}\n\nclass SimpleSearchView extends View {\n    constructor(options = {}) {\n        super({\n            className: 'simple-search-view d-flex flex-column',\n            template: `\n                <div class=\"p-3 border-bottom bg-body-tertiary\">\n                    {{#data.headerText}}\n                    <div class=\"d-flex justify-content-between align-items-start mb-3\">\n                        <h6 class=\"text-muted fw-semibold mb-0\">\n                            {{#data.headerIcon}}<i class=\"{{data.headerIcon}} me-2\"></i>{{/data.headerIcon}}\n                            {{{data.headerText}}}\n                        </h6>\n                        {{#data.showExitButton}}\n                        <button class=\"btn btn-link p-0 text-muted simple-search-exit-btn\"\n                                type=\"button\"\n                                data-action=\"exit-view\"\n                                title=\"Exit\"\n                                aria-label=\"Exit view\">\n                            <i class=\"bi bi-x-lg\" aria-hidden=\"true\"></i>\n                        </button>\n                        {{/data.showExitButton}}\n                    </div>\n                    {{/data.headerText}}\n                    <div class=\"position-relative\">\n                        <input type=\"text\"\n                               class=\"form-control form-control-sm pe-5\"\n                               placeholder=\"{{data.searchPlaceholder}}\"\n                               value=\"{{data.searchValue}}\"\n                               data-filter=\"live-search\"\n                               data-filter-debounce=\"{{data.debounceMs}}\"\n                               data-change-action=\"search-items\">\n                        <button class=\"btn btn-link p-0 position-absolute top-50 end-0 translate-middle-y me-2 text-muted simple-search-clear-btn\"\n                                type=\"button\"\n                                data-action=\"clear-search\"\n                                title=\"Clear search\"\n                                aria-label=\"Clear search\">\n                            <i class=\"bi bi-x-circle-fill\" aria-hidden=\"true\"></i>\n                        </button>\n                    </div>\n                </div>\n\n                <div data-container=\"results\"></div>\n\n                {{#data.showFooter}}\n                <div class=\"p-3 border-top bg-body-tertiary\">\n                    <small class=\"text-muted\">\n                        <i class=\"{{data.footerIcon}} me-1\"></i>\n                        {{{data.footerContent}}}\n                    </small>\n                </div>\n                {{/data.showFooter}}\n            `,\n            ...options\n        });\n\n        // Configuration options\n        this.Collection = options.Collection;\n        this.collection = options.collection;\n        this.itemTemplate = options.itemTemplate || this.getDefaultItemTemplate();\n        this.searchFields = options.searchFields || ['name'];\n        this.collectionParams = { size: 25, ...options.collectionParams };\n\n        // UI text configuration\n        if (options.headerText === undefined) this.headerText = 'Select Item';\n        this.headerText = options.headerText;\n        this.headerIcon = options.headerIcon || 'bi bi-list';\n        this.searchPlaceholder = options.searchPlaceholder || 'Search...';\n        this.loadingText = options.loadingText || 'Loading items...';\n        this.noResultsText = options.noResultsText || 'No items match your search';\n        this.emptyText = options.emptyText || 'No items available';\n        this.emptySubtext = options.emptySubtext || null;\n        this.emptyIcon = options.emptyIcon || 'bi bi-inbox';\n        this.footerContent = options.footerContent || null;\n        this.footerIcon = options.footerIcon || 'bi bi-info-circle';\n        this.showExitButton = options.showExitButton || false;\n\n        // State\n        this.searchValue = '';\n        this.filteredItems = [];\n        this.loading = false;\n        this.hasSearched = false;\n        this.searchTimer = null;\n        this.debounceMs = options.debounceMs || 300;\n        if (options.maxHeight) {\n            this.maxHeight = options.maxHeight;\n        } else {\n            this.addClass('h-100');\n        }\n\n        // Create results child view\n        this.resultsView = new ResultsView({\n            parentView: this\n        });\n\n        if (!this.collection && this.Collection) {\n            this.collection = new this.Collection();\n        }\n\n        // Add as child view\n        this.addChild(this.resultsView);\n\n    }\n\n    onInit() {\n        // Initialize collection if provided\n        if (this.collection) {\n            this.setupCollection();\n        }\n\n        // Load items on init if collection is available\n        if (this.collection && this.options.autoLoad !== false) {\n            this.loadItems();\n        }\n    }\n\n    setupCollection() {\n        // Set collection parameters\n        Object.assign(this.collection.params, this.collectionParams);\n\n        // Listen for collection updates\n        this.collection.on('fetch:success', () => {\n            this.loading = false;\n            this.updateFilteredItems();\n        });\n\n        this.collection.on('fetch:error', () => {\n            this.loading = false;\n        });\n    }\n\n    async loadItems() {\n        if (!this.collection) {\n            console.warn('SimpleSearchView: No collection provided');\n            return;\n        }\n\n        this.loading = true;\n        this.updateResultsView();\n\n        try {\n            await this.collection.fetch();\n            this.updateFilteredItems();\n        } catch (error) {\n            console.error('Error loading items:', error);\n            const app = this.getApp();\n            app?.showError?.('Failed to load items. Please try again.');\n        } finally {\n            this.loading = false;\n            this.updateFilteredItems();\n        }\n    }\n\n    updateFilteredItems() {\n        if (!this.collection) {\n            this.filteredItems = [];\n            return;\n        }\n\n        // Server-side filtering is handled in performSearch()\n        // Just use the collection's items directly - they're already filtered by the server\n        this.filteredItems = this.collection.toJSON();\n\n        this.updateResultsView();\n    }\n\n    getNestedValue(obj, path) {\n        return path.split('.').reduce((current, key) => current?.[key], obj);\n    }\n\n    async getViewData() {\n        return {\n            searchValue: this.searchValue,\n            showFooter: !!this.footerContent,\n            showExitButton: this.showExitButton,\n            debounceMs: this.debounceMs,\n\n            // UI text\n            headerText: this.headerText,\n            headerIcon: this.headerIcon,\n            searchPlaceholder: this.searchPlaceholder,\n            footerContent: this.footerContent,\n            footerIcon: this.footerIcon\n        };\n    }\n\n    updateResultsView() {\n        if (!this.resultsView) return;\n\n        const hasItems = this.collection && this.collection.length() > 0;\n        const hasFilteredItems = this.filteredItems.length > 0;\n        const hasSearchValue = this.searchValue.length > 0;\n\n        // Process items with template\n        const processedItems = this.filteredItems.map((item, index) => {\n            return {\n                ...item,\n                index,\n                itemContent: this.processItemTemplate(item)\n            };\n        });\n\n        this.resultsView.data = {\n            loading: this.loading,\n            items: processedItems,\n            showEmpty: !this.loading && !hasItems,\n            showNoResults: !this.loading && hasItems && !hasFilteredItems && hasSearchValue,\n            showResultsCount: !this.loading && hasItems,\n            filteredCount: this.filteredItems.length,\n            totalCount: this.collection?.restEnabled\n                ? (this.collection?.meta?.count || 0)\n                : (this.collection?.length() || 0),\n\n            // UI text\n            loadingText: this.loadingText,\n            noResultsText: this.noResultsText,\n            emptyText: this.emptyText,\n            emptySubtext: this.emptySubtext,\n            emptyIcon: this.emptyIcon\n        };\n\n        this.resultsView.render();\n    }\n\n    processItemTemplate(item) {\n        let template = this.itemTemplate;\n\n        // Simple template replacement for item properties\n        template = template.replace(/\\{\\{(\\w+)\\}\\}/g, (match, prop) => {\n            return this.getNestedValue(item, prop) || '';\n        });\n\n        return template;\n    }\n\n    getDefaultItemTemplate() {\n        return `\n            <div class=\"p-3 border-bottom\">\n                <div class=\"fw-semibold text-dark\">{{name}}</div>\n                <small class=\"text-muted\">{{id}}</small>\n            </div>\n        `;\n    }\n\n    async onPassThruActionSearchItems(event, element) {\n        const searchValue = element.value || '';\n\n        console.log(\"search change...\");\n        this.searchValue = searchValue;\n        this.hasSearched = true;\n\n        // Clear existing timer\n        if (this.searchTimer) {\n            clearTimeout(this.searchTimer);\n        }\n\n        // Debounce the search\n        this.performSearch();\n    }\n\n    async performSearch() {\n        const searchParams = { ...this.collectionParams };\n        if (this.searchValue && this.searchValue.length > 1) {\n            searchParams.search = this.searchValue.trim();\n        }\n        this.collection.setParams(searchParams, true);\n    }\n\n    handleItemSelection(itemIndex) {\n        if (isNaN(itemIndex) || itemIndex < 0 || itemIndex >= this.filteredItems.length) {\n            console.error('Invalid item index:', itemIndex);\n            return;\n        }\n\n        const item = this.filteredItems[itemIndex];\n        let model = this.collection ? this.collection.get(item.id) : null;\n        if  (!model) {\n            model = new this.collection.ModelClass({ id: item.id });\n            const app = this.getApp();\n            app.showLoading();\n            model.fetch().then(() => {\n                app.hideLoading();\n                this.emit('item:selected', {\n                    item: item,\n                    model: model,\n                    index: itemIndex\n                });\n            });\n            return;\n        } else {\n            this.emit('item:selected', {\n                item: item,\n                model: model,\n                index: itemIndex\n            });\n        }\n\n    }\n\n    /**\n     * Set the collection for this search view\n     */\n    setCollection(collection) {\n        this.collection = collection;\n        this.setupCollection();\n        return this;\n    }\n\n    /**\n     * Set the item template\n     */\n    setItemTemplate(template) {\n        this.itemTemplate = template;\n        this.updateResultsView();\n        return this;\n    }\n\n    /**\n     * Set search fields\n     */\n    setSearchFields(fields) {\n        this.searchFields = Array.isArray(fields) ? fields : [fields];\n        return this;\n    }\n\n    /**\n     * Refresh items list\n     */\n    async refresh() {\n        await this.loadItems();\n    }\n\n    /**\n     * Focus the search input\n     */\n    focusSearch() {\n        const searchInput = this.element?.querySelector('input[data-action=\"search-items\"]');\n        if (searchInput) {\n            searchInput.focus();\n        }\n    }\n\n    /**\n     * Handle exit button click - emits event instead of closing\n     */\n    async handleActionExitView(event, element) {\n        this.emit('exit', { view: this });\n    }\n\n    /**\n     * Clear search and reset\n     */\n    async handleActionClearSearch(event, element) {\n        this.clearSearch();\n    }\n\n    clearSearch() {\n        this.searchValue = '';\n        this.hasSearched = false;\n        const searchInput = this.element?.querySelector('input[data-change-action=\"search-items\"]');\n        if (searchInput) {\n            searchInput.value = '';\n            searchInput.focus();\n        }\n        this.performSearch();\n    }\n\n    /**\n     * Get the number of available items\n     */\n    getItemCount() {\n        return this.collection ? this.collection.length() : 0;\n    }\n\n    /**\n     * Get the number of filtered items\n     */\n    getFilteredItemCount() {\n        return this.filteredItems.length;\n    }\n\n    /**\n     * Check if items are loaded\n     */\n    hasItems() {\n        return this.getItemCount() > 0;\n    }\n\n    /**\n     * Get current search value\n     */\n    getSearchValue() {\n        return this.searchValue;\n    }\n\n    /**\n     * Set search value programmatically\n     */\n    setSearchValue(value) {\n        this.searchValue = value || '';\n        this.hasSearched = !!this.searchValue;\n\n        const searchInput = this.element?.querySelector('input[data-action=\"search-items\"]');\n        if (searchInput) {\n            searchInput.value = this.searchValue;\n        }\n\n        this.performSearch();\n        return this;\n    }\n\n    async onAfterRender() {\n        await super.onAfterRender();\n\n        // Mount results view to container if not already mounted\n        if (this.resultsView && !this.resultsView.isMounted()) {\n            const container = this.element?.querySelector('[data-container=\"results\"]');\n            if (container) {\n                await this.resultsView.render(true, container);\n            }\n        }\n        // Update results view after main render\n        this.updateResultsView();\n    }\n\n    /**\n     * Cleanup on destroy\n     */\n    async onBeforeDestroy() {\n        if (this.searchTimer) {\n            clearTimeout(this.searchTimer);\n        }\n\n        if (this.collection) {\n            this.collection.off('update');\n        }\n\n        await super.onBeforeDestroy();\n    }\n}\n\nexport default SimpleSearchView;\n","/**\n * GroupSelectorButton - Button that shows current group and opens search dialog\n * Displays active group name in topnav, opens Dialog with SimpleSearchView for selection\n */\n\nimport View from '@core/View.js';\nimport ModalView from '@core/views/feedback/ModalView.js';\nimport SimpleSearchView from '@core/views/navigation/SimpleSearchView.js';\nimport { GroupList } from '@core/models/Group.js';\n\nclass GroupSelectorButton extends View {\n    constructor(options = {}) {\n        super({\n            tagName: 'div',\n            className: 'nav-item',\n            ...options\n        });\n\n        const app = this.getApp();\n\n        // Auto-detect Collection from app or use GroupList by default\n        this.Collection = options.Collection || app?.GroupCollection || GroupList;\n        \n        // Use existing collection or create new one\n        this.collection = options.collection || new this.Collection();\n        \n        // Auto-detect current group from app\n        this.currentGroup = options.currentGroup !== undefined \n            ? options.currentGroup \n            : app?.activeGroup;\n        \n        // UI configuration with defaults\n        this.buttonClass = options.buttonClass || 'btn btn-link nav-link';\n        this.buttonIcon = options.buttonIcon || 'bi-building';\n        this.defaultText = options.defaultText || 'Select Group';\n        \n        // SimpleSearchView configuration\n        this.itemTemplate = options.itemTemplate;\n        this.searchFields = options.searchFields || ['name'];\n        this.headerText = options.headerText || 'Select Group';\n        this.searchPlaceholder = options.searchPlaceholder || 'Search groups...';\n        \n        // Auto group selection handler\n        this.autoSetActiveGroup = options.autoSetActiveGroup !== false;\n        this.onGroupSelected = options.onGroupSelected;\n        \n        // Dialog reference\n        this.dialog = null;\n\n        // Listen for app-level group changes\n        if (app?.events) {\n            app.events.on('group:changed', (data) => {\n                if (data.group !== this.currentGroup) {\n                    this.setCurrentGroup(data.group);\n                }\n            });\n        }\n    }\n\n    async getTemplate() {\n        return `\n            <button class=\"{{buttonClass}}\" \n                    data-action=\"show-selector\"\n                    type=\"button\"\n                    style=\"white-space: nowrap; overflow: hidden; text-overflow: ellipsis;\">\n                <i class=\"{{buttonIcon}} me-1\"></i>\n                <span class=\"group-name\">{{displayName}}</span>\n            </button>\n        `;\n    }\n\n    async onBeforeRender() {\n        await super.onBeforeRender();\n        \n        console.log('GroupSelectorButton onBeforeRender - currentGroup:', this.currentGroup?.get?.('name') || this.currentGroup?.name || 'none');\n        \n        this.buttonClass = this.buttonClass;\n        this.buttonIcon = this.buttonIcon;\n        this.displayName = this.currentGroup?.get?.('name') || \n                          this.currentGroup?.name || \n                          this.defaultText;\n    }\n\n    /**\n     * Show the group selector dialog\n     */\n    async onActionShowSelector(event) {\n        // Create SimpleSearchView instance\n        const searchView = new SimpleSearchView({\n            Collection: this.Collection,\n            collection: this.collection,\n            itemTemplate: this.itemTemplate || this.getDefaultItemTemplate(),\n            searchFields: this.searchFields,\n            headerText: this.headerText,\n            searchPlaceholder: this.searchPlaceholder,\n            headerIcon: this.buttonIcon,\n            showExitButton: false\n        });\n\n        // Use ModalView directly so we keep an instance handle for hide(),\n        // on('hidden'), and destroy() — Modal.show() returns a Promise.\n        this.dialog = new ModalView({\n            title: this.headerText,\n            body: searchView,\n            size: 'md',\n            scrollable: true,\n            noBodyPadding: true,\n            buttons: [],\n            closeButton: true\n        });\n\n        // Listen for item selection (note: event is 'item:selected' not 'item-selected')\n        searchView.on('item:selected', (data) => {\n            this.handleGroupSelection(data.model || data.item);\n            if (this.dialog) {\n                this.dialog.hide();\n            }\n        });\n\n        // Clean up dialog reference when closed\n        this.dialog.on('hidden', () => {\n            this.dialog.destroy();\n            this.dialog = null;\n        });\n\n        // Render and show the dialog\n        await this.dialog.render(true, document.body);\n        this.dialog.show();\n        \n        return true; // Indicate action was handled\n    }\n\n    /**\n     * Handle group selection\n     */\n    handleGroupSelection(group) {\n        this.currentGroup = group;\n        \n        // Update button text\n        this.displayName = group?.get?.('name') || group?.name || this.defaultText;\n        this.render();\n\n        const app = this.getApp();\n\n        // Automatically set active group on app if enabled\n        if (this.autoSetActiveGroup && app?.setActiveGroup) {\n            app.setActiveGroup(group);\n        }\n\n        // Call custom handler if provided\n        if (this.onGroupSelected) {\n            this.onGroupSelected({ group });\n        }\n\n        // Emit event for parent/app to handle\n        this.emit('group-selected', { group });\n        \n        // Also emit to app events if available\n        if (app?.events) {\n            app.events.emit('group:selected', { group });\n            app.events.emit('group:changed', { group });\n        }\n    }\n\n    /**\n     * Default item template for groups (matches Sidebar pattern)\n     * Note: data-action and data-item-index are added by ResultsView wrapper\n     */\n    getDefaultItemTemplate() {\n        return `\n            <div class=\"d-flex align-items-center p-3 border-bottom\">\n                <div class=\"flex-grow-1\">\n                    <div class=\"fw-semibold text-dark\">{{name}}</div>\n                    <small class=\"text-muted\">#{{id}}  {{kind}}</small>\n                </div>\n            </div>\n        `;\n    }\n\n    /**\n     * Set the current group programmatically\n     */\n    setCurrentGroup(group) {\n        this.currentGroup = group;\n        this.displayName = group?.get?.('name') || group?.name || this.defaultText;\n        if (this.mounted) {\n            this.render();\n        }\n    }\n\n    /**\n     * Get the current group\n     */\n    getCurrentGroup() {\n        return this.currentGroup;\n    }\n}\n\nexport default GroupSelectorButton;\n","/**\n * TopNav - Bootstrap navbar component for MOJO framework\n * Provides clean, responsive top navigation\n */\n\nimport View from '@core/View.js';\nimport GroupSelectorButton from '@core/views/navigation/GroupSelectorButton.js';\n\nclass TopNav extends View {\n    constructor(options = {}) {\n        // Define theme-to-class mappings\n        const themes = {\n            light: 'navbar navbar-expand-lg navbar-light topnav-light',\n            dark: 'navbar navbar-expand-lg navbar-dark topnav-dark',\n            clean: 'navbar navbar-expand-lg navbar-light topnav-clean',\n            gradient: 'navbar navbar-expand-lg navbar-dark topnav-gradient',\n        };\n\n        // Set a default theme and determine the final class string\n        const themeName = options.theme || 'light';\n        let navbarClass = themes[themeName] || themes.light;\n\n        // Add shadow class if specified\n        if (options.shadow) {\n            navbarClass += ` topnav-shadow-${options.shadow}`;\n        }\n\n        super({\n            tagName: 'nav',\n            className: navbarClass,\n            enableTooltips: true,\n            style: 'position: relative; z-index: 1030;',\n            ...options\n        });\n\n        // Display mode configuration\n        // 'menu' | 'page' | 'both' | 'group' | 'group_page_titles'\n        this.displayMode = options.displayMode || 'both';\n        this.showPageIcon = options.showPageIcon !== false;\n        this.showPageDescription = options.showPageDescription || false;\n        this.showBreadcrumbs = options.showBreadcrumbs || false;\n        this.groupIcon = options.groupIcon || 'bi-building';\n\n        // Current page tracking\n        this.currentPage = null;\n        this.previousPage = null;\n\n        // Store raw config for processing in onBeforeRender\n        this.config = {\n            brand: options.brand || 'MOJO App',\n            brandIcon: options.brandIcon || 'bi bi-play-circle',\n            brandRoute: options.brandRoute || '/',\n            navItems: options.navItems || [],\n            rightItems: options.rightItems || [],\n            showSidebarToggle: options.showSidebarToggle || false,\n            sidebarToggleAction: options.sidebarToggleAction || 'toggle-sidebar',\n            ...options\n        };\n        this.userMenu = options.userMenu || this.findMenuItem('user');\n        if (this.userMenu) this.userMenu.id = \"user\";\n        this.loginMenu = options.loginMenu || this.findMenuItem('login');\n\n        // Setup page event listeners\n        this.setupPageListeners();\n\n        // Setup group event listeners for group display modes\n        this.setupGroupListeners();\n\n        // Store reference to group selector for click-to-open functionality\n        this.groupSelectorButton = null;\n\n        // Track current group for display modes\n        this.currentGroup = null;\n    }\n\n    findMenuItem(id) {\n        let item = this.config.navItems.find(item => item.id === id);\n        if (!item) {\n            item = this.config.rightItems.find(item => item.id === id);\n        }\n        return item || null;\n    }\n\n    replaceMenuItem(id, new_menu) {\n        // Find and replace in navItems\n        const navIndex = this.config.navItems.findIndex(item => item.id === id);\n        if (navIndex !== -1) {\n            this.config.navItems[navIndex] = new_menu;\n            return true;\n        }\n\n        // Find and replace in rightItems\n        const rightIndex = this.config.rightItems.findIndex(item => item.id === id);\n        if (rightIndex !== -1) {\n            this.config.rightItems[rightIndex] = new_menu;\n            return true;\n        }\n\n        return false;\n    }\n\n    setBrand(brand, icon=null) {\n        this.config.brand = brand;\n        this.config.brandIcon = icon || this.config.brandIcon;\n        this.render();\n    }\n\n    setUser(user) {\n        if (!user) {\n            this.replaceMenuItem('user', this.loginMenu);\n        } else {\n            this.userMenu.label = user.get(\"display_name\");\n            this._updateUserAvatar(user);\n            this.replaceMenuItem('login', this.userMenu);\n        }\n        this.setModel(user);\n    }\n\n    _onModelChange() {\n      if (this.model) {\n        this.userMenu.label = this.model.get(\"display_name\");\n        this._updateUserAvatar(this.model);\n      }\n      if (this.isMounted()) {\n          this.render();\n      }\n    }\n\n    _updateUserAvatar(user) {\n        if (!this.userMenu || !user) return;\n        const avatar = user.get('avatar');\n        if (avatar) {\n            // Extract URL from avatar object (try renditions first, then direct url)\n            const url = avatar?.renditions?.square_sm?.url || avatar?.url || (typeof avatar === 'string' ? avatar : null);\n            this.userMenu.avatarUrl = url || null;\n        } else {\n            this.userMenu.avatarUrl = null;\n        }\n    }\n\n    /**\n     * Get template based on display mode\n     */\n    async getTemplate() {\n        return `\n            <div class=\"container-fluid\">\n                {{#data.showSidebarToggle}}\n                <button class=\"topnav-sidebar-toggle me-2\" data-action=\"{{data.sidebarToggleAction}}\" aria-label=\"Toggle Sidebar\">\n                    <i class=\"bi bi-chevron-right toggle-chevron\"></i>\n                </button>\n                {{/data.showSidebarToggle}}\n\n                {{#data.showGroupInfo}}\n                <div class=\"navbar-brand d-flex align-items-center\">\n                    {{#data.groupIcon}}<i class=\"{{data.groupIcon}} me-2\"></i>{{/data.groupIcon}}\n                    <div>\n                        <span class=\"topnav-group-name\"\n                              role=\"button\"\n                              tabindex=\"0\"\n                              data-action=\"open-group-selector\"\n                              style=\"cursor: pointer;\">\n                            {{data.currentGroupName}}\n                        </span>\n                        {{#data.showPageTitle}}\n                        <span class=\"text-muted mx-2\">|</span>\n                        <span>{{data.currentPageName}}</span>\n                        {{/data.showPageTitle}}\n                    </div>\n                </div>\n                {{/data.showGroupInfo}}\n\n                {{#data.showPageInfo}}\n                <div class=\"navbar-brand d-flex align-items-center\">\n                    {{#data.currentPageIcon}}<i class=\"{{data.currentPageIcon}} me-2\"></i>{{/data.currentPageIcon}}\n                    <div>\n                        <span>{{data.currentPageName}}</span>\n                        {{#data.currentPageDescription}}\n                        <small class=\"d-block\" style=\"font-size: 0.75rem; line-height: 1;\">{{data.currentPageDescription}}</small>\n                        {{/data.currentPageDescription}}\n                    </div>\n                </div>\n                {{/data.showPageInfo}}\n\n                {{#data.showBrand}}\n                <a class=\"navbar-brand\" href=\"{{data.brandRoute}}\">\n                    {{#data.brandIcon}}<i class=\"{{data.brandIcon}} me-2\"></i>{{/data.brandIcon}}\n                    {{data.brand}}\n                </a>\n                {{/data.showBrand}}\n\n                <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#{{data.navbarId}}\">\n                    <span class=\"navbar-toggler-icon\"></span>\n                </button>\n\n                <div class=\"collapse navbar-collapse\" id=\"{{data.navbarId}}\">\n                    {{#data.showNavItems}}\n                    <ul class=\"navbar-nav me-auto mb-2 mb-lg-0\">\n                        {{#data.navItems}}\n                        <li class=\"nav-item\">\n                            <a class=\"nav-link {{#active}}active{{/active}}\" href=\"{{route}}\" {{#tooltip}}data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" data-bs-title=\"{{tooltip}}\"{{/tooltip}}>\n                                {{#icon}}<i class=\"{{icon}} me-1\"></i>{{/icon}}\n                                {{text}}\n                            </a>\n                        </li>\n                        {{/data.navItems}}\n                    </ul>\n                    {{/data.showNavItems}}\n\n                    {{#data.hasRightItems}}\n                    <div class=\"navbar-nav ms-auto\">\n                        {{#data.rightItems}}\n                        {{#isGroupSelector}}\n                        <div data-container=\"group-selector-{{id}}\"></div>\n                        {{/isGroupSelector}}\n                        {{^isGroupSelector}}\n                        {{#isDropdown}}\n                        <div class=\"nav-item dropdown\">\n                            <a class=\"nav-link dropdown-toggle\" role=\"button\" data-bs-toggle=\"dropdown\" aria-expanded=\"false\">\n                                {{#avatarUrl}}<img src=\"{{avatarUrl}}\" class=\"rounded-circle me-1\" style=\"width: 24px; height: 24px; object-fit: cover;\" alt=\"\" />{{/avatarUrl}}\n                                {{^avatarUrl}}{{#icon}}<i class=\"{{icon}} me-1\"></i>{{/icon}}{{/avatarUrl}}\n                                {{label}}\n                            </a>\n                            <ul class=\"dropdown-menu dropdown-menu-end\">\n                                {{#items}}\n                                {{#divider}}\n                                <li><hr class=\"dropdown-divider\"></li>\n                                {{/divider}}\n                                {{#isHeader}}\n                                <li><h6 class=\"dropdown-header\">{{header}}</h6></li>\n                                {{/isHeader}}\n                                {{#isHtml}}\n                                <li><span class=\"dropdown-item-text\">{{{html}}}</span></li>\n                                {{/isHtml}}\n                                {{^divider}}{{^isHeader}}{{^isHtml}}\n                                <li>\n                                    <a class=\"dropdown-item {{#active}}active{{/active}}\" role=\"button\" {{#action}}data-action=\"{{action}}\"{{/action}}>\n                                        {{#icon}}<i class=\"{{icon}} me-1\"></i>{{/icon}}\n                                        {{label}}\n                                    </a>\n                                </li>\n                                {{/isHtml}}{{/isHeader}}{{/divider}}\n                                {{/items}}\n                            </ul>\n                        </div>\n                        {{/isDropdown}}\n                        {{^isDropdown}}\n                        {{#isButton}}\n                        <button class=\"{{buttonClass}}\" data-action=\"{{action}}\" data-id=\"{{id}}\" {{#tooltip}}data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" data-bs-title=\"{{tooltip}}\"{{/tooltip}}>\n                            {{#icon}}<i class=\"{{icon}} me-1\"></i>{{/icon}}\n                            {{label}}\n                        </button>\n                        {{/isButton}}\n                        {{^isButton}}\n                        <a class=\"nav-link\" href=\"{{href}}\" {{#action}}data-action=\"{{action}}\"{{/action}} {{#tooltip}}data-bs-toggle=\"tooltip\" data-bs-placement=\"bottom\" data-bs-title=\"{{tooltip}}\"{{/tooltip}}>\n                            {{#icon}}<i class=\"{{icon}} me-1\"></i>{{/icon}}\n                            {{label}}\n                        </a>\n                        {{/isButton}}\n                        {{/isDropdown}}\n                        {{/isGroupSelector}}\n                        {{/data.rightItems}}\n                    </div>\n                    {{/data.hasRightItems}}\n                </div>\n            </div>\n        `;\n    }\n\n    /**\n     * Process and normalize data before rendering (like Sidebar)\n     */\n    async onBeforeRender() {\n        await super.onBeforeRender();\n\n        const app = this.getApp();\n        // Use cached currentGroup or fall back to app.activeGroup\n        const activeGroup = this.currentGroup || app?.activeGroup;\n\n        // Determine what to show based on display mode\n        const showGroupInfo = this.displayMode === 'group' || this.displayMode === 'group_page_titles';\n        const showPageTitle = this.displayMode === 'group_page_titles';\n        const showPageInfo = this.displayMode === 'page' || this.displayMode === 'both';\n        const showBrand = !showGroupInfo && !showPageInfo;\n        const showNavItems = this.displayMode === 'menu' || this.displayMode === 'both';\n\n        // Filter navItems based on permissions\n        const navItems = this.filterItemsByPermissions(this.config.navItems || []);\n\n        // Process right items\n        const rightItems = this.processRightItems(this.config.rightItems || []);\n\n        this.data = {\n            // Brand information\n            brand: this.config.brand,\n            brandIcon: this.config.brandIcon,\n            brandRoute: this.config.brandRoute,\n            showBrand: showBrand,\n\n            // Navbar configuration\n            navbarId: `navbar-${this.id}`,\n\n            // Navigation items\n            navItems: navItems,\n            showNavItems: showNavItems,\n\n            // Right items\n            rightItems: rightItems,\n            hasRightItems: rightItems.length > 0,\n\n            // Group display\n            showGroupInfo: showGroupInfo,\n            showPageTitle: showPageTitle,\n            currentGroupName: activeGroup?.get?.('name') || activeGroup?.name || 'Select Group',\n            groupIcon: this.groupIcon,\n\n            // Page display\n            showPageInfo: showPageInfo,\n            currentPageName: this.currentPage?.title || this.currentPage?.name || '',\n            currentPageIcon: this.currentPage?.icon || this.currentPage?.pageIcon || '',\n            currentPageDescription: this.showPageDescription ? this.currentPage?.description : '',\n\n            // Sidebar toggle\n            showSidebarToggle: this.config.showSidebarToggle,\n            sidebarToggleAction: this.config.sidebarToggleAction,\n\n            // Display mode\n            displayMode: this.displayMode\n        };\n    }\n\n    /**\n     * Process right items configuration\n     */\n    processRightItems(rightItems) {\n        return this.filterItemsByPermissions(rightItems).map(item => {\n            const processedItem = { ...item };\n\n            // Filter dropdown items by permissions and annotate special item types\n            if (item.items) {\n                processedItem.items = this.filterItemsByPermissions(item.items).map(subItem => {\n                    const processed = { ...subItem };\n                    if (subItem.divider) {\n                        // already handled by template\n                    } else if (subItem.header !== undefined) {\n                        // Category heading — renders as Bootstrap dropdown-header\n                        processed.isHeader = true;\n                    } else if (subItem.text !== undefined) {\n                        // Raw HTML text node — renders as non-interactive dropdown-item-text\n                        processed.isHtml = true;\n                        processed.html = subItem.text;\n                    }\n                    return processed;\n                });\n            }\n\n            // Check for group selector type\n            if (item.type === 'group-selector') {\n                processedItem.isGroupSelector = true;\n                processedItem.isDropdown = false;\n                processedItem.isButton = false;\n\n                // Create group selector button with smart defaults\n                // Only pass through explicitly provided options\n                const groupSelectorOptions = {\n                    containerId: `group-selector-${item.id || 'default'}`\n                };\n\n                // Only add options if explicitly provided (allow auto-detection to work)\n                if (item.Collection !== undefined) groupSelectorOptions.Collection = item.Collection;\n                if (item.collection !== undefined) groupSelectorOptions.collection = item.collection;\n                if (item.currentGroup !== undefined) groupSelectorOptions.currentGroup = item.currentGroup;\n                if (item.buttonClass !== undefined) groupSelectorOptions.buttonClass = item.buttonClass;\n                if (item.buttonIcon !== undefined) groupSelectorOptions.buttonIcon = item.buttonIcon;\n                if (item.defaultText !== undefined) groupSelectorOptions.defaultText = item.defaultText;\n                if (item.itemTemplate !== undefined) groupSelectorOptions.itemTemplate = item.itemTemplate;\n                if (item.searchFields !== undefined) groupSelectorOptions.searchFields = item.searchFields;\n                if (item.headerText !== undefined) groupSelectorOptions.headerText = item.headerText;\n                if (item.searchPlaceholder !== undefined) groupSelectorOptions.searchPlaceholder = item.searchPlaceholder;\n                if (item.autoSetActiveGroup !== undefined) groupSelectorOptions.autoSetActiveGroup = item.autoSetActiveGroup;\n                if (item.onGroupSelected !== undefined) groupSelectorOptions.onGroupSelected = item.onGroupSelected;\n\n                const groupSelector = new GroupSelectorButton(groupSelectorOptions);\n\n                // Store reference for click-to-open functionality\n                this.groupSelectorButton = groupSelector;\n\n                // Add as child view\n                this.addChild(groupSelector);\n\n            } else if (processedItem.items && processedItem.items.length > 0) {\n                // Dropdown menu\n                processedItem.isDropdown = true;\n                processedItem.isButton = false;\n            } else if (item.buttonClass) {\n                // Button\n                processedItem.isButton = true;\n                processedItem.isDropdown = false;\n            } else {\n                // Link\n                processedItem.isButton = false;\n                processedItem.isDropdown = false;\n            }\n\n            // Store handler if provided\n            if (item.handler) {\n                this.rightItemHandlers = this.rightItemHandlers || new Map();\n                this.rightItemHandlers.set(item.id, item.handler);\n            }\n\n            return processedItem;\n        });\n    }\n\n    /**\n     * Setup listeners for page change events\n     */\n    setupPageListeners() {\n        // Use global MOJO event bus if available\n        this.getApp().events.on(\"page:show\", (data) => {\n            this.onPageChanged(data);\n        });\n    }\n\n    /**\n     * Setup listeners for group change events\n     */\n    setupGroupListeners() {\n        const app = this.getApp();\n        if (!app?.events) return;\n\n        // Listen for group changes and re-render if showing group info\n        app.events.on(['group:changed', 'group:loaded'], (data) => {\n            // Update our reference to current group\n            if (data?.group) {\n                this.currentGroup = data.group;\n            }\n\n            if (this.displayMode === 'group' || this.displayMode === 'group_page_titles') {\n                if (this.mounted) {\n                    this.render();\n                }\n            }\n        });\n    }\n\n    /**\n     * Handle page before change event\n     * @param {object} data - Event data\n     */\n    onPageBeforeChange(data) {\n        // Can be used to show loading state\n        if (this.displayMode === 'page' || this.displayMode === 'both') {\n            // Optionally show loading indicator\n        }\n    }\n\n    /**\n     * Handle page changed event\n     * @param {object} data - Event data with previousPage and currentPage\n     */\n    onPageChanged(data) {\n        this.previousPage = this.currentPage;\n        this.currentPage = data.page;\n\n        // Update display based on mode\n        if (this.displayMode === 'page' || this.displayMode === 'both') {\n            this.updatePageDisplay();\n        }\n\n        // Update active menu items\n        if (this.displayMode === 'menu' || this.displayMode === 'both') {\n            if (this.currentPage && this.currentPage.route) {\n                this.updateActiveItem(this.currentPage.route);\n            }\n        }\n    }\n\n    /**\n     * Update the display to show current page info\n     */\n    updatePageDisplay() {\n        if (!this.currentPage) return;\n\n        // Just trigger re-render, onBeforeRender will handle the data processing\n        if (this.mounted) {\n            this.render();\n        }\n    }\n\n    updateActiveItem(currentRoute) {\n        // Normalize routes for comparison\n        const normalizeRoute = (route) => {\n            if (!route) return '/';\n            return route.startsWith('/') ? route : `/${route}`;\n        };\n\n        const normalizedCurrentRoute = normalizeRoute(currentRoute);\n\n        // Update active states with improved matching\n        const navItems = this.data.navItems.map(item => {\n            const normalizedItemRoute = normalizeRoute(item.route);\n\n            // Check for active state\n            let isActive = false;\n\n            if (normalizedItemRoute === '/' && normalizedCurrentRoute === '/') {\n                // Exact match for home route\n                isActive = true;\n            } else if (normalizedItemRoute !== '/' && normalizedCurrentRoute !== '/') {\n                // For non-home routes, check if current route starts with nav item route\n                // This allows /users to be active when on /users/123\n                isActive = normalizedCurrentRoute.startsWith(normalizedItemRoute) ||\n                          normalizedCurrentRoute === normalizedItemRoute;\n            }\n\n            return {\n                ...item,\n                active: isActive\n            };\n        });\n\n        this.updateData({ navItems }, true);\n    }\n\n    /**\n     * Wire any [data-bs-toggle=\"dropdown\"] elements rendered inside this\n     * TopNav so they open on click. Bootstrap's data-API doesn't always\n     * pick up dynamically-rendered toggles, so we attach instances\n     * eagerly. Re-runs after every render to cover the setUser swap\n     * (login -> userMenu) and similar reflows.\n     */\n    _attachDropdowns() {\n        if (!this.element) return;\n        if (!window.bootstrap?.Dropdown) {\n            if (!TopNav._warnedNoBootstrap) {\n                TopNav._warnedNoBootstrap = true;\n                console.warn('[TopNav] window.bootstrap.Dropdown not available — dropdown toggles will not auto-attach.');\n            }\n            return;\n        }\n        const toggles = this.element.querySelectorAll('[data-bs-toggle=\"dropdown\"]');\n        toggles.forEach(el => window.bootstrap.Dropdown.getOrCreateInstance(el));\n    }\n\n    async onAfterRender() {\n        await super.onAfterRender();\n        this._attachDropdowns();\n    }\n\n    onPassThruActionProfile() {\n        // Implement profile functionality here\n        this.getApp().events.emit(\"portal:action\", {action: \"profile\"});\n    }\n\n    onActionSettings() {\n        // Implement settings functionality here\n        this.getApp().events.emit(\"portal:action\", {action: \"settings\"});\n    }\n\n    onActionLogout() {\n        // Implement logout functionality here\n        this.getApp().events.emit(\"auth:logout\", {action: \"logout\"});\n    }\n\n    /**\n     * Handle open group selector action (from clicking group name in brand)\n     */\n    async onActionOpenGroupSelector(event) {\n        // If we have a group selector button, trigger its dialog\n        if (this.groupSelectorButton) {\n            await this.groupSelectorButton.onActionShowSelector(event);\n            return true;\n        }\n\n        // If no group selector in rightItems, create a temporary one\n        const { GroupList } = await import('@core/models/Group.js');\n        const tempSelector = new GroupSelectorButton({\n            Collection: GroupList,\n            currentGroup: this.getApp()?.activeGroup\n        });\n\n        await tempSelector.onActionShowSelector(event);\n        return true;\n    }\n\n    /**\n     * Handle dynamic action dispatch for right items\n     */\n    async handleAction(actionName, event, element) {\n        // Check for custom handler first\n        const itemId = element.getAttribute('data-id');\n        if (itemId && this.rightItemHandlers && this.rightItemHandlers.has(itemId)) {\n            const handler = this.rightItemHandlers.get(itemId);\n            if (typeof handler === 'function') {\n                return await handler.call(this, actionName, event, element);\n            }\n        }\n\n        // Fallback to default action methods\n        const methodName = `onAction${actionName.charAt(0).toUpperCase() + actionName.slice(1).replace(/-([a-z])/g, (g) => g[1].toUpperCase())}`;\n        if (typeof this[methodName] === 'function') {\n            return await this[methodName](event, element);\n        }\n\n        // Emit action event if no handler found\n        this.emit('action', {\n            action: actionName,\n            event: event,\n            element: element,\n            topnav: this\n        });\n    }\n\n    /**\n     * Handle default actions by searching through rightItems and navItems\n     */\n    async onActionDefault(action, event, el) {\n        // Check navItems first\n        if (this.config.navItems) {\n            for (const item of this.config.navItems) {\n                if (item.action === action && item.handler) {\n                    await item.handler.call(this, action, event, el);\n                    return true;\n                }\n            }\n        }\n\n        // Check rightItems\n        if (this.config.rightItems) {\n            for (const item of this.config.rightItems) {\n                if (item.action === action && item.handler) {\n                    await item.handler.call(this, action, event, el);\n                    return true;\n                }\n                // Also check dropdown items\n                if (item.items) {\n                    for (const subItem of item.items) {\n                        if (subItem.action === action && subItem.handler) {\n                            await subItem.handler.call(this, action, event, el);\n                            return true;\n                        }\n                    }\n                }\n            }\n        }\n\n        this.getApp().events.emit(\"portal:action\", { action, event, el });\n\n        return false;\n    }\n\n    /**\n     * Filter items by user permissions\n     */\n    filterItemsByPermissions(items) {\n        if (!items) return [];\n\n        const app = this.getApp();\n        const activeUser = app?.activeUser;\n\n        return items.filter(item => {\n            // If item has permissions and user exists, check permissions\n            if (item.permissions && activeUser) {\n                return activeUser.hasPermission(item.permissions);\n            }\n            // If no permissions required or no user, show the item\n            return true;\n        });\n    }\n\n}\n\nexport default TopNav;\n","/**\n * AuthRequiredError - Thrown by the pre-request auth gate when the access\n * token is expired and cannot be refreshed. Rest recognizes it by name and\n * short-circuits the request to a 401 response without calling fetch.\n */\nexport class AuthRequiredError extends Error {\n    constructor(message = 'Authentication required') {\n        super(message);\n        this.name = 'AuthRequiredError';\n        this.reason = 'unauthorized';\n    }\n}\n\n/**\n * Token - Individual JWT token handling\n * Handles decoding, validation, and data extraction for a single token\n */\nclass Token {\n    constructor(token) {\n        this.token = token;\n        this.payload = null;\n        this.uid = null;\n        this.email = null;\n        this.name = null;\n        this.exp = null;\n        this.iat = null;\n        this.isValidToken = false;\n\n        this._decode();\n    }\n\n    /**\n     * Decode JWT token payload (client-side only, no verification)\n     * @private\n     */\n    _decode() {\n        if (!this.token || typeof this.token !== 'string') {\n            return;\n        }\n\n        try {\n            const parts = this.token.split('.');\n            if (parts.length !== 3) {\n                return;\n            }\n\n            // Decode the payload (second part)\n            const payload = parts[1];\n\n            // Handle URL-safe base64\n            let base64 = payload.replace(/-/g, '+').replace(/_/g, '/');\n            const padding = 4 - (base64.length % 4);\n            if (padding !== 4) {\n                base64 += '='.repeat(padding);\n            }\n\n            const decoded = atob(base64);\n            this.payload = JSON.parse(decoded);\n\n            // Extract common properties\n            this.uid = this.payload.uid || this.payload.sub || this.payload.user_id || null;\n            this.email = this.payload.email || null;\n            this.name = this.payload.name || this.payload.username || null;\n            this.exp = this.payload.exp ? new Date(this.payload.exp * 1000) : null;\n            this.iat = this.payload.iat ? new Date(this.payload.iat * 1000) : null;\n\n            // Determine validity\n            this.isValidToken = this._checkValidity();\n        } catch (error) {\n            this.payload = null;\n        }\n    }\n\n    /**\n     * Check token validity\n     * @private\n     * @returns {boolean} True if token is valid\n     */\n    _checkValidity() {\n        if (!this.token || !this.payload) {\n            return false;\n        }\n\n        // Check expiry if present\n        if (this.payload.exp) {\n            const now = Math.floor(Date.now() / 1000);\n            return now < this.payload.exp;\n        }\n\n        // If no expiry, consider valid\n        return true;\n    }\n\n    /**\n     * Decode JWT token payload (client-side only, no verification)\n     * @returns {object|null} Decoded payload or null if invalid\n     */\n    decode() {\n        return this.payload;\n    }\n\n    /**\n     * Get user ID from token\n     * @returns {string|null} User ID or null if not found\n     */\n    getUserId() {\n        return this.uid;\n    }\n\n    /**\n     * Check if token is valid (exists and not expired)\n     * @returns {boolean} True if token is valid\n     */\n    isValid() {\n        return this.isValidToken;\n    }\n\n    /**\n     * Check if token will expire soon\n     * @param {number} thresholdMinutes - Minutes before expiry to consider \"soon\"\n     * @returns {boolean} True if expiring soon\n     */\n    isExpiringSoon(thresholdMinutes = 5) {\n        if (!this.payload?.exp) {\n            return false;\n        }\n\n        const now = Math.floor(Date.now() / 1000);\n        const threshold = thresholdMinutes * 60;\n        return (this.payload.exp - now) <= threshold;\n    }\n\n    /**\n     * Check if token is expired\n     * @returns {boolean} True if expired\n     */\n    isExpired() {\n        if (!this.payload?.exp) {\n            return false;\n        }\n\n        const now = Math.floor(Date.now() / 1000);\n        return now >= this.payload.exp;\n    }\n\n    /**\n     * Get token age in minutes\n     * @returns {number|null} Age in minutes since token was issued, or null if no iat\n     */\n    getAgeMinutes() {\n        if (!this.payload?.iat) {\n            return null;\n        }\n        const now = Math.floor(Date.now() / 1000);\n        const ageSeconds = now - this.payload.iat;\n        return Math.floor(ageSeconds / 60);\n    }\n\n    /**\n     * Get authorization header value\n     * @returns {string|null} Bearer token string or null if no token\n     */\n    getAuthHeader() {\n        return this.token ? `Bearer ${this.token}` : null;\n    }\n\n    /**\n     * Get basic user info from token\n     * @returns {object|null} User info or null\n     */\n    getUserInfo() {\n        if (!this.payload) {\n            return null;\n        }\n\n        return {\n            uid: this.uid,\n            email: this.email,\n            name: this.name,\n            exp: this.exp,\n            iat: this.iat\n        };\n    }\n}\n\n/**\n * TokenManager - Simplified JWT token handling for MOJO Auth\n * Focuses on core token operations: storage, validation, and user ID extraction\n */\n\nexport default class TokenManager {\n    constructor() {\n        this.tokenKey = 'access_token';\n        this.refreshTokenKey = 'refresh_token';\n        this.authCodeKey = 'auth_code';\n        this.tokenInstance = null;\n        // Single-flight guard for refreshToken(). Holds the in-flight\n        // Promise<boolean> while a refresh is pending; null otherwise.\n        this._refreshPromise = null;\n        // Single-flight guard for handleAuthCodeFromURL() / exchangeAuthCode().\n        this._exchangePromise = null;\n    }\n\n    /**\n     * Store authentication tokens\n     * @param {string} token - Access token\n     * @param {string} refreshToken - Refresh token (optional)\n     * @param {boolean} persistent - Use localStorage if true, sessionStorage if false\n     */\n    setTokens(token, refreshToken = null, persistent = true) {\n        const storage = persistent ? localStorage : sessionStorage;\n        this.tokenInstance = new Token(token);\n        if (token) {\n            storage.setItem(this.tokenKey, token);\n        }\n\n        if (refreshToken) {\n            storage.setItem(this.refreshTokenKey, refreshToken);\n        }\n    }\n\n    /**\n     * Get stored access token\n     * @returns {string|null} Access token or null if not found\n     */\n    getToken() {\n        return localStorage.getItem(this.tokenKey) ||\n               sessionStorage.getItem(this.tokenKey);\n    }\n\n    /**\n     * Get stored refresh token\n     * @returns {string|null} Refresh token or null if not found\n     */\n    getRefreshToken() {\n        return localStorage.getItem(this.refreshTokenKey) ||\n               sessionStorage.getItem(this.refreshTokenKey);\n    }\n\n    /**\n     * Clear all stored tokens\n     */\n    clearTokens() {\n        localStorage.removeItem(this.tokenKey);\n        localStorage.removeItem(this.refreshTokenKey);\n        sessionStorage.removeItem(this.tokenKey);\n        sessionStorage.removeItem(this.refreshTokenKey);\n    }\n\n    /**\n     * Get Token instance for current stored token\n     * @returns {Token|null} Token instance or null if no token\n     */\n    getTokenInstance() {\n        const currentToken = this.getToken();\n\n        // If no token stored, clear instance and return null\n        if (!currentToken) {\n            this.tokenInstance = null;\n            return null;\n        }\n\n        // If instance doesn't exist or token changed, create new instance\n        if (!this.tokenInstance || this.tokenInstance.token !== currentToken) {\n            this.tokenInstance = new Token(currentToken);\n        }\n\n        return this.tokenInstance;\n    }\n\n    /**\n     * Get Token instance for refresh token\n     * @returns {Token|null} Token instance or null if no refresh token\n     */\n    getRefreshTokenInstance() {\n        const currentRefreshToken = this.getRefreshToken();\n\n        // If no refresh token stored, clear instance and return null\n        if (!currentRefreshToken) {\n            this._refreshTokenInstance = null;\n            return null;\n        }\n\n        // If instance doesn't exist or token changed, create new instance\n        if (!this._refreshTokenInstance || this._refreshTokenInstance.token !== currentRefreshToken) {\n            this._refreshTokenInstance = new Token(currentRefreshToken);\n        }\n\n        return this._refreshTokenInstance;\n    }\n\n    /**\n     * Decode JWT token payload (client-side only, no verification)\n     * @param {string} token - JWT token\n     * @returns {object|null} Decoded payload or null if invalid\n     */\n    decode(token = null) {\n        const jwt = token || this.getToken();\n        return new Token(jwt).decode();\n    }\n\n    /**\n     * Get user ID from token\n     * @returns {string|null} User ID or null if not found\n     */\n    getUserId() {\n        const currentToken = this.getTokenInstance();\n        return currentToken ? currentToken.getUserId() : null;\n    }\n\n    /**\n     * Check if current token is valid (exists and not expired)\n     * @returns {boolean} True if token is valid\n     */\n    isValid() {\n        const currentToken = this.getTokenInstance();\n        return currentToken ? currentToken.isValid() : false;\n    }\n\n    /**\n     * Check if token will expire soon\n     * @param {number} thresholdMinutes - Minutes before expiry to consider \"soon\"\n     * @returns {boolean} True if expiring soon\n     */\n    isExpiringSoon(thresholdMinutes = 5) {\n        const currentToken = this.getTokenInstance();\n        return currentToken ? currentToken.isExpiringSoon(thresholdMinutes) : false;\n    }\n\n    /**\n     * Get authorization header value\n     * @returns {string|null} Bearer token string or null if no token\n     */\n    getAuthHeader() {\n        const currentToken = this.getTokenInstance();\n        return currentToken ? currentToken.getAuthHeader() : null;\n    }\n\n    /**\n     * Get basic user info from token\n     * @returns {object|null} User info or null\n     */\n    getUserInfo() {\n        const currentToken = this.getTokenInstance();\n        return currentToken ? currentToken.getUserInfo() : null;\n    }\n\n    /**\n     * Check current token status and determine what action is needed\n     * @returns {object} Status object with action and details\n     */\n    checkTokenStatus() {\n        const token = this.getTokenInstance();\n        const refreshToken = this.getRefreshTokenInstance();\n\n        // If no access token or it's invalid/expired\n        if (!token || !token.isValid() || token.isExpired()) {\n            // Check if refresh is possible\n            if (!refreshToken || !refreshToken.isValid() || refreshToken.isExpired()) {\n                return {\n                    action: 'logout',\n                    reason: 'Both access and refresh tokens are invalid/expired'\n                };\n            }\n\n            return {\n                action: 'refresh',\n                reason: 'Access token invalid/expired but refresh token valid'\n            };\n        }\n\n        // Access token is valid - check if it needs refreshing soon\n        if (token.isExpiringSoon(10) || (token.getAgeMinutes() && token.getAgeMinutes() > 60)) {\n            // Only suggest refresh if refresh token is still valid\n            if (!refreshToken || !refreshToken.isValid() || refreshToken.isExpired()) {\n                return {\n                    action: 'none',\n                    reason: 'Access token expiring but refresh token invalid'\n                };\n            }\n\n            return {\n                action: 'refresh',\n                reason: 'Access token expiring soon or aged'\n            };\n        }\n\n        return {\n            action: 'none',\n            reason: 'All tokens valid and not expiring soon'\n        };\n    }\n\n    /**\n     * Check tokens and take appropriate action\n     * @param {object} app - App instance for events and API calls\n     * @returns {Promise<boolean>} True if action was taken\n     */\n    async checkAndRefreshTokens(app) {\n        const status = this.checkTokenStatus();\n\n        switch (status.action) {\n            case 'logout':\n                app.events.emit(\"auth:unauthorized\");\n                this.stopAutoRefresh();\n                return true;\n\n            case 'refresh':\n                await this.refreshToken(app);\n                return true;\n\n            default:\n                return false;\n        }\n    }\n\n    startAutoRefresh(app) {\n        this.stopAutoRefresh();\n        this._tokenWatcher = setInterval(() => {\n            this.checkAndRefreshTokens(app);\n        }, 60000);\n    }\n\n    stopAutoRefresh() {\n        if (this._tokenWatcher) {\n            clearInterval(this._tokenWatcher);\n            this._tokenWatcher = null;\n        }\n    }\n\n    /**\n     * Refresh the access token using the stored refresh token.\n     * Single-flight: concurrent callers share one in-flight POST.\n     * @param {object} app - App instance (needs .rest and .events)\n     * @returns {Promise<boolean>} true on success, false on any failure\n     */\n    async refreshToken(app) {\n        if (this._refreshPromise) {\n            return this._refreshPromise;\n        }\n\n        this._refreshPromise = this._doRefresh(app).finally(() => {\n            this._refreshPromise = null;\n        });\n\n        return this._refreshPromise;\n    }\n\n    /**\n     * Perform the actual refresh network call. Always resolves to a boolean;\n     * never throws. Emits auth:unauthorized / auth:token:refresh:failed on\n     * failure paths, matching prior behavior.\n     * @private\n     */\n    async _doRefresh(app) {\n        const refreshTokenInstance = this.getRefreshTokenInstance();\n\n        // Double-check refresh token validity before attempting refresh\n        if (!refreshTokenInstance || !refreshTokenInstance.isValid() || refreshTokenInstance.isExpired()) {\n            app.events.emit(\"auth:unauthorized\");\n            this.stopAutoRefresh();\n            return false;\n        }\n\n        try {\n            const response = await app.rest.POST('/api/token/refresh', {\n                refresh_token: refreshTokenInstance.token\n            });\n\n            const { access_token, refresh_token } = response.data.data;\n\n            // Clear old cached instances so new tokens are loaded\n            this.tokenInstance = null;\n            this._refreshTokenInstance = null;\n\n            // Store new tokens\n            this.setTokens(access_token, refresh_token);\n            app.rest.setAuthToken(access_token);\n\n            // Emit success event\n            app.events.emit('auth:token:refreshed', {\n                newToken: access_token,\n                newRefreshToken: refresh_token\n            });\n\n            console.log('Token refreshed successfully');\n            return true;\n        } catch (error) {\n            // Check if it's an authentication error (refresh token invalid)\n            if (error.status === 401 || error.status === 403) {\n                app.events.emit(\"auth:unauthorized\");\n                this.stopAutoRefresh();\n            } else {\n                // For other errors, emit specific event but don't logout\n                app.events.emit('auth:token:refresh:failed', { error });\n            }\n            return false;\n        }\n    }\n\n    /**\n     * Read an `?auth_code=` param from window.location, scrub it from the URL,\n     * and exchange it for tokens. Resolves to the user dict on success or\n     * null when no param is present or the exchange fails. Never throws.\n     *\n     * The URL scrub happens *synchronously*, before any await — the auth\n     * code is held in a closure local so a slow exchange cannot leak it to\n     * third-party scripts that read location.search after page load.\n     *\n     * Single-flight: concurrent callers (e.g. PortalApp boot + a custom\n     * AuthApp boot) share the same in-flight POST.\n     *\n     * @param {object} app - App instance (needs .rest and .events)\n     * @returns {Promise<object|null>} user dict on success, null otherwise\n     */\n    async handleAuthCodeFromURL(app) {\n        if (this._exchangePromise) {\n            return this._exchangePromise;\n        }\n\n        if (typeof window === 'undefined' || !window.location) {\n            return null;\n        }\n\n        const params = new URLSearchParams(window.location.search);\n        const code = params.get(this.authCodeKey);\n        if (!code) {\n            return null;\n        }\n\n        // Scrub before any network call.\n        params.delete(this.authCodeKey);\n        const remaining = params.toString();\n        const cleanUrl = window.location.pathname\n            + (remaining ? `?${remaining}` : '')\n            + (window.location.hash || '');\n        window.history.replaceState({}, '', cleanUrl);\n\n        return this.exchangeAuthCode(app, code);\n    }\n\n    /**\n     * Exchange a one-time auth handoff code for access + refresh tokens.\n     * Stores tokens via setTokens() and emits 'auth:login' on success;\n     * emits 'auth:exchange:failed' on any failure. Never throws.\n     *\n     * Single-flight: concurrent callers share one in-flight POST. Mirrors\n     * the refreshToken() pattern.\n     *\n     * @param {object} app - App instance (needs .rest and .events)\n     * @param {string} code - 32-hex auth handoff code\n     * @returns {Promise<object|null>} user dict on success, null on failure\n     */\n    async exchangeAuthCode(app, code) {\n        if (this._exchangePromise) {\n            return this._exchangePromise;\n        }\n\n        this._exchangePromise = this._doExchange(app, code).finally(() => {\n            this._exchangePromise = null;\n        });\n\n        return this._exchangePromise;\n    }\n\n    /**\n     * Perform the actual exchange network call. Always resolves; never\n     * throws. Emits auth:login on success, auth:exchange:failed on failure.\n     * @private\n     */\n    async _doExchange(app, code) {\n        try {\n            const response = await app.rest.POST('/api/auth/exchange', { code });\n            // Tolerate the same response wrappers the rest of the codebase\n            // does: { data: { data: {...} } } | { data: {...} } | flat.\n            const payload = response?.data?.data || response?.data || response;\n            const access_token = payload?.access_token;\n            const refresh_token = payload?.refresh_token;\n            const user = payload?.user;\n\n            if (!access_token) {\n                throw new Error('No access_token in /api/auth/exchange response');\n            }\n\n            // Clear cached instances so new tokens are loaded fresh.\n            this.tokenInstance = null;\n            this._refreshTokenInstance = null;\n\n            this.setTokens(access_token, refresh_token);\n            app.rest.setAuthToken(access_token);\n\n            app.events.emit('auth:login', user);\n            return user;\n        } catch (error) {\n            app.events.emit('auth:exchange:failed', { error });\n            return null;\n        }\n    }\n\n    /**\n     * Gate an outgoing request on token validity. Intended for use by a\n     * pre-request interceptor.\n     *\n     * - Valid access token: returns (no network).\n     * - Expired access token + valid refresh: awaits the (single-flight)\n     *   refresh; throws AuthRequiredError if the refresh fails.\n     * - Both tokens expired/invalid: emits auth:unauthorized and throws\n     *   AuthRequiredError without hitting the network.\n     *\n     * @param {object} app - App instance (needs .rest and .events)\n     * @throws {AuthRequiredError} when the request must not be sent\n     */\n    async ensureValidToken(app) {\n        const status = this.checkTokenStatus();\n\n        if (status.action === 'logout') {\n            app.events.emit('auth:unauthorized');\n            this.stopAutoRefresh();\n            throw new AuthRequiredError('Both access and refresh tokens are invalid');\n        }\n\n        if (status.action === 'refresh') {\n            const ok = await this.refreshToken(app);\n            if (!ok) {\n                throw new AuthRequiredError('Token refresh failed');\n            }\n        }\n    }\n}\n"],"names":["ResultsView","View","constructor","options","super","className","template","this","parentView","handleActionSelectItem","event","element","preventDefault","itemIndex","parseInt","getAttribute","handleItemSelection","handleActionClearSearch","_element","clearSearch","onAfterRender","maxHeight","container","querySelector","style","SimpleSearchView","Collection","collection","itemTemplate","getDefaultItemTemplate","searchFields","collectionParams","size","headerText","headerIcon","searchPlaceholder","loadingText","noResultsText","emptyText","emptySubtext","emptyIcon","footerContent","footerIcon","showExitButton","searchValue","filteredItems","loading","hasSearched","searchTimer","debounceMs","addClass","resultsView","addChild","onInit","setupCollection","autoLoad","loadItems","Object","assign","params","on","updateFilteredItems","updateResultsView","fetch","error","console","app","getApp","showError","warn","toJSON","getNestedValue","obj","path","split","reduce","current","key","getViewData","showFooter","hasItems","length","hasFilteredItems","hasSearchValue","processedItems","map","item","index","itemContent","processItemTemplate","data","items","showEmpty","showNoResults","showResultsCount","filteredCount","totalCount","restEnabled","meta","count","render","replace","match","prop","onPassThruActionSearchItems","value","clearTimeout","performSearch","searchParams","search","trim","setParams","isNaN","model","get","id","ModelClass","showLoading","then","hideLoading","emit","setCollection","setItemTemplate","setSearchFields","fields","Array","isArray","refresh","focusSearch","searchInput","focus","handleActionExitView","view","getItemCount","getFilteredItemCount","getSearchValue","setSearchValue","isMounted","onBeforeDestroy","off","GroupSelectorButton","tagName","GroupCollection","GroupList","currentGroup","activeGroup","buttonClass","buttonIcon","defaultText","autoSetActiveGroup","onGroupSelected","dialog","events","group","setCurrentGroup","getTemplate","onBeforeRender","displayName","name","onActionShowSelector","searchView","ModalView","title","body","scrollable","noBodyPadding","buttons","closeButton","handleGroupSelection","hide","destroy","document","show","setActiveGroup","mounted","getCurrentGroup","TopNav","themes","light","dark","clean","gradient","navbarClass","theme","shadow","enableTooltips","displayMode","showPageIcon","showPageDescription","showBreadcrumbs","groupIcon","currentPage","previousPage","config","brand","brandIcon","brandRoute","navItems","rightItems","showSidebarToggle","sidebarToggleAction","userMenu","findMenuItem","loginMenu","setupPageListeners","setupGroupListeners","groupSelectorButton","find","replaceMenuItem","new_menu","navIndex","findIndex","rightIndex","setBrand","icon","setUser","user","label","_updateUserAvatar","setModel","_onModelChange","avatar","url","renditions","square_sm","avatarUrl","showGroupInfo","showPageTitle","showPageInfo","showBrand","showNavItems","filterItemsByPermissions","processRightItems","navbarId","hasRightItems","currentGroupName","currentPageName","currentPageIcon","pageIcon","currentPageDescription","description","processedItem","subItem","processed","divider","header","isHeader","text","isHtml","html","type","isGroupSelector","isDropdown","isButton","groupSelectorOptions","containerId","groupSelector","handler","rightItemHandlers","Map","set","onPageChanged","onPageBeforeChange","page","updatePageDisplay","route","updateActiveItem","currentRoute","normalizeRoute","startsWith","normalizedCurrentRoute","normalizedItemRoute","isActive","active","updateData","_attachDropdowns","window","bootstrap","Dropdown","querySelectorAll","forEach","el","getOrCreateInstance","_warnedNoBootstrap","onPassThruActionProfile","action","onActionSettings","onActionLogout","onActionOpenGroupSelector","Promise","resolve","require","n","Group$1","tempSelector","handleAction","actionName","itemId","has","call","methodName","charAt","toUpperCase","slice","g","topnav","onActionDefault","activeUser","filter","permissions","hasPermission","AuthRequiredError","Error","message","reason","Token","token","payload","uid","email","exp","iat","isValidToken","_decode","parts","base64","padding","repeat","decoded","atob","JSON","parse","sub","user_id","username","Date","_checkValidity","Math","floor","now","decode","getUserId","isValid","isExpiringSoon","thresholdMinutes","threshold","isExpired","getAgeMinutes","ageSeconds","getAuthHeader","getUserInfo","tokenKey","refreshTokenKey","authCodeKey","tokenInstance","_refreshPromise","_exchangePromise","setTokens","refreshToken","persistent","storage","localStorage","sessionStorage","setItem","getToken","getItem","getRefreshToken","clearTokens","removeItem","getTokenInstance","currentToken","getRefreshTokenInstance","currentRefreshToken","_refreshTokenInstance","jwt","checkTokenStatus","checkAndRefreshTokens","stopAutoRefresh","startAutoRefresh","_tokenWatcher","setInterval","clearInterval","_doRefresh","finally","refreshTokenInstance","response","rest","POST","refresh_token","access_token","setAuthToken","newToken","newRefreshToken","status","handleAuthCodeFromURL","location","URLSearchParams","code","delete","remaining","toString","cleanUrl","pathname","hash","history","replaceState","exchangeAuthCode","_doExchange","ensureValidToken"],"mappings":"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"}

package/dist/chunks/UserProfileView-DC70hRer.js

@@ -1,2 +0,0 @@
-"use strict";const e=require("./View-BWOE7WJm.js"),t=require("./Modal-DYJadSN8.js"),i=require("./Collection-CtSGTegm.js"),s=require("./User-DRbw-wOB.js"),n=require("./Passkeys-8ko7Rg8G.js"),a=require("./ListView-CjJ-4gD7.js");class ProfileOverviewSection extends e.View{constructor(e={}){super({className:"profile-overview-section",template:'\n                <style>\n                    .po-section-label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #adb5bd; margin-bottom: 0.5rem; margin-top: 1.75rem; }\n                    .po-section-label:first-child { margin-top: 0; }\n                    .po-field-row { display: flex; align-items: center; padding: 0.6rem 0; border-bottom: 1px solid #f0f0f0; }\n                    .po-field-row:last-child { border-bottom: none; }\n                    .po-field-label { width: 130px; font-size: 0.8rem; color: #6c757d; flex-shrink: 0; }\n                    .po-field-value { flex: 1; font-size: 0.88rem; color: #212529; display: flex; align-items: center; gap: 0.4rem; }\n                    .po-field-action { color: #6c757d; cursor: pointer; font-size: 0.8rem; margin-left: auto; padding: 0.15rem 0.4rem; border-radius: 4px; background: none; border: none; }\n                    .po-field-action:hover { background: #f0f0f0; color: #0d6efd; }\n                    .po-badge-warn { font-size: 0.65rem; padding: 0.15em 0.45em; background: #fff3cd; color: #856404; border-radius: 3px; }\n                    .po-badge-ok { font-size: 0.65rem; padding: 0.15em 0.45em; background: #d1e7dd; color: #0f5132; border-radius: 3px; }\n                    .po-badge-muted { font-size: 0.65rem; padding: 0.15em 0.45em; background: #f0f0f0; color: #6c757d; border-radius: 3px; }\n                    .po-not-set { color: #adb5bd; font-style: italic; font-size: 0.85rem; }\n                    .po-perm-pill { display: inline-block; font-size: 0.72rem; padding: 0.2em 0.55em; background: #e7f1ff; color: #0d6efd; border-radius: 3px; margin: 0.1rem; }\n                    .po-perm-more { font-size: 0.72rem; color: #6c757d; cursor: pointer; }\n                    .po-perm-more:hover { color: #0d6efd; text-decoration: underline; }\n                </style>\n\n                \x3c!-- Contact --\x3e\n                <div class="po-section-label">Contact</div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Email</div>\n                    <div class="po-field-value">\n                        {{model.email}}\n                        {{#model.is_email_verified|bool}}\n                            <span class="po-badge-ok">Verified</span>\n                        {{/model.is_email_verified|bool}}\n                        {{^model.is_email_verified|bool}}\n                            <span class="po-badge-warn">Unverified</span>\n                        {{/model.is_email_verified|bool}}\n                    </div>\n                    {{^model.is_email_verified|bool}}\n                        <button type="button" class="po-field-action" data-action="verify-email" title="Send verification email"><i class="bi bi-envelope-check"></i></button>\n                    {{/model.is_email_verified|bool}}\n                    <button type="button" class="po-field-action" data-action="update-email" title="Change email"><i class="bi bi-pencil"></i></button>\n                </div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Phone</div>\n                    <div class="po-field-value">\n                        {{#hasPhone|bool}}\n                            {{model.phone_number}}\n                            {{#model.is_phone_verified|bool}}\n                                <span class="po-badge-ok">Verified</span>\n                            {{/model.is_phone_verified|bool}}\n                            {{^model.is_phone_verified|bool}}\n                                <span class="po-badge-warn">Unverified</span>\n                            {{/model.is_phone_verified|bool}}\n                        {{/hasPhone|bool}}\n                        {{^hasPhone|bool}}\n                            <span class="po-not-set">Not set</span>\n                        {{/hasPhone|bool}}\n                    </div>\n                    {{^hasPhone|bool}}\n                        <button type="button" class="po-field-action" data-action="add-phone" title="Add phone number"><i class="bi bi-plus"></i></button>\n                    {{/hasPhone|bool}}\n                    {{#hasPhone|bool}}\n                        {{^model.is_phone_verified|bool}}\n                            <button type="button" class="po-field-action" data-action="verify-phone" title="Send verification"><i class="bi bi-phone-vibrate"></i></button>\n                        {{/model.is_phone_verified|bool}}\n                        <button type="button" class="po-field-action" data-action="update-phone" title="Change phone number"><i class="bi bi-pencil"></i></button>\n                        <button type="button" class="po-field-action" data-action="remove-phone" title="Remove phone number"><i class="bi bi-x-lg"></i></button>\n                    {{/hasPhone|bool}}\n                </div>\n\n                \x3c!-- Account --\x3e\n                <div class="po-section-label">Account</div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Username</div>\n                    <div class="po-field-value">{{model.username}}</div>\n                </div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Status</div>\n                    <div class="po-field-value">\n                        {{#model.is_active|bool}}<span class="po-badge-ok">Active</span>{{/model.is_active|bool}}\n                        {{^model.is_active|bool}}<span class="po-badge-warn">Inactive</span>{{/model.is_active|bool}}\n                    </div>\n                </div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Role</div>\n                    <div class="po-field-value">\n                        {{roleLabel}}\n                        {{#model.is_staff|bool}}<span class="po-badge-muted">Staff</span>{{/model.is_staff|bool}}\n                    </div>\n                </div>\n                <div class="po-field-row">\n                    <div class="po-field-label">MFA</div>\n                    <div class="po-field-value">\n                        {{#model.requires_mfa|bool}}<span class="po-badge-ok">Required</span>{{/model.requires_mfa|bool}}\n                        {{^model.requires_mfa|bool}}<span class="po-badge-muted">Not required</span>{{/model.requires_mfa|bool}}\n                    </div>\n                </div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Member Since</div>\n                    <div class="po-field-value">{{model.date_joined|date}}</div>\n                </div>\n                <div class="po-field-row">\n                    <div class="po-field-label">Last Login</div>\n                    <div class="po-field-value">{{model.last_login|relative}}</div>\n                </div>\n\n\n                \x3c!-- Danger zone --\x3e\n                <div style="margin-top: 2.5rem; padding-top: 1rem; border-top: 1px solid #f0f0f0;">\n                    <button type="button" class="btn btn-link text-danger p-0" style="font-size: 0.8rem; text-decoration: none;" data-action="deactivate-account">\n                        <i class="bi bi-exclamation-triangle me-1"></i>Deactivate Account\n                    </button>\n                </div>\n            ',...e})}get hasPhone(){return!(!this.model||!this.model.get("phone_number"))}get roleLabel(){return this.model&&this.model.get("is_superuser")?"Superuser":"User"}get permissionPeek(){if(!this.model)return null;const e=this.model.get("permissions");if(!e)return null;const t={};s.User.PERMISSIONS.forEach(e=>{t[e.name]=e.label});const i=Object.keys(e).filter(t=>!0===e[t]).map(e=>t[e]||e.replace(/_/g," ").replace(/\b\w/g,e=>e.toUpperCase()));return 0===i.length?null:{items:i.slice(0,5),remaining:Math.max(0,i.length-5)}}get hasActiveGroup(){const e=this.getApp();return!(!e?.activeGroup||!this.model?.member)}get activeGroupName(){const e=this.getApp();return e?.activeGroup?.get("name")||e?.activeGroup?.get("display_name")||"Current Group"}get groupPermissionPeek(){if(!this.model?.member)return null;const e=this.model.member.get("permissions");if(!e)return null;const t=Object.keys(e).filter(t=>!0===e[t]).map(e=>e.replace(/_/g," ").replace(/\b\w/g,e=>e.toUpperCase()));return 0===t.length?null:{items:t.slice(0,5),remaining:Math.max(0,t.length-5)}}async onActionDeactivateAccount(){const e=this.getApp();if(!(await t.Modal.confirm("Are you sure you want to deactivate your account? A confirmation email will be sent to complete the process. This action cannot be undone.","Deactivate Account")))return!0;const s=await i.rest.POST("/api/account/deactivate");return s.success?e?.toast?.success("A confirmation email has been sent. Follow the link to complete deactivation."):e?.toast?.error(s.message||"Failed to request deactivation"),!0}async onActionVerifyEmail(){const e=this.getApp(),s=this.model.get("email"),n=await i.rest.POST("/api/auth/verify/email/send",{method:"code"});if(!n.success)return e?.toast?.error(n.message||"Failed to send verification code"),!0;const a=await t.Modal.prompt(`Enter the 6-digit code sent to <strong>${s}</strong>`,"Verify Email",{placeholder:"000000"});if(!a)return!0;const o=await i.rest.POST("/api/auth/verify/email/confirm",{code:a.trim()});return o.success?(e?.toast?.success("Email verified"),this.model.set("is_email_verified",!0),await this.render()):e?.toast?.error(o.message||"Invalid or expired code"),!0}async onActionVerifyPhone(){const e=this.getApp(),s=this.model.get("phone_number"),n=await i.rest.POST("/api/auth/verify/phone/send");if(!n.success)return e?.toast?.error(n.message||"Failed to send verification code"),!0;const a=await t.Modal.prompt(`Enter the 6-digit code sent to <strong>${s}</strong>`,"Verify Phone",{placeholder:"000000"});if(!a)return!0;const o=await i.rest.POST("/api/auth/verify/phone/confirm",{code:a.trim()});return o.success?(e?.toast?.success("Phone verified"),this.model.set("is_phone_verified",!0),await this.render()):e?.toast?.error(o.message||"Invalid or expired code"),!0}async onActionAddPhone(){const e=this.getApp(),s=await t.Modal.prompt("Enter your phone number:","Add Phone Number",{placeholder:"(415) 555-0123"});if(!s||!s.trim())return!0;const n=await this.model.save({phone_number:s.trim()});if(200!==n.status)return e?.toast?.error(n.message||"Failed to save phone number"),!0;const a=await i.rest.POST("/api/auth/verify/phone/send");if(!a.success)return e?.toast?.error(a.message||"Failed to send verification code"),await this.render(),!0;const o=await t.Modal.prompt(`Enter the 6-digit code sent to <strong>${s.trim()}</strong>`,"Verify Phone",{placeholder:"000000"});if(!o)return await this.render(),!0;const r=await i.rest.POST("/api/auth/verify/phone/confirm",{code:o.trim()});return r.success?(e?.toast?.success("Phone number added and verified"),this.model.set("is_phone_verified",!0),await this.render()):(e?.toast?.error(r.message||"Invalid or expired code"),await this.render()),!0}async onActionRemovePhone(){const e=this.getApp();if(!(await t.Modal.confirm("Remove your phone number? You will need to add it again to use phone-based verification.","Remove Phone")))return!0;const i=await this.model.save({phone_number:null});return 200===i.status?(e?.toast?.success("Phone number removed"),this.model.set("is_phone_verified",!1),await this.render()):e?.toast?.error(i.message||"Failed to remove phone number"),!0}async onActionNavigate(e,t){return!this.parent||!this.parent.onActionNavigate||this.parent.onActionNavigate(e,t)}}class ProfilePersonalSection extends e.View{constructor(e={}){super({className:"profile-personal-section",template:'\n                <style>\n                    .pp-section-label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #adb5bd; margin-bottom: 0.5rem; margin-top: 1.75rem; }\n                    .pp-section-label:first-child { margin-top: 0; }\n                    .pp-field-row { display: flex; align-items: center; padding: 0.6rem 0; border-bottom: 1px solid #f0f0f0; }\n                    .pp-field-row:last-child { border-bottom: none; }\n                    .pp-field-label { width: 130px; font-size: 0.8rem; color: #6c757d; flex-shrink: 0; }\n                    .pp-field-value { flex: 1; font-size: 0.88rem; color: #212529; display: flex; align-items: center; gap: 0.4rem; }\n                    .pp-field-action { color: #6c757d; cursor: pointer; font-size: 0.8rem; margin-left: auto; padding: 0.15rem 0.4rem; border-radius: 4px; background: none; border: none; }\n                    .pp-field-action:hover { background: #f0f0f0; color: #0d6efd; }\n                    .pp-badge-ok { font-size: 0.65rem; padding: 0.15em 0.45em; background: #d1e7dd; color: #0f5132; border-radius: 3px; }\n                    .pp-badge-warn { font-size: 0.65rem; padding: 0.15em 0.45em; background: #fff3cd; color: #856404; border-radius: 3px; }\n                    .pp-not-set { color: #adb5bd; font-style: italic; font-size: 0.85rem; }\n                </style>\n\n                \x3c!-- Name --\x3e\n                <div class="pp-section-label">Name</div>\n                <div class="pp-field-row">\n                    <div class="pp-field-label">Display Name</div>\n                    <div class="pp-field-value">\n                        {{#model.display_name}}{{model.display_name}}{{/model.display_name}}\n                        {{^model.display_name}}<span class="pp-not-set">Not set</span>{{/model.display_name}}\n                    </div>\n                    <button type="button" class="pp-field-action" data-action="edit-display-name" title="Edit"><i class="bi bi-pencil"></i></button>\n                </div>\n                <div class="pp-field-row">\n                    <div class="pp-field-label">First Name</div>\n                    <div class="pp-field-value">\n                        {{#model.first_name}}{{model.first_name}}{{/model.first_name}}\n                        {{^model.first_name}}<span class="pp-not-set">Not set</span>{{/model.first_name}}\n                    </div>\n                    <button type="button" class="pp-field-action" data-action="edit-first-name" title="Edit"><i class="bi bi-pencil"></i></button>\n                </div>\n                <div class="pp-field-row">\n                    <div class="pp-field-label">Last Name</div>\n                    <div class="pp-field-value">\n                        {{#model.last_name}}{{model.last_name}}{{/model.last_name}}\n                        {{^model.last_name}}<span class="pp-not-set">Not set</span>{{/model.last_name}}\n                    </div>\n                    <button type="button" class="pp-field-action" data-action="edit-last-name" title="Edit"><i class="bi bi-pencil"></i></button>\n                </div>\n\n                \x3c!-- Details --\x3e\n                <div class="pp-section-label">Details</div>\n                <div class="pp-field-row">\n                    <div class="pp-field-label">Date of Birth</div>\n                    <div class="pp-field-value">\n                        {{#hasDob|bool}}\n                            {{dobFormatted}}\n                            {{#model.is_dob_verified|bool}}<span class="pp-badge-ok">Verified</span>{{/model.is_dob_verified|bool}}\n                            {{^model.is_dob_verified|bool}}<span class="pp-badge-warn">Unverified</span>{{/model.is_dob_verified|bool}}\n                        {{/hasDob|bool}}\n                        {{^hasDob|bool}}<span class="pp-not-set">Not set</span>{{/hasDob|bool}}\n                    </div>\n                    <button type="button" class="pp-field-action" data-action="edit-dob" title="Edit"><i class="bi bi-pencil"></i></button>\n                </div>\n                <div class="pp-field-row">\n                    <div class="pp-field-label">Timezone</div>\n                    <div class="pp-field-value">{{timezoneDisplay}}</div>\n                    <button type="button" class="pp-field-action" data-action="edit-timezone" title="Edit"><i class="bi bi-pencil"></i></button>\n                </div>\n\n                \x3c!-- Address --\x3e\n                <div class="pp-section-label">Address</div>\n                <div class="pp-field-row">\n                    <div class="pp-field-label">Address</div>\n                    <div class="pp-field-value">\n                        {{#hasAddress|bool}}\n                            {{addressSummary}}\n                        {{/hasAddress|bool}}\n                        {{^hasAddress|bool}}\n                            <span class="pp-not-set">Not set</span>\n                        {{/hasAddress|bool}}\n                    </div>\n                    <button type="button" class="pp-field-action" data-action="edit-address" title="Edit"><i class="bi bi-pencil"></i></button>\n                </div>\n            ',...e})}get hasDob(){return!!this.model?.get("dob")}get dobFormatted(){const e=this.model?.get("dob");if(!e)return"";try{const[t,i,s]=e.split("-");return`${i}/${s}/${t}`}catch{return e}}get timezoneDisplay(){return(this.model?.get("metadata")||{}).timezone||"Not set"}get hasAddress(){const e=this.model?.get("metadata")||{};return!!(e.street||e.city||e.state||e.zip||e.country)}get addressSummary(){const e=this.model?.get("metadata")||{};return[e.street,e.city,e.state,e.zip,e.country].filter(Boolean).join(", ")}async onActionEditDisplayName(){const e=await t.Modal.prompt("Enter your display name:","Display Name",{defaultValue:this.model.get("display_name")||""});return null!==e&&e.trim()&&(200===(await this.model.save({display_name:e.trim()})).status?(this.getApp()?.toast?.success("Display name updated"),await this.render()):this.getApp()?.toast?.error("Failed to update display name")),!0}async onActionEditFirstName(){const e=await t.Modal.prompt("Enter your first name:","First Name",{defaultValue:this.model.get("first_name")||""});return null!==e&&(200===(await this.model.save({first_name:e.trim()})).status?(this.getApp()?.toast?.success("First name updated"),await this.render()):this.getApp()?.toast?.error("Failed to update first name")),!0}async onActionEditLastName(){const e=await t.Modal.prompt("Enter your last name:","Last Name",{defaultValue:this.model.get("last_name")||""});return null!==e&&(200===(await this.model.save({last_name:e.trim()})).status?(this.getApp()?.toast?.success("Last name updated"),await this.render()):this.getApp()?.toast?.error("Failed to update last name")),!0}async onActionEditDob(){const e=await t.Modal.form({title:"Date of Birth",size:"sm",fields:[{name:"dob",type:"date",label:"Date of Birth",cols:12}],data:{dob:this.model.get("dob")||""}});return!e||(200===(await this.model.save({dob:e.dob||null})).status?(this.getApp()?.toast?.success("Date of birth updated"),await this.render()):this.getApp()?.toast?.error("Failed to update date of birth"),!0)}async onActionEditTimezone(){const e=this.model.get("metadata")||{},i=await t.Modal.form({title:"Change Timezone",fields:[{name:"timezone",type:"select",label:"Timezone",cols:12,options:[{value:"America/New_York",text:"Eastern Time (ET)"},{value:"America/Chicago",text:"Central Time (CT)"},{value:"America/Denver",text:"Mountain Time (MT)"},{value:"America/Los_Angeles",text:"Pacific Time (PT)"},{value:"America/Anchorage",text:"Alaska Time (AKT)"},{value:"Pacific/Honolulu",text:"Hawaii Time (HT)"},{value:"UTC",text:"UTC"},{value:"Europe/London",text:"London (GMT/BST)"},{value:"Europe/Paris",text:"Paris (CET/CEST)"},{value:"Europe/Berlin",text:"Berlin (CET/CEST)"},{value:"Asia/Tokyo",text:"Tokyo (JST)"},{value:"Asia/Shanghai",text:"Shanghai (CST)"},{value:"Australia/Sydney",text:"Sydney (AEST)"}]}],data:{timezone:e.timezone||""},size:"sm"});if(!i)return!0;const s={...e,timezone:i.timezone};return 200===(await this.model.save({metadata:s})).status?(this.getApp()?.toast?.success("Timezone updated"),await this.render()):this.getApp()?.toast?.error("Failed to update timezone"),!0}async onActionEditAddress(){const e=this.model.get("metadata")||{},i=await t.Modal.form({title:"Edit Address",size:"md",fields:[{name:"street",type:"text",label:"Street",placeholder:"123 Main St",cols:12},{name:"city",type:"text",label:"City",cols:6},{name:"state",type:"text",label:"State / Province",cols:6},{name:"zip",type:"text",label:"Zip / Postal Code",cols:6},{name:"country",type:"text",label:"Country",cols:6}],data:{street:e.street||"",city:e.city||"",state:e.state||"",zip:e.zip||"",country:e.country||""}});if(!i)return!0;const s={...e,street:i.street||"",city:i.city||"",state:i.state||"",zip:i.zip||"",country:i.country||""};return 200===(await this.model.save({metadata:s})).status?(this.getApp()?.toast?.success("Address updated"),await this.render()):this.getApp()?.toast?.error("Failed to update address"),!0}}class PasskeySetupView extends e.View{constructor(e={}){super({className:"passkey-setup-view",template:'\n                <style>\n                    .pks-body { padding: 2rem 1.75rem 1rem; text-align: center; }\n                    .pks-icon { width: 56px; height: 56px; background: #e7f1ff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #0d6efd; margin-bottom: 1rem; }\n                    .pks-body h5 { font-weight: 700; font-size: 1.05rem; margin-bottom: 0.35rem; }\n                    .pks-body p { font-size: 0.83rem; color: #6c757d; margin-bottom: 1.25rem; line-height: 1.45; }\n                    .pks-footer { padding: 0 1.75rem 1.5rem; display: flex; flex-direction: column; gap: 0.4rem; }\n                    .pks-footer .btn-create { padding: 0.6rem; font-weight: 600; font-size: 0.9rem; border-radius: 8px; }\n                    .pks-footer .btn-skip { background: none; border: none; color: #6c757d; font-size: 0.82rem; padding: 0.4rem; cursor: pointer; }\n                    .pks-footer .btn-skip:hover { color: #495057; }\n                    .pks-dont-show { text-align: center; padding: 0 1.75rem 1.25rem; }\n                    .pks-dont-show label { font-size: 0.73rem; color: #adb5bd; cursor: pointer; }\n                </style>\n\n                <div class="pks-body">\n                    <div class="pks-icon"><i class="bi bi-fingerprint"></i></div>\n                    <h5>Add a Passkey</h5>\n                    <p>Sign in faster with Face ID, Touch ID, or your device PIN. No passwords needed.</p>\n                </div>\n                <div class="pks-footer">\n                    <button class="btn btn-primary btn-create" data-action="create-passkey"><i class="bi bi-fingerprint me-1"></i>Create Passkey</button>\n                    <button class="btn-skip" data-action="skip">Not now</button>\n                </div>\n                <div class="pks-dont-show">\n                    <label><input type="checkbox" class="form-check-input form-check-input-sm me-1" data-action="dont-ask"> Don\'t ask again</label>\n                </div>\n            ',...e})}async _askPasskeyName(){const e=n.Passkey.suggestName();return t.Modal.dialog({title:'<i class="bi bi-fingerprint me-2"></i>Register a Passkey',size:"sm",centered:!0,body:`\n                <div style="text-align:center; padding: 0.5rem 0 1rem;">\n                    <div style="width:72px; height:72px; background:linear-gradient(135deg, #e7f1ff 0%, #d0e2ff 100%); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:2rem; color:#0d6efd; margin-bottom:1rem;">\n                        <i class="bi bi-fingerprint"></i>\n                    </div>\n                    <p style="font-size:0.85rem; color:#6c757d; margin-bottom:1.25rem; line-height:1.5;">\n                        Passkeys use your device's biometrics — fingerprint, face, or PIN — instead of a password.\n                        They're <strong>phishing-resistant</strong> and the private key never leaves your device.\n                    </p>\n                    <div class="text-start" style="margin-bottom:0.25rem;">\n                        <label class="form-label fw-semibold" style="font-size:0.82rem;">Name this passkey</label>\n                        <input type="text" class="form-control" id="pks-name-input" value="${e}" placeholder="e.g., My MacBook" style="border-radius:8px;">\n                        <div class="form-text">A label so you can identify this passkey later.</div>\n                    </div>\n                </div>`,buttons:[{text:"Cancel",class:"btn-secondary",dismiss:!0},{text:'<i class="bi bi-fingerprint me-1"></i>Continue',class:"btn-primary",handler:({dialog:t})=>{const i=t.element?.querySelector("#pks-name-input");return i?.value?.trim()||e}}]})}static showSuccess(e){return t.Modal.dialog({title:'<span class="text-success"><i class="bi bi-check-circle-fill me-2"></i>Passkey Registered</span>',size:"sm",centered:!0,body:`\n                <div style="text-align:center; padding: 0.5rem 0 0.75rem;">\n                    <div style="width:72px; height:72px; background:linear-gradient(135deg, #d1e7dd 0%, #badbcc 100%); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:2rem; color:#198754; margin-bottom:1rem;">\n                        <i class="bi bi-shield-lock-fill"></i>\n                    </div>\n                    <h6 class="fw-bold mb-2">${e||"Your passkey"} is ready</h6>\n                    <p style="font-size:0.85rem; color:#6c757d; line-height:1.5; margin-bottom:0;">\n                        Next time you sign in, choose <strong>"Login with Passkey"</strong> — no username or password needed.\n                        Just your fingerprint, face, or device PIN.\n                    </p>\n                </div>`,buttons:[{text:"Done",class:"btn-success",value:!0}]})}static showError(e){return t.Modal.alert({title:"Passkey Error",message:e||"Something went wrong during passkey registration.",type:"error"})}async onActionCreatePasskey(){try{const e=await this._askPasskeyName();if(!e)return!0;const t=await n.Passkey.register(e);t.success?(localStorage.setItem("passkey_setup_dismissed","1"),await PasskeySetupView.showSuccess(e),this.emit("dismiss")):PasskeySetupView.showError(t.error)}catch(e){if("NotAllowedError"===e.name)return!0;"SecurityError"===e.name?PasskeySetupView.showError("Passkeys are not supported on this domain. Ensure you are using HTTPS."):(console.error("Passkey registration error:",e),PasskeySetupView.showError(e.message||"An unexpected error occurred."))}return!0}async onActionSkip(){return this.emit("dismiss"),!0}async onActionDontAsk(){const e=this.element?.querySelector('.pks-dont-show input[type="checkbox"]');return e&&e.checked?(localStorage.setItem("passkey_setup_dismissed","1"),this.emit("dismiss")):localStorage.removeItem("passkey_setup_dismissed"),!0}}class ProfileSecuritySection extends e.View{constructor(e={}){super({className:"profile-security-section",template:'\n                <style>\n                    .ps-section-label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #adb5bd; margin-bottom: 0.5rem; margin-top: 1.75rem; }\n                    .ps-section-label:first-child { margin-top: 0; }\n                    .ps-item { display: flex; align-items: center; gap: 0.85rem; padding: 0.85rem 1rem; border: 1px solid #f0f0f0; border-radius: 8px; margin-bottom: 0.5rem; cursor: pointer; transition: border-color 0.15s, background 0.15s; }\n                    .ps-item:hover { border-color: #dee2e6; background: #fafbfd; }\n                    .ps-icon { width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }\n                    .ps-info { flex: 1; min-width: 0; }\n                    .ps-title { font-weight: 600; font-size: 0.88rem; }\n                    .ps-desc { font-size: 0.78rem; color: #6c757d; }\n                    .ps-badge { font-size: 0.72rem; padding: 0.15em 0.5em; border-radius: 3px; flex-shrink: 0; }\n                    .ps-chevron { color: #ced4da; font-size: 0.8rem; flex-shrink: 0; }\n                </style>\n\n                <div class="ps-section-label">Authentication</div>\n\n                <div class="ps-item" data-action="change-password">\n                    <div class="ps-icon bg-primary bg-opacity-10 text-primary"><i class="bi bi-lock"></i></div>\n                    <div class="ps-info">\n                        <div class="ps-title">Password</div>\n                        <div class="ps-desc">Change your account password</div>\n                    </div>\n                    <span class="ps-badge bg-light text-muted border">Change</span>\n                </div>\n\n                <div class="ps-item" data-action="manage-passkeys">\n                    <div class="ps-icon bg-success bg-opacity-10 text-success"><i class="bi bi-fingerprint"></i></div>\n                    <div class="ps-info">\n                        <div class="ps-title">Passkeys</div>\n                        <div class="ps-desc">Passwordless sign-in with biometrics</div>\n                    </div>\n                    <i class="bi bi-chevron-right ps-chevron"></i>\n                </div>\n\n                <div class="ps-item" data-action="manage-totp">\n                    <div class="ps-icon bg-purple bg-opacity-10" style="background: rgba(111,66,193,0.1); color: #6f42c1;"><i class="bi bi-shield-lock"></i></div>\n                    <div class="ps-info">\n                        <div class="ps-title">Authenticator App</div>\n                        <div class="ps-desc">Two-factor authentication with TOTP codes</div>\n                    </div>\n                    {{#model.requires_mfa|bool}}\n                        <span class="ps-badge bg-success bg-opacity-10 text-success border">Enabled</span>\n                    {{/model.requires_mfa|bool}}\n                    {{^model.requires_mfa|bool}}\n                        <span class="ps-badge bg-light text-muted border">Setup</span>\n                    {{/model.requires_mfa|bool}}\n                </div>\n\n                {{#model.requires_mfa|bool}}\n                <div class="ps-item" data-action="manage-recovery-codes">\n                    <div class="ps-icon" style="background: rgba(111,66,193,0.1); color: #6f42c1;"><i class="bi bi-file-earmark-lock"></i></div>\n                    <div class="ps-info">\n                        <div class="ps-title">Recovery Codes</div>\n                        <div class="ps-desc">Backup codes for when you lose your authenticator</div>\n                    </div>\n                    <i class="bi bi-chevron-right ps-chevron"></i>\n                </div>\n                {{/model.requires_mfa|bool}}\n\n                <div class="ps-section-label">Sessions</div>\n\n                <div class="ps-item" data-action="revoke-all-sessions">\n                    <div class="ps-icon" style="background: rgba(220,53,69,0.1); color: #dc3545;"><i class="bi bi-box-arrow-right"></i></div>\n                    <div class="ps-info">\n                        <div class="ps-title">Revoke All Sessions</div>\n                        <div class="ps-desc">Sign out of all devices except this one</div>\n                    </div>\n                </div>\n            ',...e})}async onActionChangePassword(){const e=this.getApp();return e&&e.changePassword&&await e.changePassword(),!0}async onActionManagePasskeys(){const i=new n.PasskeyList({params:{user:this.model.id}});try{await i.fetch()}catch(o){}const s=i.models||[],a=new e.View({template:'\n                <style>\n                    .pk-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.75rem; border: 1px solid #f0f0f0; border-radius: 8px; margin-bottom: 0.4rem; }\n                    .pk-icon { width: 32px; height: 32px; background: #e7f1ff; border-radius: 6px; display: flex; align-items: center; justify-content: center; color: #0d6efd; font-size: 0.9rem; flex-shrink: 0; }\n                    .pk-info { flex: 1; min-width: 0; }\n                    .pk-name { font-weight: 600; font-size: 0.85rem; }\n                    .pk-meta { font-size: 0.73rem; color: #6c757d; }\n                    .pk-actions { display: flex; gap: 0.25rem; }\n                    .pk-actions .btn { padding: 0.2rem 0.4rem; font-size: 0.75rem; }\n                    .pk-empty { text-align: center; padding: 2rem 1rem; color: #6c757d; }\n                    .pk-empty i { font-size: 2rem; color: #ced4da; display: block; margin-bottom: 0.5rem; }\n                </style>\n                {{#passkeys}}\n                    <div class="pk-row">\n                        <div class="pk-icon"><i class="bi bi-fingerprint"></i></div>\n                        <div class="pk-info">\n                            <div class="pk-name">{{.friendly_name|default:\'Unnamed Passkey\'}}</div>\n                            <div class="pk-meta">Created {{.created|date}} &middot; Last used {{.last_used|relative|default:\'never\'}} &middot; {{.sign_count}} uses</div>\n                        </div>\n                        <div class="pk-actions">\n                            <button type="button" class="btn btn-outline-secondary" data-action="edit-passkey" data-id="{{.id}}" title="Edit"><i class="bi bi-pencil"></i></button>\n                            <button type="button" class="btn btn-outline-danger" data-action="delete-passkey" data-id="{{.id}}" title="Delete"><i class="bi bi-trash"></i></button>\n                        </div>\n                    </div>\n                {{/passkeys}}\n                {{^passkeys|bool}}\n                    <div class="pk-empty">\n                        <i class="bi bi-fingerprint"></i>\n                        No passkeys registered yet\n                    </div>\n                {{/passkeys|bool}}\n            '});return a.passkeys=s.map(e=>e.toJSON?e.toJSON():e),a.onActionEditPasskey=async(e,i)=>{const a=i.dataset.id,o=s.find(e=>String(e.id)===String(a));return o&&await t.Modal.modelForm({title:"Edit Passkey",model:o,fields:n.PasskeyForms.edit.fields,size:"sm"}),!0},a.onActionDeletePasskey=async(e,i)=>{const n=i.dataset.id;if(await t.Modal.confirm("Delete this passkey? You won't be able to use it to sign in anymore.","Delete Passkey")){const e=s.find(e=>String(e.id)===String(n));e&&(await e.destroy(),this.getApp()?.toast?.success("Passkey deleted"))}return!0},"add"===await t.Modal.dialog({title:"Passkeys",body:a,size:"md",buttons:[{text:"Add Passkey",icon:"bi-plus-lg",class:"btn-primary",value:"add"},{text:"Close",class:"btn-outline-secondary",dismiss:!0}]})&&await this._addPasskey(),!0}async _addPasskey(){const e=n.Passkey.suggestName(),i=await t.Modal.dialog({title:'<i class="bi bi-fingerprint me-2"></i>Register a Passkey',size:"sm",centered:!0,body:`\n                <div style="text-align:center; padding: 0.5rem 0 1rem;">\n                    <div style="width:72px; height:72px; background:linear-gradient(135deg, #e7f1ff 0%, #d0e2ff 100%); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:2rem; color:#0d6efd; margin-bottom:1rem;">\n                        <i class="bi bi-fingerprint"></i>\n                    </div>\n                    <p style="font-size:0.85rem; color:#6c757d; margin-bottom:1.25rem; line-height:1.5;">\n                        Passkeys replace passwords with biometrics — fingerprint, face, or device PIN.\n                        The private key never leaves your device.\n                    </p>\n                    <div class="text-start" style="margin-bottom:0.25rem;">\n                        <label class="form-label fw-semibold" style="font-size:0.82rem;">Name this passkey</label>\n                        <input type="text" class="form-control" id="pss-name-input" value="${e}" placeholder="e.g., My MacBook" style="border-radius:8px;">\n                        <div class="form-text">A label so you can identify this passkey later.</div>\n                    </div>\n                </div>`,buttons:[{text:"Cancel",class:"btn-secondary",dismiss:!0},{text:'<i class="bi bi-fingerprint me-1"></i>Continue',class:"btn-primary",handler:({dialog:t})=>{const i=t.element?.querySelector("#pss-name-input");return i?.value?.trim()||e}}]});if(i)try{const e=await n.Passkey.register(i);e.success?await PasskeySetupView.showSuccess(i):PasskeySetupView.showError(e.error)}catch(s){if("NotAllowedError"===s.name)return;"SecurityError"===s.name?PasskeySetupView.showError("Passkeys are not supported on this domain. Ensure you are using HTTPS."):(console.error("Passkey registration error:",s),PasskeySetupView.showError(s.message||"An unexpected error occurred."))}}async onActionManageTotp(){const s=this.getApp();if(this.model.get("requires_mfa")){if(!(await t.Modal.confirm("Disable authenticator app? You will no longer need a TOTP code to sign in.","Disable Authenticator")))return!0;const e=await i.rest.DELETE("/api/account/totp");return e.success?(s?.toast?.success("Authenticator app disabled"),this.model.set("requires_mfa",!1),await this.render()):s?.toast?.error(e.message||"Failed to disable authenticator"),!0}const n=await i.rest.POST("/api/account/totp/setup",{},{},{dataOnly:!0});if(!n.success||!n.data)return s?.toast?.error(n.message||"Failed to start authenticator setup"),!0;const{secret:a,qr_code:o}=n.data,r=new e.View({template:'\n                <div style="text-align: center; padding: 0.5rem 0;">\n                    <p style="font-size: 0.85rem; color: #6c757d; margin-bottom: 1rem;">\n                        Scan this QR code with your authenticator app (Google Authenticator, Authy, 1Password, etc.)\n                    </p>\n                    <img src="{{{qrCode}}}" alt="TOTP QR Code" style="width: 200px; height: 200px; margin: 0 auto; display: block; border: 1px solid #e9ecef; border-radius: 8px; padding: 8px;" />\n                    <div style="margin-top: 1rem;">\n                        <p style="font-size: 0.75rem; color: #adb5bd; margin-bottom: 0.25rem;">Or enter this key manually:</p>\n                        <code style="font-size: 0.85rem; letter-spacing: 0.1em; user-select: all; padding: 0.35rem 0.75rem; background: #f8f9fa; border-radius: 4px;">{{secret}}</code>\n                    </div>\n                </div>\n            '});if(r.qrCode=o,r.secret=a,"next"!==await t.Modal.dialog({title:"Set Up Authenticator",body:r,size:"sm",buttons:[{text:"Cancel",class:"btn-secondary",dismiss:!0},{text:"Next",class:"btn-primary",value:"next"}]}))return!0;const l=await t.Modal.prompt("Enter the 6-digit code from your authenticator app to verify setup:","Verify Authenticator",{placeholder:"000000"});if(!l)return!0;const d=await i.rest.POST("/api/account/totp/confirm",{code:l.trim()});return d.success?(s?.toast?.success("Authenticator app enabled"),this.model.set("requires_mfa",!0),await this.render()):s?.toast?.error(d.message||"Invalid code. Please try setup again."),!0}async onActionManageRecoveryCodes(){const s=this.getApp(),n=await i.rest.GET("/api/account/totp/recovery-codes",{},{dataOnly:!0});if(!n.success||!n.data)return s?.toast?.error(n.message||"Failed to load recovery codes"),!0;const{remaining:a,codes:o}=n.data,r=new e.View({template:'\n                <style>\n                    .rc-info { font-size: 0.82rem; color: #6c757d; margin-bottom: 1rem; }\n                    .rc-remaining { font-weight: 600; color: #495057; }\n                    .rc-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem; }\n                    .rc-code { font-family: monospace; font-size: 0.85rem; padding: 0.35rem 0.6rem; background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 4px; text-align: center; }\n                </style>\n                <div class="rc-info">\n                    <span class="rc-remaining">{{remaining}}</span> recovery codes remaining\n                </div>\n                <div class="rc-list">\n                    {{#codes}}\n                        <div class="rc-code">{{.}}</div>\n                    {{/codes}}\n                </div>\n            '});if(r.remaining=a,r.codes=o||[],"regenerate"===await t.Modal.dialog({title:"Recovery Codes",body:r,size:"sm",buttons:[{text:"Regenerate",icon:"bi-arrow-repeat",class:"btn-warning",value:"regenerate"},{text:"Close",class:"btn-outline-secondary",dismiss:!0}]})){const n=await t.Modal.prompt("Enter your current authenticator code to regenerate recovery codes:","Regenerate Recovery Codes",{placeholder:"000000"});if(!n)return!0;const a=await i.rest.POST("/api/account/totp/recovery-codes/regenerate",{code:n.trim()},{},{dataOnly:!0});if(a.success&&a.data?.recovery_codes){const i=a.data.recovery_codes,n=i.join("\n"),o=new e.View({template:'\n                        <style>\n                            .rc-warning { padding: 0.65rem 0.85rem; background: #fff3cd; border: 1px solid #ffecb5; border-radius: 6px; margin-bottom: 1rem; font-size: 0.8rem; color: #664d03; }\n                            .rc-new-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem; margin-bottom: 1rem; }\n                            .rc-new-code { font-family: monospace; font-size: 0.85rem; padding: 0.35rem 0.6rem; background: #d1e7dd; border: 1px solid #badbcc; border-radius: 4px; text-align: center; }\n                        </style>\n                        <div class="rc-warning">\n                            <i class="bi bi-exclamation-triangle me-1"></i>\n                            <strong>Save these codes now.</strong> They will not be shown again. Old codes are invalidated.\n                        </div>\n                        <div class="rc-new-list">\n                            {{#newCodes}}\n                                <div class="rc-new-code">{{.}}</div>\n                            {{/newCodes}}\n                        </div>\n                    '});o.newCodes=i,await t.Modal.dialog({title:"New Recovery Codes",body:o,size:"sm",buttons:[{text:"Copy All",icon:"bi-clipboard",class:"btn-primary",handler:async()=>{try{await navigator.clipboard.writeText(n),s?.toast?.success("Recovery codes copied")}catch{s?.toast?.error("Failed to copy codes")}return!1}},{text:"Done",class:"btn-outline-secondary",dismiss:!0}]})}else s?.toast?.error(a.message||"Failed to regenerate recovery codes")}return!0}async onActionRevokeAllSessions(){const e=this.getApp();if(!(await t.Modal.confirm("This will sign you out of all other devices and sessions. Your current session will remain active. This cannot be undone.","Revoke All Sessions")))return!0;const s=await t.Modal.prompt("Enter your current password to confirm:","Confirm Password",{placeholder:"Current password"});if(!s)return!0;const n=await i.rest.POST("/api/auth/sessions/revoke",{current_password:s.trim()},{},{dataOnly:!0});return n.success&&n.data?(n.data.access_token&&e?.auth?.setTokens?.(n.data),e?.toast?.success("All other sessions have been revoked")):e?.toast?.error(n.message||"Failed to revoke sessions"),!0}async onActionNavigate(e,t){return!this.parent||!this.parent.onActionNavigate||this.parent.onActionNavigate(e,t)}}const o={google:"bi-google",github:"bi-github",microsoft:"bi-microsoft",apple:"bi-apple",facebook:"bi-facebook",twitter:"bi-twitter-x",linkedin:"bi-linkedin"};class ProfileConnectedSection extends e.View{constructor(e={}){super({className:"profile-connected-section",template:'\n                <style>\n                    .pc-row { display: flex; align-items: center; gap: 0.85rem; padding: 0.85rem 1rem; border: 1px solid #f0f0f0; border-radius: 8px; margin-bottom: 0.5rem; }\n                    .pc-icon { width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; background: #f0f0f0; color: #495057; }\n                    .pc-info { flex: 1; min-width: 0; }\n                    .pc-provider { font-weight: 600; font-size: 0.88rem; text-transform: capitalize; }\n                    .pc-meta { font-size: 0.78rem; color: #6c757d; }\n                    .pc-actions { flex-shrink: 0; }\n                    .pc-actions .btn { font-size: 0.75rem; padding: 0.25rem 0.5rem; }\n                    .pc-empty { text-align: center; padding: 2rem 1rem; color: #6c757d; }\n                    .pc-empty i { font-size: 2rem; color: #ced4da; display: block; margin-bottom: 0.5rem; }\n                </style>\n\n                {{#connections}}\n                    <div class="pc-row">\n                        <div class="pc-icon"><i class="bi {{.icon}}"></i></div>\n                        <div class="pc-info">\n                            <div class="pc-provider">{{.provider}}</div>\n                            <div class="pc-meta">{{.email}} &middot; Connected {{.created|relative}}</div>\n                        </div>\n                        <div class="pc-actions">\n                            <button type="button" class="btn btn-outline-danger" data-action="unlink" data-id="{{.id}}" title="Unlink"><i class="bi bi-x-lg me-1"></i>Unlink</button>\n                        </div>\n                    </div>\n                {{/connections}}\n                {{^connections|bool}}\n                    <div class="pc-empty">\n                        <i class="bi bi-plug"></i>\n                        No connected accounts\n                        <div style="font-size: 0.78rem; margin-top: 0.5rem;">\n                            Connect a social account by signing in with a provider while logged in.\n                        </div>\n                    </div>\n                {{/connections|bool}}\n            ',...e}),this.connections=[]}async onBeforeRender(){try{const e=await i.rest.GET("/api/account/oauth_connection"),t=e?.data?.results||e?.data||[];this.connections=t.map(e=>({...e,icon:o[e.provider]||"bi-link-45deg"}))}catch(e){this.connections=[]}}async onActionUnlink(e,s){const n=s.dataset.id,a=this.connections.find(e=>String(e.id)===String(n)),o=a?.provider||"this account";if(!(await t.Modal.confirm(`Unlink ${o}? You won't be able to sign in with this provider anymore.`,"Unlink Account")))return!0;const r=await i.rest.DELETE(`/api/account/oauth_connection/${n}`);return r.success?(this.getApp()?.toast?.success(`${o} account unlinked`),await this.render()):this.getApp()?.toast?.error(r.message||"Failed to unlink account"),!0}}class SessionRow extends n.TableRow{get deviceIcon(){const e=this.model?.get("user_device")?.device_info?.device||{},t=this.model?.get("user_device")?.device_info?.os||{};return["iPhone","Android"].some(i=>(e.family||"").includes(i)||(t.family||"").includes(i))?"bi-phone":"bi-laptop"}get browserName(){const e=this.model?.get("user_device")?.device_info?.user_agent||{};return e.family?`${e.family} ${e.major||""}`.trim():"Unknown"}get deviceName(){const e=this.model?.get("user_device")?.device_info?.device||{};return`${e.brand||""} ${e.family||""}`.trim()||"Unknown"}get osName(){return(this.model?.get("user_device")?.device_info?.os||{}).family||""}get locationText(){const e=this.model?.get("geolocation")||{},t=[e.city,e.region].filter(Boolean);return t.length?t.join(", "):e.country_name||"—"}get threatFlags(){const e=this.model?.get("geolocation")||{},t=[];return e.is_vpn&&t.push('<span class="badge bg-warning text-dark" style="font-size:0.6rem;">VPN</span>'),e.is_tor&&t.push('<span class="badge bg-danger" style="font-size:0.6rem;">Tor</span>'),e.is_proxy&&t.push('<span class="badge bg-warning text-dark" style="font-size:0.6rem;">Proxy</span>'),t.join(" ")}get hasThreatFlags(){const e=this.model?.get("geolocation")||{};return!!(e.is_vpn||e.is_tor||e.is_proxy)}}class ProfileSessionsSection extends e.View{constructor(e={}){super({className:"profile-sessions-section",template:'\n                <style>\n                    .pss-primary { font-size: 0.85rem; font-weight: 500; }\n                    .pss-secondary { font-size: 0.73rem; color: #6c757d; margin-top: 0.15rem; }\n                    .pss-icon { color: #6c757d; font-size: 1.1rem; vertical-align: middle; margin-right: 0.35rem; }\n                </style>\n                <div id="sessions-table"></div>\n            ',...e})}async onInit(){await super.onInit(),this.tableView=new n.TableView({containerId:"sessions-table",collection:new s.UserDeviceLocationList({size:10}),defaultQuery:{user:this.model.id},searchable:!1,filterable:!1,selectable:!1,actions:null,clickAction:"view",itemClass:SessionRow,columns:[{key:"user_device",label:"Session",template:'\n                        <div class="pss-primary">\n                            <i class="bi {{deviceIcon}} pss-icon"></i>{{browserName}} <span class="text-muted fw-normal">on</span> {{deviceName}}\n                        </div>\n                        <div class="pss-secondary">\n                            <i class="bi bi-geo-alt me-1"></i>{{locationText}}\n                            <span class="text-muted mx-1">&middot;</span>\n                            {{model.ip_address}}\n                            {{#hasThreatFlags|bool}} <span class="ms-1">{{{threatFlags}}}</span>{{/hasThreatFlags|bool}}\n                        </div>'},{key:"last_seen",label:"Last Seen",formatter:"relative"}],onItemView:e=>this._showSessionDetail(e)}),this.addChild(this.tableView)}_showSessionDetail(e){const i=e.toJSON?e.toJSON():e,s=i.user_device||{},n=s.device_info?.device||{},a=s.device_info?.user_agent||{},o=s.device_info?.os||{},r=i.geolocation||{},l=a.family?`${a.family} ${[a.major,a.minor,a.patch].filter(Boolean).join(".")}`:"Unknown",d=`${n.brand||""} ${n.family||""}`.trim()||"Unknown",c=o.family?`${o.family} ${[o.major,o.minor,o.patch].filter(Boolean).join(".")}`:"—",p=[r.city,r.region,r.country_name].filter(Boolean).join(", ")||"—",m=[];r.is_vpn&&m.push('<span class="badge bg-warning text-dark">VPN</span>'),r.is_tor&&m.push('<span class="badge bg-danger">Tor</span>'),r.is_proxy&&m.push('<span class="badge bg-warning text-dark">Proxy</span>'),r.is_datacenter&&m.push('<span class="badge bg-secondary">Datacenter</span>'),r.is_known_attacker&&m.push('<span class="badge bg-danger">Known Attacker</span>');const u=(e,t)=>`\n            <div style="display:flex; padding:0.4rem 0; border-bottom:1px solid #f0f0f0;">\n                <div style="width:120px; font-size:0.8rem; color:#6c757d; flex-shrink:0;">${e}</div>\n                <div style="flex:1; font-size:0.85rem;">${t||"—"}</div>\n            </div>`;t.Modal.dialog({title:`<i class="bi bi-clock-history me-2"></i>${l} on ${d}`,size:"sm",centered:!0,body:`\n                <div style="font-size:0.85rem;">\n                    ${u("Browser",l)}\n                    ${u("Device",d)}\n                    ${u("OS",c)}\n                    ${u("IP Address",i.ip_address)}\n                    ${u("Location",p)}\n                    ${u("ISP",r.isp||r.asn_org||"—")}\n                    ${u("ASN",r.asn||"—")}\n                    ${u("Threat Level",r.threat_level||"—")}\n                    ${m.length?u("Flags",m.join(" ")):""}\n                    ${u("First Seen",i.first_seen?new Date(1e3*i.first_seen).toLocaleString():"—")}\n                    ${u("Last Seen",i.last_seen?new Date(1e3*i.last_seen).toLocaleString():"—")}\n                </div>`,buttons:[{text:"Close",class:"btn-outline-secondary",dismiss:!0}]})}}class DeviceRow extends n.TableRow{get deviceIcon(){const e=this.model?.get("device_info")?.device||{},t=this.model?.get("device_info")?.os||{};return["iPhone","Android"].some(i=>(e.family||"").includes(i)||(t.family||"").includes(i))?"bi-phone":"bi-laptop"}get deviceName(){const e=this.model?.get("device_info")?.device||{};return`${e.brand||""} ${e.family||""}`.trim()||"Unknown Device"}get deviceModel(){return this.model?.get("device_info")?.device?.model||""}get browserName(){const e=this.model?.get("device_info")?.user_agent||{};return e.family?`${e.family} ${e.major||""}`.trim():""}get osName(){const e=this.model?.get("device_info")?.os||{};return e.family?`${e.family} ${e.major||""}`.trim():""}get deviceMeta(){return[this.browserName,this.osName].filter(Boolean).join(" · ")||"—"}}class ProfileDevicesSection extends e.View{constructor(e={}){super({className:"profile-devices-section",template:'\n                <style>\n                    .pds-primary { font-size: 0.85rem; font-weight: 500; }\n                    .pds-model { font-weight: 400; color: #6c757d; }\n                    .pds-secondary { font-size: 0.73rem; color: #6c757d; margin-top: 0.15rem; }\n                    .pds-icon { color: #6c757d; font-size: 1.1rem; vertical-align: middle; margin-right: 0.35rem; }\n                </style>\n                <div id="devices-table"></div>\n            ',...e})}async onInit(){await super.onInit(),this.tableView=new n.TableView({containerId:"devices-table",collection:new s.UserDeviceList({size:10}),defaultQuery:{user:this.model.id},searchable:!1,filterable:!1,selectable:!1,actions:null,clickAction:"view",itemClass:DeviceRow,columns:[{key:"device_info",label:"Device",template:'\n                        <div class="pds-primary">\n                            <i class="bi {{deviceIcon}} pds-icon"></i>{{deviceName}}\n                            {{#deviceModel}} <span class="pds-model">({{deviceModel}})</span>{{/deviceModel}}\n                        </div>\n                        <div class="pds-secondary">\n                            {{deviceMeta}}\n                            {{#model.last_ip}} <span class="text-muted mx-1">&middot;</span> {{model.last_ip}}{{/model.last_ip}}\n                        </div>'},{key:"last_seen",label:"Last Seen",formatter:"relative"}],onItemView:e=>this._showDeviceDetail(e)}),this.addChild(this.tableView)}_showDeviceDetail(e){const i=e.toJSON?e.toJSON():e,s=i.device_info||{},n=s.device||{},a=s.user_agent||{},o=s.os||{},r=`${n.brand||""} ${n.family||""}`.trim()||"Unknown",l=a.family?`${a.family} ${[a.major,a.minor,a.patch].filter(Boolean).join(".")}`:"Unknown",d=o.family?`${o.family} ${[o.major,o.minor,o.patch].filter(Boolean).join(".")}`:"—",c=["iPhone","Android"].some(e=>(n.family||"").includes(e)||(o.family||"").includes(e)),p=(e,t)=>`\n            <div style="display:flex; padding:0.4rem 0; border-bottom:1px solid #f0f0f0;">\n                <div style="width:120px; font-size:0.8rem; color:#6c757d; flex-shrink:0;">${e}</div>\n                <div style="flex:1; font-size:0.85rem;">${t||"—"}</div>\n            </div>`;t.Modal.dialog({title:`<i class="bi ${c?"bi-phone":"bi-laptop"} me-2"></i>${r}`,size:"sm",centered:!0,body:`\n                <div style="font-size:0.85rem;">\n                    ${p("Device",`${r} (${n.model||"—"})`)}\n                    ${p("Browser",l)}\n                    ${p("OS",d)}\n                    ${p("Last IP",i.last_ip)}\n                    ${p("Type",c?"Mobile":"Desktop")}\n                    ${p("First Seen",i.first_seen?new Date(1e3*i.first_seen).toLocaleString():"—")}\n                    ${p("Last Seen",i.last_seen?new Date(1e3*i.last_seen).toLocaleString():"—")}\n                </div>`,buttons:[{text:"Close",class:"btn-outline-secondary",dismiss:!0}]})}}class SecurityEvent extends i.Model{constructor(e={},t={}){super(e,{endpoint:"/api/account/security-events",...t})}}class SecurityEventList extends i.Collection{constructor(e={}){super({ModelClass:SecurityEvent,endpoint:"/api/account/security-events",size:15,...e})}}const r=["invalid_password","totp:login_failed","totp:confirm_failed","passkey:login_failed","sessions:revoke_failed","email_change:invalid","email_change:expired"],l=["login","oauth","email_verify:confirmed","email_verify:confirmed_code","phone_verify:confirmed","phone_change:confirmed","username:changed"];class SecurityEventRow extends n.TableRow{get kindBadgeClass(){const e=this.model?.get("kind")||"";return r.includes(e)?"bg-danger":l.includes(e)?"bg-success":"bg-secondary"}get kindLabel(){return(this.model?.get("kind")||"").replace(/[_:]/g," ").replace(/\b\w/g,e=>e.toUpperCase())}get kindIcon(){const e=this.model?.get("kind")||"";return r.includes(e)?"bi-exclamation-triangle":l.includes(e)?"bi-check-circle":"bi-info-circle"}}class ProfileSecurityEventsSection extends e.View{constructor(e={}){super({className:"profile-security-events-section",template:'<div id="security-events-table"></div>',...e})}async onInit(){await super.onInit(),this.tableView=new n.TableView({containerId:"security-events-table",collection:new SecurityEventList,defaultQuery:{sort:"-created"},hideActivePillNames:["sort"],itemClass:SecurityEventRow,columns:[{key:"kind",label:"Event",template:'<span class="badge {{kindBadgeClass}}"><i class="bi {{kindIcon}} me-1"></i>{{kindLabel}}</span>'},{key:"summary",label:"Details"},{key:"ip",label:"IP",visibility:"lg"},{key:"created|relative",label:"Time",sortable:!0}],searchable:!0,sortable:!0,filterable:!1,paginated:!0,showAdd:!1,showExport:!1,tableOptions:{striped:!1,hover:!0,size:"sm"},emptyMessage:"No security events"}),this.addChild(this.tableView)}}const d={in_app:"In-App",email:"Email",push:"Push"},c=["in_app","email","push"];class ProfileNotificationsSection extends e.View{constructor(e={}){super({className:"profile-notifications-section",template:'\n                <style>\n                    .pn-table { width: 100%; border-collapse: collapse; }\n                    .pn-table th { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #adb5bd; padding: 0.5rem 0.75rem; border-bottom: 2px solid #e9ecef; }\n                    .pn-table th:first-child { text-align: left; }\n                    .pn-table th:not(:first-child) { text-align: center; width: 80px; }\n                    .pn-table td { padding: 0.65rem 0.75rem; border-bottom: 1px solid #f0f0f0; }\n                    .pn-table td:first-child { font-size: 0.88rem; font-weight: 500; text-transform: capitalize; }\n                    .pn-table td:not(:first-child) { text-align: center; }\n                    .pn-table tr:last-child td { border-bottom: none; }\n                    .pn-empty { text-align: center; padding: 2rem 1rem; color: #6c757d; }\n                    .pn-empty i { font-size: 2rem; color: #ced4da; display: block; margin-bottom: 0.5rem; }\n                </style>\n\n                {{#hasPreferences|bool}}\n                <table class="pn-table">\n                    <thead>\n                        <tr>\n                            <th>Type</th>\n                            {{#channels}}\n                                <th>{{.label}}</th>\n                            {{/channels}}\n                        </tr>\n                    </thead>\n                    <tbody>\n                        {{#preferenceRows}}\n                        <tr>\n                            <td>{{.kindLabel}}</td>\n                            {{#.toggles}}\n                                <td>\n                                    <input type="checkbox" class="form-check-input"\n                                        data-action="toggle-pref"\n                                        data-kind="{{.kind}}"\n                                        data-channel="{{.channel}}"\n                                        {{#.checked}}checked{{/.checked}}>\n                                </td>\n                            {{/.toggles}}\n                        </tr>\n                        {{/preferenceRows}}\n                    </tbody>\n                </table>\n                {{/hasPreferences|bool}}\n                {{^hasPreferences|bool}}\n                <div class="pn-empty">\n                    <i class="bi bi-bell"></i>\n                    No notification preferences configured\n                    <div style="font-size: 0.78rem; margin-top: 0.5rem;">\n                        Preferences will appear here once notification types are defined.\n                    </div>\n                </div>\n                {{/hasPreferences|bool}}\n            ',...e}),this.preferences={}}get channels(){return c.map(e=>({key:e,label:d[e]||e}))}get hasPreferences(){return Object.keys(this.preferences).length>0}get preferenceRows(){return Object.keys(this.preferences).sort().map(e=>({kind:e,kindLabel:e.replace(/[_-]/g," ").replace(/\b\w/g,e=>e.toUpperCase()),toggles:c.map(t=>({kind:e,channel:t,checked:!1!==this.preferences[e]?.[t]}))}))}async onBeforeRender(){try{const e=await i.rest.GET("/api/account/notification/preferences",{},{dataOnly:!0});this.preferences=e?.data?.preferences||e?.data||{}}catch(e){this.preferences={}}}async onActionTogglePref(e,t){const s=t.dataset.kind,n=t.dataset.channel,a=t.checked;this.preferences[s]||(this.preferences[s]={}),this.preferences[s][n]=a;try{const e=await i.rest.POST("/api/account/notification/preferences",{preferences:{[s]:{[n]:a}}});e.success||(this.getApp()?.toast?.error(e.message||"Failed to update preference"),t.checked=!a)}catch(o){this.getApp()?.toast?.error("Failed to update preference"),t.checked=!a}return!0}}class ProfileApiKeysSection extends e.View{constructor(e={}){super({className:"profile-api-keys-section",template:'\n                <style>\n                    .pak-warning { padding: 0.75rem 1rem; background: #fff3cd; border: 1px solid #ffecb5; border-radius: 8px; margin-bottom: 1.25rem; font-size: 0.82rem; color: #664d03; display: flex; align-items: flex-start; gap: 0.6rem; }\n                    .pak-warning i { font-size: 1rem; flex-shrink: 0; margin-top: 0.1rem; }\n                    .pak-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }\n                    .pak-header h6 { margin: 0; font-weight: 600; }\n                    .pak-list { border: 1px solid #e9ecef; border-radius: 8px; overflow: hidden; }\n                    .pak-item { display: flex; align-items: center; padding: 0.75rem 1rem; border-bottom: 1px solid #f0f0f0; gap: 1rem; }\n                    .pak-item:last-child { border-bottom: none; }\n                    .pak-item-icon { color: #6c757d; font-size: 1.1rem; flex-shrink: 0; }\n                    .pak-item-info { flex: 1; min-width: 0; }\n                    .pak-item-name { font-weight: 600; font-size: 0.85rem; }\n                    .pak-item-meta { font-size: 0.75rem; color: #6c757d; display: flex; gap: 1rem; flex-wrap: wrap; margin-top: 0.15rem; }\n                    .pak-item-actions { flex-shrink: 0; }\n                    .pak-empty { padding: 2rem; text-align: center; color: #6c757d; font-size: 0.85rem; }\n                    .pak-result { padding: 1rem; background: #d1e7dd; border: 1px solid #badbcc; border-radius: 8px; margin-bottom: 1rem; }\n                    .pak-result-label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #0f5132; margin-bottom: 0.5rem; }\n                    .pak-token-wrap { display: flex; gap: 0.5rem; align-items: center; }\n                    .pak-token { flex: 1; font-family: monospace; font-size: 0.78rem; padding: 0.5rem 0.75rem; background: #fff; border: 1px solid #dee2e6; border-radius: 4px; word-break: break-all; max-height: 80px; overflow-y: auto; }\n                    .pak-token-warning { font-size: 0.75rem; color: #dc3545; margin-top: 0.5rem; font-weight: 600; }\n                </style>\n\n                <div class="pak-warning">\n                    <i class="bi bi-exclamation-triangle-fill"></i>\n                    <div>\n                        <strong>Treat API keys like passwords.</strong> They carry your full account permissions.\n                        Store them securely and never expose them in client-side code.\n                    </div>\n                </div>\n\n                <div id="pak-new-token" style="display: none;">\n                    <div class="pak-result">\n                        <div class="pak-result-label">Your New API Key</div>\n                        <div class="pak-token-wrap">\n                            <div class="pak-token" id="pak-token-display"></div>\n                            <button type="button" class="btn btn-outline-secondary btn-sm" data-action="copy-token" title="Copy">\n                                <i class="bi bi-clipboard"></i>\n                            </button>\n                        </div>\n                        <div class="pak-token-warning">\n                            <i class="bi bi-exclamation-circle me-1"></i>This token will not be shown again. Copy it now.\n                        </div>\n                    </div>\n                </div>\n\n                <div class="pak-header">\n                    <h6>Your API Keys</h6>\n                    <button type="button" class="btn btn-primary btn-sm" data-action="generate-key">\n                        <i class="bi bi-plus-lg me-1"></i>Generate Key\n                    </button>\n                </div>\n\n                <div id="pak-keys-list"></div>\n            ',...e}),this.apiKeys=[],this.generatedToken=null}async onBeforeRender(){await this._loadKeys()}async _loadKeys(){const e=await i.rest.GET("/api/account/api_keys",{},{},{dataOnly:!0});this.apiKeys=e.success&&Array.isArray(e.data)?e.data:[]}onAfterRender(){this._renderKeysList()}_renderKeysList(){const e=this.element?.querySelector("#pak-keys-list");if(!e)return;if(!this.apiKeys.length)return void(e.innerHTML='\n                <div class="pak-list">\n                    <div class="pak-empty">\n                        <i class="bi bi-key" style="font-size: 1.5rem; display: block; margin-bottom: 0.5rem;"></i>\n                        No API keys yet. Generate one to get started.\n                    </div>\n                </div>');const t=this.apiKeys.map(e=>{const t=e.name||"API Key",i=e.created?new Date(1e3*e.created).toLocaleDateString():"",s=e.expires?new Date(1e3*e.expires).toLocaleDateString():"Never",n=e.last_used?new Date(1e3*e.last_used).toLocaleDateString():"Never",a=e.allowed_ips?.length?e.allowed_ips.join(", "):"Any";return`\n                <div class="pak-item">\n                    <div class="pak-item-icon"><i class="bi bi-key"></i></div>\n                    <div class="pak-item-info">\n                        <div class="pak-item-name">${t} ${!1!==e.is_active?'<span class="badge bg-success">Active</span>':'<span class="badge bg-secondary">Inactive</span>'}</div>\n                        <div class="pak-item-meta">\n                            <span><i class="bi bi-code-square me-1"></i>${e.token_prefix?`${e.token_prefix}...`:"••••••••"}</span>\n                            <span><i class="bi bi-calendar me-1"></i>Created ${i}</span>\n                            <span><i class="bi bi-clock me-1"></i>Expires ${s}</span>\n                            <span><i class="bi bi-activity me-1"></i>Last used ${n}</span>\n                            <span><i class="bi bi-globe me-1"></i>IPs: ${a}</span>\n                        </div>\n                    </div>\n                    <div class="pak-item-actions">\n                        <button type="button" class="btn btn-outline-danger btn-sm" data-action="delete-key" data-id="${e.id}" title="Delete">\n                            <i class="bi bi-trash"></i>\n                        </button>\n                    </div>\n                </div>`}).join("");e.innerHTML=`<div class="pak-list">${t}</div>`}async onActionGenerateKey(){const e=await t.Modal.form({title:"Generate API Key",icon:"bi-key",fields:[{name:"name",type:"text",label:"Key Name",placeholder:"e.g., CI/CD Pipeline, Mobile App",required:!0,help:"A descriptive name to identify this key."},{name:"allowed_ips",type:"text",label:"Allowed IPs",placeholder:"e.g., 203.0.113.0/24, 10.0.0.1",help:"Optional. Comma-separated IP addresses or CIDR ranges."},{name:"expire_days",type:"select",label:"Expiration",value:"90",options:[{value:"30",label:"30 days"},{value:"60",label:"60 days"},{value:"90",label:"90 days"},{value:"180",label:"180 days"},{value:"360",label:"360 days"}]}]});if(!e)return!0;const s={name:e.name,expire_days:parseInt(e.expire_days||"90",10)},n=(e.allowed_ips||"").trim();n&&(s.allowed_ips=n.split(",").map(e=>e.trim()).filter(Boolean));const a=await i.rest.POST("/api/auth/generate_api_key",s,{},{dataOnly:!0});if(a.success&&a.data?.token){this.generatedToken=a.data.token;const e=this.element.querySelector("#pak-new-token"),t=this.element.querySelector("#pak-token-display");e&&t&&(t.textContent=this.generatedToken,e.style.display="block"),this.getApp()?.toast?.success("API key generated"),await this._loadKeys(),this._renderKeysList()}else this.getApp()?.toast?.error(a.message||"Failed to generate API key");return!0}async onActionDeleteKey(e){const s=e.dataset.id;if(!s)return!0;if(!(await t.Modal.confirm("Are you sure you want to delete this API key? Any applications using it will lose access immediately.","Delete API Key")))return!0;const n=await i.rest.DELETE(`/api/account/api_keys/${s}`,{},{},{dataOnly:!0});if(n.success){this.getApp()?.toast?.success("API key deleted");const e=this.element.querySelector("#pak-new-token");e&&(e.style.display="none"),await this._loadKeys(),this._renderKeysList()}else this.getApp()?.toast?.error(n.message||"Failed to delete API key");return!0}async onActionCopyToken(){if(this.generatedToken)try{await navigator.clipboard.writeText(this.generatedToken),this.getApp()?.toast?.success("Token copied to clipboard")}catch{this.getApp()?.toast?.error("Failed to copy token")}return!0}}const p=["#667eea","#f5576c","#38b2ac","#ed8936","#9f7aea","#48bb78","#4299e1","#ed64a6"];class GroupMemberItem extends a.ListViewItem{get groupName(){return this.model?.get("group")?.name||"Unknown Group"}get groupKind(){return(this.model?.get("group")?.kind||"").replace(/^\w/,e=>e.toUpperCase())}get initials(){return this.groupName.split(/\s+/).map(e=>e[0]).join("").substring(0,2).toUpperCase()}get avatarColor(){const e=this.groupName;let t=0;for(let i=0;i<e.length;i++)t=e.charCodeAt(i)+((t<<5)-t);return p[Math.abs(t)%p.length]}get roleName(){let e=this.model?.get("metadata")?.role||"";return!e&&this.model?.get("permissions")?.manage_group&&(e="Admin"),e}get hasRole(){return!!this.roleName}get roleBadgeClass(){const e=(this.roleName||"").toLowerCase();return"owner"===e?"bg-primary":"admin"===e?"bg-info":"bg-secondary"}get permissionsList(){const e=this.model?.get("permissions");return e?Object.keys(e).filter(t=>!0===e[t]).map(e=>e.replace(/_/g," ").replace(/\b\w/g,e=>e.toUpperCase())):[]}get hasPermissions(){return this.permissionsList.length>0}}class ProfileGroupsSection extends e.View{constructor(e={}){super({className:"profile-groups-section",template:'\n                <style>\n                    .pg-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0; border-bottom: 1px solid #f0f0f0; }\n                    .pg-row:last-child { border-bottom: none; }\n                    .pg-avatar { width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 700; color: #fff; flex-shrink: 0; }\n                    .pg-info { flex: 1; }\n                    .pg-name { font-weight: 600; font-size: 0.88rem; }\n                    .pg-meta { font-size: 0.73rem; color: #6c757d; }\n                    .pg-role { font-size: 0.7rem; }\n                    .pg-perms { display: flex; flex-wrap: wrap; gap: 0.25rem; justify-content: flex-end; }\n                    .pg-perm-tag { display: inline-flex; align-items: center; font-size: 0.68rem; padding: 0.15em 0.45em; background: #f0f4ff; border: 1px solid #d4deff; border-radius: 3px; color: #4a6cf7; }\n                </style>\n                <div id="groups-list"></div>\n            ',...e})}async onInit(){await super.onInit(),this.listView=new a.ListView({containerId:"groups-list",collection:new n.MemberList({size:50}),defaultQuery:{user:this.model.id},itemClass:GroupMemberItem,itemTemplate:'\n                <div class="pg-row">\n                    <div class="pg-avatar" style="background: {{avatarColor}};">{{initials}}</div>\n                    <div class="pg-info">\n                        <div class="pg-name">{{groupName}}</div>\n                        <div class="pg-meta">{{groupKind}}</div>\n                    </div>\n                    {{#hasPermissions|bool}}\n                    <div class="pg-perms">\n                        {{#permissionsList}}\n                            <span class="pg-perm-tag">{{.}}</span>\n                        {{/permissionsList}}\n                    </div>\n                    {{/hasPermissions|bool}}\n                    {{#hasRole|bool}}\n                        <span class="pg-role badge {{roleBadgeClass}}">{{roleName}}</span>\n                    {{/hasRole|bool}}\n                </div>\n            ',emptyMessage:"You are not a member of any groups"}),this.addChild(this.listView)}}class ProfilePermissionsSection extends e.View{constructor(e={}){super({className:"profile-permissions-section",template:'\n                <style>\n                    .pp-role-bar { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 1rem; background: #f0f0ff; border-radius: 8px; margin-bottom: 1.25rem; font-size: 0.85rem; }\n                    .pp-role-bar i { color: #6f42c1; font-size: 1rem; }\n                    .pp-role-bar strong { color: #6f42c1; }\n                    .pp-section-label { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #adb5bd; margin-bottom: 0.5rem; margin-top: 1.75rem; }\n                    .pp-section-label:first-child { margin-top: 0; }\n                    .pp-grid { display: flex; flex-wrap: wrap; gap: 0.3rem; margin-bottom: 1.25rem; }\n                    .pp-tag { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.78rem; padding: 0.25em 0.6em; background: #f8f9fc; border: 1px solid #e9ecef; border-radius: 4px; color: #495057; }\n                    .pp-tag i { font-size: 0.65rem; color: #198754; }\n                    .pp-tag-group { background: #e7f1ff; border-color: #b6d4fe; }\n                    .pp-tag-group i { color: #0d6efd; }\n                    .pp-note { font-size: 0.78rem; color: #adb5bd; margin-top: 1rem; }\n                    .pp-empty { color: #6c757d; font-style: italic; font-size: 0.85rem; padding: 0.5rem 0; }\n                    .pp-group-header { display: flex; align-items: center; gap: 0.5rem; }\n                    .pp-group-name { font-size: 0.78rem; font-weight: 400; color: #6c757d; }\n                </style>\n\n                {{#model.is_superuser|bool}}\n                    <div class="pp-role-bar">\n                        <i class="bi bi-star-fill"></i>\n                        <span><strong>Superuser</strong> &mdash; full system access</span>\n                    </div>\n                {{/model.is_superuser|bool}}\n\n                <div class="pp-section-label">System Permissions</div>\n\n                {{#systemPermissions|bool}}\n                    <div class="pp-grid">\n                        {{#systemPermissions}}\n                            <span class="pp-tag"><i class="bi bi-check-circle-fill"></i> {{.}}</span>\n                        {{/systemPermissions}}\n                    </div>\n                {{/systemPermissions|bool}}\n\n                {{^systemPermissions|bool}}\n                    <div class="pp-empty">No system permissions assigned</div>\n                {{/systemPermissions|bool}}\n\n                {{#hasActiveGroup|bool}}\n                    <div class="pp-section-label">\n                        <div class="pp-group-header">\n                            <span>Group Permissions</span>\n                            <span class="pp-group-name">&mdash; {{activeGroupName}}</span>\n                        </div>\n                    </div>\n\n                    {{#groupPermissions|bool}}\n                        <div class="pp-grid">\n                            {{#groupPermissions}}\n                                <span class="pp-tag pp-tag-group"><i class="bi bi-check-circle-fill"></i> {{.}}</span>\n                            {{/groupPermissions}}\n                        </div>\n                    {{/groupPermissions|bool}}\n\n                    {{^groupPermissions|bool}}\n                        <div class="pp-empty">No group permissions assigned</div>\n                    {{/groupPermissions|bool}}\n                {{/hasActiveGroup|bool}}\n\n                <div class="pp-note">\n                    <i class="bi bi-info-circle me-1"></i>\n                    Permissions are managed by your administrator.\n                </div>\n            ',...e})}get systemPermissions(){if(!this.model)return[];const e=this.model.get("permissions");if(!e)return[];const t={};return s.User.PERMISSIONS.forEach(e=>{t[e.name]=e.label}),Object.keys(e).filter(t=>!0===e[t]).map(e=>t[e]||e.replace(/_/g," ").replace(/\b\w/g,e=>e.toUpperCase()))}get hasActiveGroup(){const e=this.getApp();return!(!e?.activeGroup||!this.model?.member)}get activeGroupName(){const e=this.getApp();return e?.activeGroup?.get("name")||e?.activeGroup?.get("display_name")||"Current Group"}get groupPermissions(){if(!this.model?.member)return[];const e=this.model.member.get("permissions");return e?Object.keys(e).filter(t=>!0===e[t]).map(e=>e.replace(/_/g," ").replace(/\b\w/g,e=>e.toUpperCase())):[]}}const m={profile:ProfileOverviewSection,personal:ProfilePersonalSection,security:ProfileSecuritySection,connected:ProfileConnectedSection,sessions:ProfileSessionsSection,devices:ProfileDevicesSection,security_events:ProfileSecurityEventsSection,notifications:ProfileNotificationsSection,api_keys:ProfileApiKeysSection,groups:ProfileGroupsSection,permissions:ProfilePermissionsSection};class UserProfileView extends e.View{constructor(e={}){super({className:"user-profile-view",template:'\n                <style>\n                    .up-layout { display: flex; height: 100%; }\n                    .up-nav { width: 200px; background: #f8f9fc; border-right: 1px solid #e9ecef; padding: 0.75rem 0; flex-shrink: 0; overflow-y: auto; }\n                    .up-nav-label { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #adb5bd; padding: 0.75rem 1.25rem 0.25rem; }\n                    .up-nav a { color: #495057; padding: 0.45rem 1.25rem; font-size: 0.85rem; display: flex; align-items: center; gap: 0.5rem; text-decoration: none; }\n                    .up-nav a:hover { background: #e9ecef; }\n                    .up-nav a.active { background: #e7f1ff; color: #0d6efd; font-weight: 600; border-right: 2px solid #0d6efd; }\n                    .up-nav a i { width: 18px; text-align: center; font-size: 0.9rem; }\n                    .up-content { flex: 1; overflow-y: auto; padding: 1.5rem 2.5rem; }\n                    .up-header { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.5rem; border-bottom: 1px solid #e9ecef; }\n                    .up-avatar-wrap { position: relative; flex-shrink: 0; cursor: pointer; }\n                    .up-avatar-wrap img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }\n                    .up-avatar-initials { width: 56px; height: 56px; border-radius: 50%; background: #e7f1ff; color: #0d6efd; display: flex; align-items: center; justify-content: center; font-size: 1.3rem; font-weight: 700; }\n                    .up-header-info { flex: 1; min-width: 0; }\n                    .up-header-name { display: flex; align-items: center; gap: 0.5rem; }\n                    .up-header-name h5 { margin: 0; font-weight: 700; font-size: 1.05rem; }\n                    .up-header-badge { font-size: 0.65rem; padding: 0.15em 0.5em; border-radius: 3px; font-weight: 600; }\n                    .up-header-badge-staff { background: #e7f1ff; color: #0d6efd; }\n                    .up-header-badge-su { background: #fff3cd; color: #856404; }\n                    .up-header-sub { font-size: 0.78rem; color: #6c757d; display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }\n                    .up-header-sub .up-dot { color: #ced4da; }\n                    .up-header-verified { display: inline-flex; align-items: center; gap: 0.2rem; font-size: 0.72rem; color: #198754; }\n                    .up-header-verified i { font-size: 0.7rem; }\n                    .up-close { flex-shrink: 0; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border: none; background: none; color: #6c757d; font-size: 1.1rem; border-radius: 6px; cursor: pointer; padding: 0; align-self: flex-start; margin-top: -0.15rem; }\n                    .up-close:hover { background: #f0f0f0; color: #212529; }\n                    @media (max-width: 576px) {\n                        .up-nav { display: none; }\n                        .up-content { padding: 1.25rem; }\n                    }\n                </style>\n                <div class="up-layout" style="flex-direction: column; min-height: 480px;">\n                    <div class="up-header">\n                        <div class="up-avatar-wrap" data-action="change-avatar" title="Change avatar">\n                            {{{model.avatar|avatar}}}\n                        </div>\n                        <div class="up-header-info">\n                            <div class="up-header-name">\n                                <h5>{{model.display_name}}</h5>\n                                {{#model.is_superuser|bool}}<span class="up-header-badge up-header-badge-su">Superuser</span>{{/model.is_superuser|bool}}\n                                {{^model.is_superuser|bool}}\n                                    {{#model.is_staff|bool}}<span class="up-header-badge up-header-badge-staff">Staff</span>{{/model.is_staff|bool}}\n                                {{/model.is_superuser|bool}}\n                            </div>\n                            <div class="up-header-sub">\n                                <span>{{model.email}}</span>\n                                {{#model.is_email_verified|bool}}\n                                    <span class="up-dot">&middot;</span>\n                                    <span class="up-header-verified"><i class="bi bi-patch-check-fill"></i> Email</span>\n                                {{/model.is_email_verified|bool}}\n                                {{#model.requires_mfa|bool}}\n                                    <span class="up-dot">&middot;</span>\n                                    <span class="up-header-verified"><i class="bi bi-shield-fill-check"></i> MFA</span>\n                                {{/model.requires_mfa|bool}}\n                            </div>\n                        </div>\n                        <button type="button" class="up-close" data-action="close-dialog" title="Close"><i class="bi bi-x-lg"></i></button>\n                    </div>\n                    <div class="up-layout" style="flex: 1; min-height: 0;">\n                        <nav class="up-nav">\n                            <a href="#" class="nav-link active" data-action="navigate" data-section="profile"><i class="bi bi-person"></i> Profile</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="personal"><i class="bi bi-person-vcard"></i> Personal</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="security"><i class="bi bi-shield-lock"></i> Security</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="connected"><i class="bi bi-plug"></i> Connected</a>\n                            <div class="up-nav-label">Activity</div>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="sessions"><i class="bi bi-clock-history"></i> Sessions</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="devices"><i class="bi bi-laptop"></i> Devices</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="security_events"><i class="bi bi-shield-exclamation"></i> Security Events</a>\n                            <div class="up-nav-label">Settings</div>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="notifications"><i class="bi bi-bell"></i> Notifications</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="api_keys"><i class="bi bi-key"></i> API Keys</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="groups"><i class="bi bi-people"></i> Groups</a>\n                            <a href="#" class="nav-link" data-action="navigate" data-section="permissions"><i class="bi bi-shield-check"></i> Permissions</a>\n                        </nav>\n                        <div class="up-content" id="profile-section"></div>\n                    </div>\n                </div>\n            ',...e}),this.activeSection="profile",this.sectionView=null}get hasAvatar(){return!!(this.model&&this.model.get("avatar")&&this.model.get("avatar").url)}async onBeforeRender(){this.model&&await this.model.fetch({params:{graph:"full"}})}async onAfterRender(){this.element?.querySelectorAll(".up-nav a").forEach(e=>{e.classList.toggle("active",e.dataset.section===this.activeSection)})}async onInit(){await super.onInit(),this.sectionView=new ProfileOverviewSection({model:this.model,containerId:"profile-section"}),this.addChild(this.sectionView)}async onActionNavigate(e,t){e.preventDefault();const i=t.dataset.section;if(!i||i===this.activeSection)return!0;const s=m[i];return!s||(this.sectionView&&this.removeChild(this.sectionView),this.sectionView=new s({model:this.model,containerId:"profile-section"}),this.addChild(this.sectionView),await this.sectionView.render(),this.activeSection=i,this.element.querySelectorAll(".up-nav a").forEach(e=>{e.classList.toggle("active",e.dataset.section===i)}),!0)}async onActionChangeAvatar(){const e=await t.Modal.updateModelImage({model:this.model,field:"avatar",title:"Change Avatar",upload:!0},{name:"avatar",size:"lg",imageSize:{width:200,height:200},placeholder:"Upload your avatar"});e&&200===e.status&&await this.render()}async onActionCloseDialog(){const e=this.element?.closest(".modal");if(e){const t=bootstrap?.Modal?.getInstance(e);t&&t.hide()}return!0}async onActionUpdateEmail(){const e=this.getApp(),i=e.rest,s=await t.Modal.form({title:"Change Email Address",size:"sm",submitText:"Send Code",fields:[{name:"new_email_address",type:"text",label:"New Email Address",required:!0,placeholder:"Enter new email address",attributes:{autocomplete:"off",inputmode:"email"},cols:12}]});if(!s)return!0;const n=await i.POST("/api/auth/email/change/request",{email:s.new_email_address,method:"code"});if(!n.success)return e.toast.error(n.message||"Failed to request email change"),!0;const a=await t.Modal.prompt(`Enter the 6-digit code sent to <strong>${s.new_email_address}</strong>`,"Confirm Email Change",{placeholder:"000000"});if(!a)return!0;const o=await i.POST("/api/auth/email/change/confirm",{code:a.trim()},{},{dataOnly:!0});return o.success&&o.data?(o.data.access_token&&e.auth?.setTokens?.(o.data),e.toast.success("Email address updated"),await this.model.fetch({params:{graph:"full"}}),await this.render()):e.toast.error(o.message||"Invalid or expired code"),!0}async onActionUpdatePhone(){const e=this.getApp(),i=e.rest;if(!this.model.get("phone_number"))return e.toast.info("Use the profile section to add a phone number"),!0;const s=await t.Modal.form({title:"Change Phone Number",size:"sm",submitText:"Send Code",fields:[{name:"new_phone",type:"tel",label:"New Phone Number",required:!0,placeholder:"(415) 555-0123",attributes:{autocomplete:"off"},cols:12}]});if(!s)return!0;const n=await i.POST("/api/auth/phone/change/request",{phone_number:s.new_phone},{},{dataOnly:!0});if(!n.success)return e.toast.error(n.message||"Failed to request phone change"),!0;const a=n.data?.session_token,o=await t.Modal.prompt(`Enter the 6-digit code sent to <strong>${s.new_phone}</strong>`,"Confirm Phone Change",{placeholder:"000000"});if(!o)return!0;const r=await i.POST("/api/auth/phone/change/confirm",{session_token:a,code:o.trim()});return r.success?(e.toast.success("Phone number updated"),await this.model.fetch({params:{graph:"full"}}),await this.render()):e.toast.error(r.message||"Invalid or expired code"),!0}}exports.PasskeySetupView=PasskeySetupView,exports.ProfileApiKeysSection=ProfileApiKeysSection,exports.ProfileConnectedSection=ProfileConnectedSection,exports.ProfileDevicesSection=ProfileDevicesSection,exports.ProfileGroupsSection=ProfileGroupsSection,exports.ProfileNotificationsSection=ProfileNotificationsSection,exports.ProfileOverviewSection=ProfileOverviewSection,exports.ProfilePermissionsSection=ProfilePermissionsSection,exports.ProfilePersonalSection=ProfilePersonalSection,exports.ProfileSecurityEventsSection=ProfileSecurityEventsSection,exports.ProfileSecuritySection=ProfileSecuritySection,exports.ProfileSessionsSection=ProfileSessionsSection,exports.UserProfileView=UserProfileView;
-//# sourceMappingURL=UserProfileView-DC70hRer.js.map