var __esDecorate = (this && this.__esDecorate) || function (ctor, descriptorIn, decorators, contextIn, initializers, extraInitializers) {
    function accept(f) { if (f !== void 0 && typeof f !== "function") throw new TypeError("Function expected"); return f; }
    var kind = contextIn.kind, key = kind === "getter" ? "get" : kind === "setter" ? "set" : "value";
    var target = !descriptorIn && ctor ? contextIn["static"] ? ctor : ctor.prototype : null;
    var descriptor = descriptorIn || (target ? Object.getOwnPropertyDescriptor(target, contextIn.name) : {});
    var _, done = false;
    for (var i = decorators.length - 1; i >= 0; i--) {
        var context = {};
        for (var p in contextIn) context[p] = p === "access" ? {} : contextIn[p];
        for (var p in contextIn.access) context.access[p] = contextIn.access[p];
        context.addInitializer = function (f) { if (done) throw new TypeError("Cannot add initializers after decoration has completed"); extraInitializers.push(accept(f || null)); };
        var result = (0, decorators[i])(kind === "accessor" ? { get: descriptor.get, set: descriptor.set } : descriptor[key], context);
        if (kind === "accessor") {
            if (result === void 0) continue;
            if (result === null || typeof result !== "object") throw new TypeError("Object expected");
            if (_ = accept(result.get)) descriptor.get = _;
            if (_ = accept(result.set)) descriptor.set = _;
            if (_ = accept(result.init)) initializers.unshift(_);
        }
        else if (_ = accept(result)) {
            if (kind === "field") initializers.unshift(_);
            else descriptor[key] = _;
        }
    }
    if (target) Object.defineProperty(target, contextIn.name, descriptor);
    done = true;
};
var __runInitializers = (this && this.__runInitializers) || function (thisArg, initializers, value) {
    var useValue = arguments.length > 2;
    for (var i = 0; i < initializers.length; i++) {
        value = useValue ? initializers[i].call(thisArg, value) : initializers[i].call(thisArg);
    }
    return useValue ? value : void 0;
};
import { DeesElement, customElement, html, css, cssManager, state, } from '@design.estate/dees-element';
import './index.js';
let SzDemoViewNetwork = (() => {
    let _classDecorators = [customElement('sz-demo-view-network')];
    let _classDescriptor;
    let _classExtraInitializers = [];
    let _classThis;
    let _classSuper = DeesElement;
    let _currentTab_decorators;
    let _currentTab_initializers = [];
    let _currentTab_extraInitializers = [];
    let _selectedDomain_decorators;
    let _selectedDomain_initializers = [];
    let _selectedDomain_extraInitializers = [];
    var SzDemoViewNetwork = class extends _classSuper {
        static { _classThis = this; }
        static {
            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
            _currentTab_decorators = [state()];
            _selectedDomain_decorators = [state()];
            __esDecorate(this, null, _currentTab_decorators, { kind: "accessor", name: "currentTab", static: false, private: false, access: { has: obj => "currentTab" in obj, get: obj => obj.currentTab, set: (obj, value) => { obj.currentTab = value; } }, metadata: _metadata }, _currentTab_initializers, _currentTab_extraInitializers);
            __esDecorate(this, null, _selectedDomain_decorators, { kind: "accessor", name: "selectedDomain", static: false, private: false, access: { has: obj => "selectedDomain" in obj, get: obj => obj.selectedDomain, set: (obj, value) => { obj.selectedDomain = value; } }, metadata: _metadata }, _selectedDomain_initializers, _selectedDomain_extraInitializers);
            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
            SzDemoViewNetwork = _classThis = _classDescriptor.value;
            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
        }
        appui = null;
        #currentTab_accessor_storage = __runInitializers(this, _currentTab_initializers, 'proxy');
        get currentTab() { return this.#currentTab_accessor_storage; }
        set currentTab(value) { this.#currentTab_accessor_storage = value; }
        async onActivate(context) {
            this.appui = context.appui;
            // Set up content tabs
            this.appui.setContentTabs([
                {
                    key: 'Reverse Proxy',
                    action: () => {
                        this.currentTab = 'proxy';
                        this.updateSecondaryMenu();
                    },
                },
                {
                    key: 'DNS Records',
                    action: () => {
                        this.currentTab = 'dns';
                        this.updateSecondaryMenu();
                    },
                },
                {
                    key: 'Domains',
                    action: () => {
                        this.currentTab = 'domains';
                        this.updateSecondaryMenu();
                    },
                },
            ]);
            this.updateSecondaryMenu();
        }
        updateSecondaryMenu() {
            if (!this.appui)
                return;
            if (this.currentTab === 'proxy') {
                this.appui.setSecondaryMenu({
                    heading: 'Reverse Proxy',
                    groups: [
                        {
                            name: 'Actions',
                            items: [
                                { type: 'action', key: 'Add Route', iconName: 'lucide:Plus', action: () => { console.log('Add route'); } },
                                { type: 'action', key: 'Refresh', iconName: 'lucide:RefreshCw', action: () => { console.log('Refresh'); } },
                            ],
                        },
                        {
                            name: 'Statistics',
                            items: [
                                { type: 'header', label: '42 Active Connections' },
                                { type: 'header', label: '15,420 Requests Today' },
                            ],
                        },
                    ],
                });
            }
            else if (this.currentTab === 'dns') {
                this.appui.setSecondaryMenu({
                    heading: 'DNS Records',
                    groups: [
                        {
                            name: 'Actions',
                            items: [
                                { type: 'action', key: 'Add Record', iconName: 'lucide:Plus', action: () => { console.log('Add record'); } },
                                { type: 'action', key: 'Import Zone', iconName: 'lucide:Upload', action: () => { console.log('Import zone'); } },
                            ],
                        },
                        {
                            name: 'Zones',
                            items: [
                                { key: 'example.com', iconName: 'lucide:Globe', action: () => { console.log('Select example.com'); } },
                                { key: 'example.net', iconName: 'lucide:Globe', action: () => { console.log('Select example.net'); } },
                                { key: 'myapp.io', iconName: 'lucide:Globe', action: () => { console.log('Select myapp.io'); } },
                            ],
                        },
                    ],
                });
            }
            else if (this.currentTab === 'domains' || this.currentTab === 'domain-detail') {
                this.appui.setSecondaryMenu({
                    heading: 'Domains',
                    groups: [
                        {
                            name: 'Actions',
                            items: [
                                { type: 'action', key: 'Add Domain', iconName: 'lucide:Plus', action: () => { console.log('Add domain'); } },
                                { type: 'action', key: 'Verify All', iconName: 'lucide:CheckCircle', action: () => { console.log('Verify all'); } },
                            ],
                        },
                        {
                            name: 'Certificates',
                            items: [
                                { key: 'Valid', iconName: 'lucide:ShieldCheck', badge: '3', badgeVariant: 'success', action: () => { console.log('Filter valid'); } },
                                { key: 'Expiring Soon', iconName: 'lucide:AlertTriangle', badge: '1', badgeVariant: 'warning', action: () => { console.log('Filter expiring'); } },
                            ],
                        },
                    ],
                });
            }
        }
        onDeactivate() {
            // Cleanup if needed
        }
        #selectedDomain_accessor_storage = (__runInitializers(this, _currentTab_extraInitializers), __runInitializers(this, _selectedDomain_initializers, null));
        get selectedDomain() { return this.#selectedDomain_accessor_storage; }
        set selectedDomain(value) { this.#selectedDomain_accessor_storage = value; }
        demoProxyRoutes = (__runInitializers(this, _selectedDomain_extraInitializers), [
            { id: '1', domain: 'api.example.com', target: 'http://api-gateway:3000', ssl: true, status: 'active' },
            { id: '2', domain: 'app.example.com', target: 'http://frontend:8080', ssl: true, status: 'active' },
            { id: '3', domain: 'admin.example.com', target: 'http://admin-panel:4000', ssl: true, status: 'active' },
            { id: '4', domain: 'legacy.example.com', target: 'http://legacy:5000', ssl: false, status: 'inactive' },
        ]);
        demoAccessLogs = [
            { timestamp: '14:30:22', method: 'GET', path: '/api/users', status: 200, duration: '45ms', ip: '192.168.1.100' },
            { timestamp: '14:30:21', method: 'POST', path: '/api/orders', status: 201, duration: '120ms', ip: '192.168.1.105' },
            { timestamp: '14:30:20', method: 'GET', path: '/api/products', status: 200, duration: '89ms', ip: '192.168.1.100' },
            { timestamp: '14:30:19', method: 'DELETE', path: '/api/cache', status: 204, duration: '12ms', ip: '192.168.1.50' },
            { timestamp: '14:30:18', method: 'GET', path: '/health', status: 200, duration: '5ms', ip: '10.0.0.1' },
        ];
        demoDnsRecords = [
            { id: '1', type: 'A', name: '@', value: '192.168.1.100', ttl: 3600, zone: 'example.com' },
            { id: '2', type: 'A', name: 'api', value: '192.168.1.100', ttl: 3600, zone: 'example.com' },
            { id: '3', type: 'CNAME', name: 'www', value: 'example.com', ttl: 3600, zone: 'example.com' },
            { id: '4', type: 'MX', name: '@', value: 'mail.example.com', ttl: 3600, zone: 'example.com', priority: 10 },
            { id: '5', type: 'TXT', name: '@', value: 'v=spf1 include:_spf.example.com ~all', ttl: 3600, zone: 'example.com' },
        ];
        demoDomains = [
            { id: '1', name: 'example.com', status: 'active', ssl: true, sslExpiry: '2024-04-15', dnsProvider: 'Cloudflare', recordCount: 12 },
            { id: '2', name: 'api.example.com', status: 'active', ssl: true, sslExpiry: '2024-05-20', dnsProvider: 'Cloudflare', recordCount: 3 },
            { id: '3', name: 'staging.example.com', status: 'pending', ssl: false, sslExpiry: null, dnsProvider: 'Cloudflare', recordCount: 2 },
            { id: '4', name: 'legacy.example.net', status: 'active', ssl: true, sslExpiry: '2024-02-10', dnsProvider: 'Manual', recordCount: 5 },
        ];
        demoDomainDetail = {
            id: '1',
            name: 'example.com',
            status: 'active',
            verified: true,
            createdAt: '2024-01-10',
            proxyRoutes: ['/api/*', '/app/*', '/admin/*'],
        };
        demoCertificate = {
            id: '1',
            domain: 'example.com',
            issuer: "Let's Encrypt",
            validFrom: '2024-01-10',
            validUntil: '2024-04-10',
            daysRemaining: 45,
            status: 'valid',
            autoRenew: true,
            chain: ['R3', 'ISRG Root X1'],
        };
        demoDomainDnsRecords = [
            { id: '1', type: 'A', name: '@', value: '192.168.1.100', ttl: 3600 },
            { id: '2', type: 'CNAME', name: 'www', value: 'example.com', ttl: 3600 },
            { id: '3', type: 'MX', name: '@', value: 'mail.example.com', ttl: 3600, priority: 10 },
            { id: '4', type: 'TXT', name: '@', value: 'v=spf1 include:_spf.example.com ~all', ttl: 3600 },
        ];
        static styles = [
            cssManager.defaultStyles,
            css `
      :host {
        display: block;
        padding: 24px;
        height: 100%;
        overflow-y: auto;
        box-sizing: border-box;
      }

      .page-header {
        margin-bottom: 24px;
      }

      .page-title {
        font-size: 24px;
        font-weight: 700;
        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
        margin: 0 0 8px 0;
      }

      .page-subtitle {
        font-size: 14px;
        color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
        margin: 0;
      }

      .tabs {
        display: flex;
        gap: 4px;
        margin-bottom: 24px;
        border-bottom: 1px solid ${cssManager.bdTheme('#e4e4e7', '#27272a')};
      }

      .tab {
        padding: 10px 16px;
        font-size: 14px;
        font-weight: 500;
        color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
        background: transparent;
        border: none;
        cursor: pointer;
        position: relative;
        transition: color 200ms ease;
      }

      .tab:hover {
        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
      }

      .tab.active {
        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
      }

      .tab.active::after {
        content: '';
        position: absolute;
        bottom: -1px;
        left: 0;
        right: 0;
        height: 2px;
        background: ${cssManager.bdTheme('#18181b', '#fafafa')};
        border-radius: 1px 1px 0 0;
      }

      .back-button {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        background: transparent;
        border: 1px solid ${cssManager.bdTheme('#e4e4e7', '#27272a')};
        border-radius: 6px;
        font-size: 13px;
        color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
        cursor: pointer;
        margin-bottom: 16px;
        transition: all 200ms ease;
      }

      .back-button:hover {
        background: ${cssManager.bdTheme('#f4f4f5', '#18181b')};
        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
      }
    `,
        ];
        render() {
            if (this.currentTab === 'domain-detail') {
                return this.renderDomainDetail();
            }
            return html `
      ${this.currentTab === 'proxy' ? this.renderProxyView() : ''}
      ${this.currentTab === 'dns' ? this.renderDnsView() : ''}
      ${this.currentTab === 'domains' ? this.renderDomainsView() : ''}
    `;
        }
        renderProxyView() {
            return html `
      <sz-network-proxy-view
        .routes=${this.demoProxyRoutes}
        .accessLogs=${this.demoAccessLogs}
        .stats=${{
                activeConnections: 42,
                requestsToday: 15420,
                bytesTransferred: '2.4 GB',
            }}
        @add-route=${() => console.log('Add route')}
        @edit-route=${(e) => console.log('Edit route:', e.detail)}
        @delete-route=${(e) => console.log('Delete route:', e.detail)}
      ></sz-network-proxy-view>
    `;
        }
        renderDnsView() {
            return html `
      <sz-network-dns-view
        .records=${this.demoDnsRecords}
        .zones=${['example.com', 'example.net', 'myapp.io']}
        .selectedZone=${'example.com'}
        @add-record=${() => console.log('Add record')}
        @edit-record=${(e) => console.log('Edit record:', e.detail)}
        @delete-record=${(e) => console.log('Delete record:', e.detail)}
        @change-zone=${(e) => console.log('Change zone:', e.detail)}
      ></sz-network-dns-view>
    `;
        }
        renderDomainsView() {
            return html `
      <sz-network-domains-view
        .domains=${this.demoDomains}
        @add-domain=${() => console.log('Add domain')}
        @view-domain=${(e) => { this.selectedDomain = e.detail; this.currentTab = 'domain-detail'; }}
        @renew-ssl=${(e) => console.log('Renew SSL:', e.detail)}
        @delete-domain=${(e) => console.log('Delete domain:', e.detail)}
      ></sz-network-domains-view>
    `;
        }
        renderDomainDetail() {
            return html `
      <button class="back-button" @click=${() => this.currentTab = 'domains'}>
        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
          <polyline points="15 18 9 12 15 6"/>
        </svg>
        Back to Domains
      </button>

      <sz-domain-detail-view
        .domain=${this.demoDomainDetail}
        .certificate=${this.demoCertificate}
        .dnsRecords=${this.demoDomainDnsRecords}
        @verify-domain=${() => console.log('Verify domain')}
        @delete-domain=${() => { console.log('Delete domain'); this.currentTab = 'domains'; }}
        @renew-certificate=${() => console.log('Renew certificate')}
        @add-dns-record=${() => console.log('Add DNS record')}
        @edit-dns-record=${(e) => console.log('Edit DNS record:', e.detail)}
        @delete-dns-record=${(e) => console.log('Delete DNS record:', e.detail)}
      ></sz-domain-detail-view>
    `;
        }
        static {
            __runInitializers(_classThis, _classExtraInitializers);
        }
    };
    return SzDemoViewNetwork = _classThis;
})();
export { SzDemoViewNetwork };
//# sourceMappingURL=data:application/json;base64, 