@serve.zone/catalog 1.0.1

package/dist_ts_web/elements/sz-demo-view-services.js

@@ -0,0 +1,468 @@
+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, property, state, } from '@design.estate/dees-element';
+import './index.js';
+let SzDemoViewServices = (() => {
+    let _classDecorators = [customElement('sz-demo-view-services')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = DeesElement;
+    let _currentView_decorators;
+    let _currentView_initializers = [];
+    let _currentView_extraInitializers = [];
+    let _selectedService_decorators;
+    let _selectedService_initializers = [];
+    let _selectedService_extraInitializers = [];
+    let _selectedPlatformService_decorators;
+    let _selectedPlatformService_initializers = [];
+    let _selectedPlatformService_extraInitializers = [];
+    var SzDemoViewServices = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _currentView_decorators = [state()];
+            _selectedService_decorators = [state()];
+            _selectedPlatformService_decorators = [state()];
+            __esDecorate(this, null, _currentView_decorators, { kind: "accessor", name: "currentView", static: false, private: false, access: { has: obj => "currentView" in obj, get: obj => obj.currentView, set: (obj, value) => { obj.currentView = value; } }, metadata: _metadata }, _currentView_initializers, _currentView_extraInitializers);
+            __esDecorate(this, null, _selectedService_decorators, { kind: "accessor", name: "selectedService", static: false, private: false, access: { has: obj => "selectedService" in obj, get: obj => obj.selectedService, set: (obj, value) => { obj.selectedService = value; } }, metadata: _metadata }, _selectedService_initializers, _selectedService_extraInitializers);
+            __esDecorate(this, null, _selectedPlatformService_decorators, { kind: "accessor", name: "selectedPlatformService", static: false, private: false, access: { has: obj => "selectedPlatformService" in obj, get: obj => obj.selectedPlatformService, set: (obj, value) => { obj.selectedPlatformService = value; } }, metadata: _metadata }, _selectedPlatformService_initializers, _selectedPlatformService_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            SzDemoViewServices = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        appui = null;
+        #currentView_accessor_storage = __runInitializers(this, _currentView_initializers, 'list');
+        get currentView() { return this.#currentView_accessor_storage; }
+        set currentView(value) { this.#currentView_accessor_storage = value; }
+        #selectedService_accessor_storage = (__runInitializers(this, _currentView_extraInitializers), __runInitializers(this, _selectedService_initializers, null));
+        get selectedService() { return this.#selectedService_accessor_storage; }
+        set selectedService(value) { this.#selectedService_accessor_storage = value; }
+        #selectedPlatformService_accessor_storage = (__runInitializers(this, _selectedService_extraInitializers), __runInitializers(this, _selectedPlatformService_initializers, null));
+        get selectedPlatformService() { return this.#selectedPlatformService_accessor_storage; }
+        set selectedPlatformService(value) { this.#selectedPlatformService_accessor_storage = value; }
+        demoServices = (__runInitializers(this, _selectedPlatformService_extraInitializers), [
+            {
+                id: '1',
+                name: 'nginx-proxy',
+                image: 'nginx:latest',
+                status: 'running',
+                cpu: '2.5%',
+                memory: '256 MB',
+                ports: '80, 443',
+                uptime: '5d 12h',
+            },
+            {
+                id: '2',
+                name: 'api-gateway',
+                image: 'api-gateway:v2.1.0',
+                status: 'running',
+                cpu: '8.2%',
+                memory: '512 MB',
+                ports: '3000',
+                uptime: '3d 8h',
+            },
+            {
+                id: '3',
+                name: 'worker-service',
+                image: 'worker:latest',
+                status: 'stopped',
+                cpu: '0%',
+                memory: '0 MB',
+                ports: '-',
+                uptime: '-',
+            },
+            {
+                id: '4',
+                name: 'redis-cache',
+                image: 'redis:7-alpine',
+                status: 'running',
+                cpu: '1.2%',
+                memory: '128 MB',
+                ports: '6379',
+                uptime: '10d 4h',
+            },
+        ]);
+        demoPlatformService = {
+            id: '1',
+            name: 'MongoDB',
+            type: 'mongodb',
+            status: 'running',
+            version: '7.0.4',
+            host: 'localhost',
+            port: 27017,
+            credentials: { username: 'admin', password: '••••••••' },
+            config: { replicaSet: 'rs0', authEnabled: true, journaling: true },
+            metrics: { cpu: 12, memory: 45, storage: 23, connections: 8 },
+        };
+        demoPlatformLogs = [
+            { timestamp: '2024-01-20 14:30:22', level: 'info', message: 'Connection accepted from 127.0.0.1:54321' },
+            { timestamp: '2024-01-20 14:30:20', level: 'info', message: 'Index build completed on collection users' },
+            { timestamp: '2024-01-20 14:30:15', level: 'warn', message: 'Slow query detected: 1.2s on collection orders' },
+            { timestamp: '2024-01-20 14:30:10', level: 'info', message: 'Checkpoint complete' },
+        ];
+        demoBackupSchedules = [
+            { id: '1', scope: 'All Services', retention: 'D:7, W:4, M:12', schedule: '0 2 * * *', lastRun: '1/2/2026, 2:00:03 AM', nextRun: '1/3/2026, 2:00:00 AM', status: 'active' },
+        ];
+        demoBackups = [
+            { id: '1', service: 'nginx-proxy', createdAt: '1/2/2026, 2:00:03 AM', size: '22.0 MB', includes: ['Image'] },
+            { id: '2', service: 'api-gateway', createdAt: '1/2/2026, 2:00:02 AM', size: '156.5 MB', includes: ['Image', 'Volumes'] },
+            { id: '3', service: 'redis-cache', createdAt: '1/2/2026, 2:00:00 AM', size: '48.0 MB', includes: ['Image', 'Data'] },
+        ];
+        static styles = [
+            cssManager.defaultStyles,
+            css `
+      :host {
+        display: block;
+        padding: 24px;
+        height: 100%;
+        overflow-y: auto;
+        box-sizing: border-box;
+      }
+
+      .page-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: flex-start;
+        margin-bottom: 24px;
+      }
+
+      .header-info {
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+      }
+
+      .page-title {
+        font-size: 24px;
+        font-weight: 700;
+        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
+        margin: 0;
+      }
+
+      .page-subtitle {
+        font-size: 14px;
+        color: ${cssManager.bdTheme('#71717a', '#a1a1aa')};
+        margin: 0;
+      }
+
+      .header-actions {
+        display: flex;
+        gap: 8px;
+      }
+
+      .action-button {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        padding: 8px 14px;
+        background: ${cssManager.bdTheme('#18181b', '#fafafa')};
+        border: none;
+        border-radius: 6px;
+        font-size: 13px;
+        font-weight: 500;
+        color: ${cssManager.bdTheme('#fafafa', '#18181b')};
+        cursor: pointer;
+        transition: all 200ms ease;
+      }
+
+      .action-button:hover {
+        opacity: 0.9;
+      }
+
+      .action-button.secondary {
+        background: ${cssManager.bdTheme('#ffffff', '#09090b')};
+        border: 1px solid ${cssManager.bdTheme('#e4e4e7', '#27272a')};
+        color: ${cssManager.bdTheme('#18181b', '#fafafa')};
+      }
+
+      .action-button.secondary:hover {
+        background: ${cssManager.bdTheme('#f4f4f5', '#18181b')};
+      }
+
+      .tabs {
+        display: flex;
+        gap: 4px;
+        margin-bottom: 24px;
+        border-bottom: 1px solid ${cssManager.bdTheme('#e4e4e7', '#27272a')};
+        padding-bottom: 0;
+      }
+
+      .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() {
+            return html `
+      ${this.currentView === 'list' ? this.renderListView() : ''}
+      ${this.currentView === 'create' ? this.renderCreateView() : ''}
+      ${this.currentView === 'detail' ? this.renderDetailView() : ''}
+      ${this.currentView === 'backups' ? this.renderBackupsView() : ''}
+      ${this.currentView === 'platform-detail' ? this.renderPlatformDetailView() : ''}
+    `;
+        }
+        renderListView() {
+            return html `
+      <div class="page-header">
+        <div class="header-info">
+          <h1 class="page-title">Services</h1>
+          <p class="page-subtitle">Manage your Docker containers and platform services</p>
+        </div>
+        <div class="header-actions">
+          <button class="action-button secondary" @click=${() => this.currentView = 'backups'}>
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/>
+              <polyline points="17 8 12 3 7 8"/>
+              <line x1="12" y1="3" x2="12" y2="15"/>
+            </svg>
+            Backups
+          </button>
+          <button class="action-button" @click=${() => this.currentView = 'create'}>
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+              <line x1="12" y1="5" x2="12" y2="19"/>
+              <line x1="5" y1="12" x2="19" y2="12"/>
+            </svg>
+            Deploy Service
+          </button>
+        </div>
+      </div>
+
+      <div class="tabs">
+        <button class="tab active">Docker Services</button>
+        <button class="tab" @click=${() => { this.selectedPlatformService = this.demoPlatformService; this.currentView = 'platform-detail'; }}>Platform Services</button>
+      </div>
+
+      <sz-services-list-view
+        .services=${this.demoServices}
+        @view-service=${(e) => { this.selectedService = e.detail; this.currentView = 'detail'; }}
+        @start-service=${(e) => console.log('Start service:', e.detail)}
+        @stop-service=${(e) => console.log('Stop service:', e.detail)}
+        @restart-service=${(e) => console.log('Restart service:', e.detail)}
+        @delete-service=${(e) => console.log('Delete service:', e.detail)}
+      ></sz-services-list-view>
+    `;
+        }
+        renderCreateView() {
+            return html `
+      <button class="back-button" @click=${() => this.currentView = 'list'}>
+        <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 Services
+      </button>
+
+      <sz-service-create-view
+        .registries=${[
+                { id: '1', name: 'Onebox Registry', url: 'registry.onebox.local' },
+                { id: '2', name: 'Docker Hub', url: 'docker.io' },
+            ]}
+        @create-service=${(e) => { console.log('Create service:', e.detail); this.currentView = 'list'; }}
+        @cancel=${() => this.currentView = 'list'}
+      ></sz-service-create-view>
+    `;
+        }
+        renderDetailView() {
+            return html `
+      <button class="back-button" @click=${() => this.currentView = 'list'}>
+        <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 Services
+      </button>
+
+      <sz-service-detail-view
+        .service=${{
+                id: this.selectedService?.id || '1',
+                name: this.selectedService?.name || 'nginx-proxy',
+                image: this.selectedService?.image || 'nginx:latest',
+                status: this.selectedService?.status || 'running',
+                ports: [{ host: '80', container: '80' }, { host: '443', container: '443' }],
+                envVars: [
+                    { key: 'NGINX_HOST', value: 'localhost' },
+                    { key: 'NGINX_PORT', value: '80' },
+                ],
+                volumes: [
+                    { host: '/data/nginx/conf', container: '/etc/nginx/conf.d' },
+                ],
+                createdAt: '2024-01-15 10:30:00',
+                restartPolicy: 'always',
+            }}
+        .logs=${[
+                { timestamp: '2024-01-20 14:30:22', level: 'info', message: '127.0.0.1 - - [20/Jan/2024:14:30:22 +0000] "GET / HTTP/1.1" 200 612' },
+                { timestamp: '2024-01-20 14:30:21', level: 'info', message: '127.0.0.1 - - [20/Jan/2024:14:30:21 +0000] "GET /api/health HTTP/1.1" 200 15' },
+                { timestamp: '2024-01-20 14:30:20', level: 'warn', message: 'upstream timed out (110: Connection timed out)' },
+                { timestamp: '2024-01-20 14:30:19', level: 'info', message: '127.0.0.1 - - [20/Jan/2024:14:30:19 +0000] "POST /api/data HTTP/1.1" 201 89' },
+            ]}
+        @start=${() => console.log('Start')}
+        @stop=${() => console.log('Stop')}
+        @restart=${() => console.log('Restart')}
+      ></sz-service-detail-view>
+    `;
+        }
+        renderBackupsView() {
+            return html `
+      <button class="back-button" @click=${() => this.currentView = 'list'}>
+        <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 Services
+      </button>
+
+      <div class="page-header">
+        <div class="header-info">
+          <h1 class="page-title">Backups</h1>
+          <p class="page-subtitle">Manage backup schedules and restore points</p>
+        </div>
+      </div>
+
+      <sz-services-backups-view
+        .schedules=${this.demoBackupSchedules}
+        .backups=${this.demoBackups}
+        @create-schedule=${() => console.log('Create schedule')}
+        @run-now=${(e) => console.log('Run now:', e.detail)}
+        @download=${(e) => console.log('Download:', e.detail)}
+      ></sz-services-backups-view>
+    `;
+        }
+        renderPlatformDetailView() {
+            return html `
+      <button class="back-button" @click=${() => this.currentView = 'list'}>
+        <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 Services
+      </button>
+
+      <sz-platform-service-detail-view
+        .service=${this.demoPlatformService}
+        .logs=${this.demoPlatformLogs}
+        @start=${() => console.log('Start')}
+        @stop=${() => console.log('Stop')}
+        @restart=${() => console.log('Restart')}
+      ></sz-platform-service-detail-view>
+    `;
+        }
+        async onActivate(context) {
+            this.appui = context.appui;
+            // Set up content tabs
+            this.appui.setContentTabs([
+                { key: 'Docker Services', action: () => { this.currentView = 'list'; this.updateSecondaryMenu(); } },
+                { key: 'Platform Services', action: () => { this.currentView = 'platform-detail'; this.updateSecondaryMenu(); } },
+                { key: 'Backups', action: () => { this.currentView = 'backups'; this.updateSecondaryMenu(); } },
+            ]);
+            this.updateSecondaryMenu();
+        }
+        updateSecondaryMenu() {
+            if (!this.appui)
+                return;
+            this.appui.setSecondaryMenu({
+                heading: 'Services',
+                groups: [
+                    {
+                        name: 'Actions',
+                        items: [
+                            { type: 'action', key: 'Deploy Service', iconName: 'lucide:Plus', action: () => { this.currentView = 'create'; } },
+                            { type: 'action', key: 'Refresh', iconName: 'lucide:RefreshCw', action: () => { console.log('Refresh'); } },
+                        ],
+                    },
+                    {
+                        name: 'Quick Filters',
+                        items: [
+                            { key: 'Running', iconName: 'lucide:Play', badge: '3', badgeVariant: 'success', action: () => { console.log('Filter running'); } },
+                            { key: 'Stopped', iconName: 'lucide:Square', badge: '1', action: () => { console.log('Filter stopped'); } },
+                        ],
+                    },
+                ],
+            });
+        }
+        onDeactivate() {
+            // Cleanup if needed
+        }
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return SzDemoViewServices = _classThis;
+})();
+export { SzDemoViewServices };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3otZGVtby12aWV3LXNlcnZpY2VzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3N6LWRlbW8tdmlldy1zZXJ2aWNlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxFQUNMLFdBQVcsRUFDWCxhQUFhLEVBQ2IsSUFBSSxFQUNKLEdBQUcsRUFDSCxVQUFVLEVBQ1YsUUFBUSxFQUNSLEtBQUssR0FFTixNQUFNLDZCQUE2QixDQUFDO0FBRXJDLE9BQU8sWUFBWSxDQUFDO0lBU1Asa0JBQWtCOzRCQUQ5QixhQUFhLENBQUMsdUJBQXVCLENBQUM7Ozs7c0JBQ0MsV0FBVzs7Ozs7Ozs7OztrQ0FBbkIsU0FBUSxXQUFXOzs7O3VDQUdoRCxLQUFLLEVBQUU7MkNBR1AsS0FBSyxFQUFFO21EQUdQLEtBQUssRUFBRTtZQUxSLHNMQUFpQixXQUFXLDZCQUFYLFdBQVcsaUdBQXdFO1lBR3BHLGtNQUFpQixlQUFlLDZCQUFmLGVBQWUseUdBQWE7WUFHN0MsME5BQWlCLHVCQUF1Qiw2QkFBdkIsdUJBQXVCLHlIQUFhO1lBVnZELDZLQTZaQzs7OztRQTVaUyxLQUFLLEdBQXFCLElBQUksQ0FBQztRQUd2QyxtRkFBNkYsTUFBTSxFQUFDO1FBQXBHLElBQWlCLFdBQVcsaURBQXdFO1FBQXBHLElBQWlCLFdBQVcsdURBQXdFO1FBR3BHLHFKQUF3QyxJQUFJLEdBQUM7UUFBN0MsSUFBaUIsZUFBZSxxREFBYTtRQUE3QyxJQUFpQixlQUFlLDJEQUFhO1FBRzdDLHlLQUFnRCxJQUFJLEdBQUM7UUFBckQsSUFBaUIsdUJBQXVCLDZEQUFhO1FBQXJELElBQWlCLHVCQUF1QixtRUFBYTtRQUU3QyxZQUFZLHlFQUFHO1lBQ3JCO2dCQUNFLEVBQUUsRUFBRSxHQUFHO2dCQUNQLElBQUksRUFBRSxhQUFhO2dCQUNuQixLQUFLLEVBQUUsY0FBYztnQkFDckIsTUFB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

package/dist_ts_web/elements/sz-demo-view-settings.d.ts

@@ -0,0 +1,19 @@
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
+import type { DeesAppui } from '@design.estate/dees-catalog';
+import './index.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'sz-demo-view-settings': SzDemoViewSettings;
+    }
+}
+export declare class SzDemoViewSettings extends DeesElement {
+    private appui;
+    onActivate(context: {
+        appui: DeesAppui;
+        viewId: string;
+    }): Promise<void>;
+    onDeactivate(): void;
+    private demoSettings;
+    static styles: import("@design.estate/dees-element").CSSResult[];
+    render(): TemplateResult;
+}

package/dist_ts_web/elements/sz-demo-view-settings.js

@@ -0,0 +1,151 @@
+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, } from '@design.estate/dees-element';
+import './index.js';
+let SzDemoViewSettings = (() => {
+    let _classDecorators = [customElement('sz-demo-view-settings')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = DeesElement;
+    var SzDemoViewSettings = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            SzDemoViewSettings = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        appui = null;
+        async onActivate(context) {
+            this.appui = context.appui;
+            // Settings doesn't need content tabs, but we set up the secondary menu
+            this.appui.setSecondaryMenu({
+                heading: 'Settings',
+                groups: [
+                    {
+                        name: 'Categories',
+                        items: [
+                            { key: 'General', iconName: 'lucide:Settings', action: () => { console.log('General settings'); } },
+                            { key: 'Network', iconName: 'lucide:Network', action: () => { console.log('Network settings'); } },
+                            { key: 'Security', iconName: 'lucide:Shield', action: () => { console.log('Security settings'); } },
+                            { key: 'Certificates', iconName: 'lucide:FileBadge', action: () => { console.log('Certificate settings'); } },
+                        ],
+                    },
+                    {
+                        name: 'Actions',
+                        items: [
+                            { type: 'action', key: 'Export Config', iconName: 'lucide:Download', action: () => { console.log('Export config'); } },
+                            { type: 'action', key: 'Import Config', iconName: 'lucide:Upload', action: () => { console.log('Import config'); } },
+                            { type: 'action', variant: 'danger', key: 'Reset to Default', iconName: 'lucide:RotateCcw', confirmMessage: 'Are you sure you want to reset all settings to default?', action: () => { console.log('Reset settings'); } },
+                        ],
+                    },
+                ],
+            });
+        }
+        onDeactivate() {
+            // Cleanup if needed
+        }
+        demoSettings = {
+            darkMode: true,
+            cloudflareToken: '',
+            cloudflareZoneId: '',
+            autoRenewCerts: true,
+            renewalThreshold: 30,
+            acmeEmail: 'admin@serve.zone',
+            httpPort: 80,
+            httpsPort: 443,
+            forceHttps: true,
+        };
+        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;
+      }
+
+      .settings-container {
+        max-width: 800px;
+      }
+    `,
+        ];
+        render() {
+            return html `
+      <div class="page-header">
+        <h1 class="page-title">Settings</h1>
+        <p class="page-subtitle">Configure your onebox instance</p>
+      </div>
+
+      <div class="settings-container">
+        <sz-settings-view
+          .settings=${this.demoSettings}
+          currentUser="admin"
+          @setting-change=${(e) => console.log('Setting change:', e.detail)}
+          @change-password=${(e) => console.log('Change password:', e.detail)}
+          @reset=${() => console.log('Reset settings')}
+          @save=${(e) => console.log('Save settings:', e.detail)}
+        ></sz-settings-view>
+      </div>
+    `;
+        }
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return SzDemoViewSettings = _classThis;
+})();
+export { SzDemoViewSettings };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3otZGVtby12aWV3LXNldHRpbmdzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3N6LWRlbW8tdmlldy1zZXR0aW5ncy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxFQUNMLFdBQVcsRUFDWCxhQUFhLEVBQ2IsSUFBSSxFQUNKLEdBQUcsRUFDSCxVQUFVLEdBRVgsTUFBTSw2QkFBNkIsQ0FBQztBQUVyQyxPQUFPLFlBQVksQ0FBQztJQVNQLGtCQUFrQjs0QkFEOUIsYUFBYSxDQUFDLHVCQUF1QixDQUFDOzs7O3NCQUNDLFdBQVc7a0NBQW5CLFNBQVEsV0FBVzs7OztZQUFuRCw2S0FtR0M7Ozs7UUFsR1MsS0FBSyxHQUFxQixJQUFJLENBQUM7UUFFdkMsS0FBSyxDQUFDLFVBQVUsQ0FBQyxPQUE2QztZQUM1RCxJQUFJLENBQUMsS0FBSyxHQUFHLE9BQU8sQ0FBQyxLQUFLLENBQUM7WUFFM0IsdUVBQXVFO1lBQ3ZFLElBQUksQ0FBQyxLQUFLLENBQUMsZ0JBQWdCLENBQUM7Z0JBQzFCLE9BQU8sRUFBRSxVQUFVO2dCQUNuQixNQUFNLEVBQUU7b0JBQ047d0JBQ0UsSUFBSSxFQUFFLFlBQVk7d0JBQ2xCLEtBQUssRUFBRTs0QkFDTCxFQUFFLEdBQUcsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLGlCQUFpQixFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsR0FBRyxPQUFPLENBQUMsR0FBRyxDQUFDLGtCQUFrQixDQUFDLENBQUMsQ0FBQyxDQUFDLEVBQUU7NEJBQ25HLEVBQUUsR0FBRyxFQUFFLFNBQVMsRUFBRSxRQUFRLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxHQUFHLE9BQU8sQ0FBQyxHQUFHLENBQUMsa0JBQWtCLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRTs0QkFDbEcsRUFBRSxHQUFHLEVBQUUsVUFBVSxFQUFFLFFBQVEsRUFBRSxlQUFlLEVBQUUsTUFBTSxFQUFFLEdBQUcsRUFBRSxHQUFHLE9BQU8sQ0FBQyxHQUFHLENBQUMsbUJBQW1CLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRTs0QkFDbkcsRUFBRSxHQUFHLEVBQUUsY0FBYyxFQUFFLFFBQVEsRUFBRSxrQkFBa0IsRUFBRSxNQUFNLEVBQUUsR0FBRyxFQUFFLEdBQUcsT0FBTyxDQUFDLEdBQUcsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFO3lCQUM5RztxQkFDRjtvQkFDRDt3QkFDRSxJQUFJLEVBQUUsU0FBUzt3QkFDZixLQUFLLEVBQUU7NEJBQ0wsRUFBRSxJQUFJLEVBQUUsUUFBUSxFQUFFLEdBQUcsRUFBRSxlQUFlLEVBQUUsUUFBUSxFQUFFLGlCQUFpQixFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsR0FBRyxPQUFPLENBQUMsR0FBRyxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFOzRCQUN0SCxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsR0FBRyxFQUFFLGVBQWUsRUFBRSxRQUFRLEVBQUUsZUFBZSxFQUFFLE1BQU0sRUFBRSxHQUFHLEVBQUUsR0FBRyxPQUFPLENBQUMsR0FBRyxDQUFDLGVBQWUsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFOzRCQUNwSCxFQUFFLElBQUksRUFBRSxRQUFRLEVBQUUsT0FBTyxFQUFFLFFBQVEsRUFBRSxHQUFHLEVBQUUsa0JBQWtCLEVBQUUsUUFBUSxFQUFFLGtCQUFrQixFQUFFLGNBQWMsRUFBRSx5REFBeUQsRUFBRSxNQUFNLEVBQUUsR0FBRyxFQUFFLEdBQUcsT0FBTyxDQUFDLEdBQUcsQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDLENBQUMsQ0FBQyxFQUFFO3lCQUMxTjtxQkFDRjtpQkFDRjthQUNGLENBQUMsQ0FBQztRQUNMLENBQUM7UUFFRCxZQUFZO1lBQ1Ysb0JBQW9CO1FBQ3RCLENBQUM7UUFDTyxZQUFZLEdBQUc7WUFDckIsUUFBUSxFQUFFLElBQUk7WUFDZCxlQUFlLEVBQUUsRUFBRTtZQUNuQixnQkFBZ0IsRUFBRSxFQUFFO1lBQ3BCLGNBQWMsRUFBRSxJQUFJO1lBQ3BCLGdCQUFnQixFQUFFLEVBQUU7WUFDcEIsU0FBUyxFQUFFLGtCQUFrQjtZQUM3QixRQUFRLEVBQUUsRUFBRTtZQUNaLFNBQVMsRUFBRSxHQUFHO1lBQ2QsVUFBVSxFQUFFLElBQUk7U0FDakIsQ0FBQztRQUVLLE1BQU0sQ0FBQyxNQUFNLEdBQUc7WUFDckIsVUFBVSxDQUFDLGFBQWE7WUFDeEIsR0FBRyxDQUFBOzs7Ozs7Ozs7Ozs7Ozs7O2lCQWdCVSxVQUFVLENBQUMsT0FBTyxDQUFDLFNBQVMsRUFBRSxTQUFTLENBQUM7Ozs7OztpQkFNeEMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxTQUFTLEVBQUUsU0FBUyxDQUFDOzs7Ozs7O0tBT3BEO1NBQ0YsQ0FBQztRQUVLLE1BQU07WUFDWCxPQUFPLElBQUksQ0FBQTs7Ozs7Ozs7c0JBUU8sSUFBSSxDQUFDLFlBQVk7OzRCQUVYLENBQUMsQ0FBYyxFQUFFLEVBQUUsQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLGlCQUFpQixFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUM7NkJBQzNELENBQUMsQ0FBYyxFQUFFLEVBQUUsQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLGtCQUFrQixFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUM7bUJBQ3ZFLEdBQUcsRUFBRSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsZ0JBQWdCLENBQUM7a0JBQ3BDLENBQUMsQ0FBYyxFQUFFLEVBQUUsQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLGdCQUFnQixFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUM7OztLQUd4RSxDQUFDO1FBQ0osQ0FBQzs7WUFsR1UsdURBQWtCOzs7OztTQUFsQixrQkFBa0IifQ==