@serve.zone/dcrouter 11.14.0 → 11.16.0

package/dist_ts_web/elements/ops-view-vpn.js

@@ -0,0 +1,365 @@
+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, html, customElement, css, state, cssManager, } from '@design.estate/dees-element';
+import * as appstate from '../appstate.js';
+import * as interfaces from '../../dist_ts_interfaces/index.js';
+import { viewHostCss } from './shared/css.js';
+import {} from '@design.estate/dees-catalog';
+let OpsViewVpn = (() => {
+    let _classDecorators = [customElement('ops-view-vpn')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = DeesElement;
+    let _vpnState_decorators;
+    let _vpnState_initializers = [];
+    let _vpnState_extraInitializers = [];
+    var OpsViewVpn = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            _vpnState_decorators = [state()];
+            __esDecorate(this, null, _vpnState_decorators, { kind: "accessor", name: "vpnState", static: false, private: false, access: { has: obj => "vpnState" in obj, get: obj => obj.vpnState, set: (obj, value) => { obj.vpnState = value; } }, metadata: _metadata }, _vpnState_initializers, _vpnState_extraInitializers);
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            OpsViewVpn = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        #vpnState_accessor_storage = __runInitializers(this, _vpnState_initializers, appstate.vpnStatePart.getState());
+        get vpnState() { return this.#vpnState_accessor_storage; }
+        set vpnState(value) { this.#vpnState_accessor_storage = value; }
+        constructor() {
+            super();
+            __runInitializers(this, _vpnState_extraInitializers);
+            const sub = appstate.vpnStatePart.select().subscribe((newState) => {
+                this.vpnState = newState;
+            });
+            this.rxSubscriptions.push(sub);
+        }
+        async connectedCallback() {
+            await super.connectedCallback();
+            await appstate.vpnStatePart.dispatchAction(appstate.fetchVpnAction, null);
+        }
+        static styles = [
+            cssManager.defaultStyles,
+            viewHostCss,
+            css `
+      .vpnContainer {
+        display: flex;
+        flex-direction: column;
+        gap: 24px;
+      }
+
+      .statusBadge {
+        display: inline-flex;
+        align-items: center;
+        padding: 3px 10px;
+        border-radius: 12px;
+        font-size: 12px;
+        font-weight: 600;
+        letter-spacing: 0.02em;
+        text-transform: uppercase;
+      }
+
+      .statusBadge.enabled {
+        background: ${cssManager.bdTheme('#dcfce7', '#14532d')};
+        color: ${cssManager.bdTheme('#166534', '#4ade80')};
+      }
+
+      .statusBadge.disabled {
+        background: ${cssManager.bdTheme('#fef2f2', '#450a0a')};
+        color: ${cssManager.bdTheme('#991b1b', '#f87171')};
+      }
+
+      .configDialog {
+        padding: 16px;
+        background: ${cssManager.bdTheme('#fffbeb', '#1c1917')};
+        border: 1px solid ${cssManager.bdTheme('#fbbf24', '#92400e')};
+        border-radius: 8px;
+        margin-bottom: 16px;
+      }
+
+      .configDialog pre {
+        display: block;
+        padding: 12px;
+        background: ${cssManager.bdTheme('#1f2937', '#111827')};
+        color: #10b981;
+        border-radius: 4px;
+        font-family: monospace;
+        font-size: 12px;
+        white-space: pre-wrap;
+        word-break: break-all;
+        margin: 8px 0;
+        user-select: all;
+        max-height: 300px;
+        overflow-y: auto;
+      }
+
+      .configDialog .warning {
+        font-size: 12px;
+        color: ${cssManager.bdTheme('#92400e', '#fbbf24')};
+        margin-top: 8px;
+      }
+
+      .tagBadge {
+        display: inline-flex;
+        padding: 2px 8px;
+        border-radius: 4px;
+        font-size: 12px;
+        font-weight: 500;
+        background: ${cssManager.bdTheme('#eff6ff', '#172554')};
+        color: ${cssManager.bdTheme('#1e40af', '#60a5fa')};
+        margin-right: 4px;
+      }
+
+      .serverInfo {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+        gap: 12px;
+        padding: 16px;
+        background: ${cssManager.bdTheme('#f9fafb', '#111827')};
+        border-radius: 8px;
+        border: 1px solid ${cssManager.bdTheme('#e5e7eb', '#1f2937')};
+      }
+
+      .serverInfo .infoItem {
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+      }
+
+      .serverInfo .infoLabel {
+        font-size: 11px;
+        font-weight: 600;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        color: ${cssManager.bdTheme('#6b7280', '#9ca3af')};
+      }
+
+      .serverInfo .infoValue {
+        font-size: 14px;
+        font-family: monospace;
+        color: ${cssManager.bdTheme('#111827', '#f9fafb')};
+      }
+    `,
+        ];
+        render() {
+            const status = this.vpnState.status;
+            const clients = this.vpnState.clients;
+            const connectedCount = status?.connectedClients ?? 0;
+            const totalClients = clients.length;
+            const enabledClients = clients.filter(c => c.enabled).length;
+            const statsTiles = [
+                {
+                    id: 'totalClients',
+                    title: 'Total Clients',
+                    type: 'number',
+                    value: totalClients,
+                    icon: 'lucide:users',
+                    description: 'Registered VPN clients',
+                    color: '#3b82f6',
+                },
+                {
+                    id: 'connectedClients',
+                    title: 'Connected',
+                    type: 'number',
+                    value: connectedCount,
+                    icon: 'lucide:link',
+                    description: 'Currently connected',
+                    color: '#10b981',
+                },
+                {
+                    id: 'enabledClients',
+                    title: 'Enabled',
+                    type: 'number',
+                    value: enabledClients,
+                    icon: 'lucide:shieldCheck',
+                    description: 'Active client registrations',
+                    color: '#8b5cf6',
+                },
+                {
+                    id: 'serverStatus',
+                    title: 'Server',
+                    type: 'text',
+                    value: status?.running ? 'Running' : 'Stopped',
+                    icon: 'lucide:server',
+                    description: status?.running ? 'Active' : 'VPN server not running',
+                    color: status?.running ? '#10b981' : '#ef4444',
+                },
+            ];
+            return html `
+      <ops-sectionheading>VPN</ops-sectionheading>
+
+      ${this.vpnState.newClientConfig ? html `
+        <div class="configDialog">
+          <strong>Client created successfully!</strong>
+          <div class="warning">Copy the WireGuard config now. It contains private keys that won't be shown again.</div>
+          <pre>${this.vpnState.newClientConfig}</pre>
+          <dees-button
+            @click=${async () => {
+                if (navigator.clipboard && typeof navigator.clipboard.writeText === 'function') {
+                    await navigator.clipboard.writeText(this.vpnState.newClientConfig);
+                }
+                const { DeesToast } = await import('@design.estate/dees-catalog');
+                DeesToast.createAndShow({ message: 'Config copied to clipboard', type: 'success', duration: 3000 });
+            }}
+          >Copy to Clipboard</dees-button>
+          <dees-button
+            @click=${() => {
+                const blob = new Blob([this.vpnState.newClientConfig], { type: 'text/plain' });
+                const url = URL.createObjectURL(blob);
+                const a = document.createElement('a');
+                a.href = url;
+                a.download = 'wireguard.conf';
+                a.click();
+                URL.revokeObjectURL(url);
+            }}
+          >Download .conf</dees-button>
+          <dees-button
+            @click=${() => appstate.vpnStatePart.dispatchAction(appstate.clearNewClientConfigAction, null)}
+          >Dismiss</dees-button>
+        </div>
+      ` : ''}
+
+      <dees-statsgrid .statsTiles=${statsTiles}></dees-statsgrid>
+
+      ${status ? html `
+        <div class="serverInfo">
+          <div class="infoItem">
+            <span class="infoLabel">Subnet</span>
+            <span class="infoValue">${status.subnet}</span>
+          </div>
+          <div class="infoItem">
+            <span class="infoLabel">WireGuard Port</span>
+            <span class="infoValue">${status.wgListenPort}</span>
+          </div>
+          ${status.serverPublicKeys ? html `
+            <div class="infoItem">
+              <span class="infoLabel">WG Public Key</span>
+              <span class="infoValue" style="font-size: 11px; word-break: break-all;">${status.serverPublicKeys.wgPublicKey}</span>
+            </div>
+          ` : ''}
+        </div>
+      ` : ''}
+
+      <dees-table
+        .heading1=${'VPN Clients'}
+        .heading2=${'Manage WireGuard and SmartVPN client registrations'}
+        .data=${clients}
+        .displayFunction=${(client) => ({
+                'Client ID': client.clientId,
+                'Status': client.enabled
+                    ? html `<span class="statusBadge enabled">enabled</span>`
+                    : html `<span class="statusBadge disabled">disabled</span>`,
+                'VPN IP': client.assignedIp || '-',
+                'Tags': client.serverDefinedClientTags?.length
+                    ? html `${client.serverDefinedClientTags.map(t => html `<span class="tagBadge">${t}</span>`)}`
+                    : '-',
+                'Description': client.description || '-',
+                'Created': new Date(client.createdAt).toLocaleDateString(),
+            })}
+        .dataActions=${[
+                {
+                    name: 'Toggle',
+                    iconName: 'lucide:power',
+                    action: async (client) => {
+                        await appstate.vpnStatePart.dispatchAction(appstate.toggleVpnClientAction, {
+                            clientId: client.clientId,
+                            enabled: !client.enabled,
+                        });
+                    },
+                },
+                {
+                    name: 'Delete',
+                    iconName: 'lucide:trash2',
+                    action: async (client) => {
+                        const { DeesModal } = await import('@design.estate/dees-catalog');
+                        DeesModal.createAndShow({
+                            heading: 'Delete VPN Client',
+                            content: html `<p>Are you sure you want to delete client "${client.clientId}"?</p>`,
+                            menuOptions: [
+                                { name: 'Cancel', action: async (modal) => modal.destroy() },
+                                {
+                                    name: 'Delete',
+                                    action: async (modal) => {
+                                        await appstate.vpnStatePart.dispatchAction(appstate.deleteVpnClientAction, client.clientId);
+                                        modal.destroy();
+                                    },
+                                },
+                            ],
+                        });
+                    },
+                },
+            ]}
+        .createNewItem=${async () => {
+                const { DeesModal, DeesForm, DeesInputText } = await import('@design.estate/dees-catalog');
+                DeesModal.createAndShow({
+                    heading: 'Create VPN Client',
+                    content: html `
+              <dees-form>
+                <dees-input-text id="clientId" .label=${'Client ID'} .key=${'clientId'} required></dees-input-text>
+                <dees-input-text id="description" .label=${'Description'} .key=${'description'}></dees-input-text>
+                <dees-input-text id="tags" .label=${'Tags (comma-separated)'} .key=${'tags'}></dees-input-text>
+              </dees-form>
+            `,
+                    menuOptions: [
+                        { name: 'Cancel', action: async (modal) => modal.destroy() },
+                        {
+                            name: 'Create',
+                            action: async (modal) => {
+                                const form = modal.shadowRoot.querySelector('dees-form');
+                                const data = await form.collectFormData();
+                                const serverDefinedClientTags = data.tags ? data.tags.split(',').map((t) => t.trim()).filter(Boolean) : undefined;
+                                await appstate.vpnStatePart.dispatchAction(appstate.createVpnClientAction, {
+                                    clientId: data.clientId,
+                                    description: data.description || undefined,
+                                    serverDefinedClientTags,
+                                });
+                                modal.destroy();
+                            },
+                        },
+                    ],
+                });
+            }}
+      ></dees-table>
+    `;
+        }
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return OpsViewVpn = _classThis;
+})();
+export { OpsViewVpn };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3BzLXZpZXctdnBuLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL29wcy12aWV3LXZwbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQUEsT0FBTyxFQUNMLFdBQVcsRUFDWCxJQUFJLEVBQ0osYUFBYSxFQUViLEdBQUcsRUFDSCxLQUFLLEVBQ0wsVUFBVSxHQUNYLE1BQU0sNkJBQTZCLENBQUM7QUFDckMsT0FBTyxLQUFLLFFBQVEsTUFBTSxnQkFBZ0IsQ0FBQztBQUMzQyxPQUFPLEtBQUssVUFBVSxNQUFNLG1DQUFtQyxDQUFDO0FBQ2hFLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUM5QyxPQUFPLEVBQW1CLE1BQU0sNkJBQTZCLENBQUM7SUFTakQsVUFBVTs0QkFEdEIsYUFBYSxDQUFDLGNBQWMsQ0FBQzs7OztzQkFDRSxXQUFXOzs7OzBCQUFuQixTQUFRLFdBQVc7Ozs7b0NBQ3hDLEtBQUssRUFBRTtZQUNSLDZLQUFTLFFBQVEsNkJBQVIsUUFBUSwyRkFBeUQ7WUFGNUUsNktBZ1RDOzs7O1FBOVNDLDZFQUF3QyxRQUFRLENBQUMsWUFBWSxDQUFDLFFBQVEsRUFBRyxFQUFDO1FBQTFFLElBQVMsUUFBUSw4Q0FBeUQ7UUFBMUUsSUFBUyxRQUFRLG9EQUF5RDtRQUUxRTtZQUNFLEtBQUssRUFBRSxDQUFDOztZQUNSLE1BQU0sR0FBRyxHQUFHLFFBQVEsQ0FBQyxZQUFZLENBQUMsTUFBTSxFQUFFLENBQUMsU0FBUyxDQUFDLENBQUMsUUFBUSxFQUFFLEVBQUU7Z0JBQ2hFLElBQUksQ0FBQyxRQUFRLEdBQUcsUUFBUSxDQUFDO1lBQzNCLENBQUMsQ0FBQyxDQUFDO1lBQ0gsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7U0FDaEM7UUFFRCxLQUFLLENBQUMsaUJBQWlCO1lBQ3JCLE1B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

package/dist_ts_web/elements/shared/css.d.ts

@@ -0,0 +1 @@
+export declare const viewHostCss: import("@design.estate/dees-element").CSSResult;

package/dist_ts_web/elements/shared/css.js

@@ -0,0 +1,10 @@
+import { css } from '@design.estate/dees-element';
+export const viewHostCss = css `
+  :host {
+    display: block;
+    margin: auto;
+    max-width: 1280px;
+    padding: 16px 16px;
+  }
+`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3NzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3NoYXJlZC9jc3MudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLEdBQUcsRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRWxELE1BQU0sQ0FBQyxNQUFNLFdBQVcsR0FBRyxHQUFHLENBQUE7Ozs7Ozs7Q0FPN0IsQ0FBQyJ9

package/dist_ts_web/elements/shared/index.d.ts

@@ -0,0 +1,2 @@
+export * from './css.js';
+export * from './ops-sectionheading.js';

package/dist_ts_web/elements/shared/index.js

@@ -0,0 +1,3 @@
+export * from './css.js';
+export * from './ops-sectionheading.js';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi90c193ZWIvZWxlbWVudHMvc2hhcmVkL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsVUFBVSxDQUFDO0FBQ3pCLGNBQWMseUJBQXlCLENBQUMifQ==

package/dist_ts_web/elements/shared/ops-sectionheading.d.ts

@@ -0,0 +1,5 @@
+import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
+export declare class OpsSectionHeading extends DeesElement {
+    static styles: import("@design.estate/dees-element").CSSResult[];
+    render(): TemplateResult;
+}

package/dist_ts_web/elements/shared/ops-sectionheading.js

@@ -0,0 +1,82 @@
+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, css, cssManager, customElement, html } from '@design.estate/dees-element';
+let OpsSectionHeading = (() => {
+    let _classDecorators = [customElement('ops-sectionheading')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = DeesElement;
+    var OpsSectionHeading = 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);
+            OpsSectionHeading = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static styles = [
+            cssManager.defaultStyles,
+            css `
+      :host {
+        display: block;
+        margin-bottom: 24px;
+      }
+
+      .heading {
+        font-family: 'Cal Sans', 'Inter', sans-serif;
+        font-size: 28px;
+        font-weight: 600;
+        color: ${cssManager.bdTheme('#111', '#fff')};
+        margin: 0;
+        padding: 0;
+      }
+    `,
+        ];
+        render() {
+            return html `
+      <h1 class="heading">
+        <slot></slot>
+      </h1>
+    `;
+        }
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return OpsSectionHeading = _classThis;
+})();
+export { OpsSectionHeading };
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3BzLXNlY3Rpb25oZWFkaW5nLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vdHNfd2ViL2VsZW1lbnRzL3NoYXJlZC9vcHMtc2VjdGlvbmhlYWRpbmcudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLE9BQU8sRUFDTCxXQUFXLEVBQ1gsR0FBRyxFQUNILFVBQVUsRUFDVixhQUFhLEVBQ2IsSUFBSSxFQUVMLE1BQU0sNkJBQTZCLENBQUM7SUFHeEIsaUJBQWlCOzRCQUQ3QixhQUFhLENBQUMsb0JBQW9CLENBQUM7Ozs7c0JBQ0csV0FBVztpQ0FBbkIsU0FBUSxXQUFXOzs7O1lBQWxELDZLQTJCQzs7OztRQTFCUSxNQUFNLENBQUMsTUFBTSxHQUFHO1lBQ3JCLFVBQVUsQ0FBQyxhQUFhO1lBQ3hCLEdBQUcsQ0FBQTs7Ozs7Ozs7OztpQkFVVSxVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7S0FJOUM7U0FDRixDQUFDO1FBRUssTUFBTTtZQUNYLE9BQU8sSUFBSSxDQUFBOzs7O0tBSVYsQ0FBQztRQUNKLENBQUM7O1lBMUJVLHVEQUFpQjs7Ozs7U0FBakIsaUJBQWlCIn0=

package/dist_ts_web/index.d.ts

@@ -0,0 +1 @@
+import './elements/index.js';

package/dist_ts_web/index.js

@@ -0,0 +1,10 @@
+import * as plugins from './plugins.js';
+import { html } from '@design.estate/dees-element';
+import './elements/index.js';
+import { appRouter } from './router.js';
+// Initialize router before rendering
+appRouter.init();
+plugins.deesElement.render(html `
+  <ops-dashboard></ops-dashboard>
+`, document.body);
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi90c193ZWIvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE9BQU8sTUFBTSxjQUFjLENBQUM7QUFFeEMsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRW5ELE9BQU8scUJBQXFCLENBQUM7QUFDN0IsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUV4QyxxQ0FBcUM7QUFDckMsU0FBUyxDQUFDLElBQUksRUFBRSxDQUFDO0FBRWpCLE9BQU8sQ0FBQyxXQUFXLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQTs7Q0FFOUIsRUFBRSxRQUFRLENBQUMsSUFBSSxDQUFDLENBQUMifQ==

package/dist_ts_web/plugins.d.ts

@@ -0,0 +1,6 @@
+import * as deesElement from '@design.estate/dees-element';
+import * as deesCatalog from '@design.estate/dees-catalog';
+import * as szCatalog from '@serve.zone/catalog';
+import * as typedsocket from '@api.global/typedsocket';
+export { deesElement, deesCatalog, szCatalog, typedsocket, };
+export declare const domtools: typeof deesElement.domtools;

package/dist_ts_web/plugins.js

@@ -0,0 +1,11 @@
+// @design.estate scope
+import * as deesElement from '@design.estate/dees-element';
+import * as deesCatalog from '@design.estate/dees-catalog';
+// @serve.zone scope
+import * as szCatalog from '@serve.zone/catalog';
+// TypedSocket for real-time push communication
+import * as typedsocket from '@api.global/typedsocket';
+export { deesElement, deesCatalog, szCatalog, typedsocket, };
+// domtools gives us TypedRequest and other utilities
+export const domtools = deesElement.domtools;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGx1Z2lucy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uL3RzX3dlYi9wbHVnaW5zLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHVCQUF1QjtBQUN2QixPQUFPLEtBQUssV0FBVyxNQUFNLDZCQUE2QixDQUFDO0FBQzNELE9BQU8sS0FBSyxXQUFXLE1BQU0sNkJBQTZCLENBQUM7QUFFM0Qsb0JBQW9CO0FBQ3BCLE9BQU8sS0FBSyxTQUFTLE1BQU0scUJBQXFCLENBQUM7QUFFakQsK0NBQStDO0FBQy9DLE9BQU8sS0FBSyxXQUFXLE1BQU0seUJBQXlCLENBQUM7QUFFdkQsT0FBTyxFQUNMLFdBQVcsRUFDWCxXQUFXLEVBQ1gsU0FBUyxFQUNULFdBQVcsR0FDWixDQUFBO0FBRUQscURBQXFEO0FBQ3JELE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxXQUFXLENBQUMsUUFBUSxDQUFDIn0=

package/dist_ts_web/router.d.ts

@@ -0,0 +1,19 @@
+export declare const validViews: readonly ["overview", "network", "emails", "logs", "routes", "apitokens", "configuration", "security", "certificates", "remoteingress", "vpn"];
+export type TValidView = typeof validViews[number];
+declare class AppRouter {
+    private router;
+    private initialized;
+    private suppressStateUpdate;
+    constructor();
+    init(): void;
+    private setupRoutes;
+    private setupStateSync;
+    private handleInitialRoute;
+    private updateViewState;
+    navigateTo(path: string): void;
+    navigateToView(view: string): void;
+    getCurrentView(): string;
+    destroy(): void;
+}
+export declare const appRouter: AppRouter;
+export {};

package/dist_ts_web/router.js

@@ -0,0 +1,91 @@
+import * as plugins from './plugins.js';
+import * as appstate from './appstate.js';
+const SmartRouter = plugins.domtools.plugins.smartrouter.SmartRouter;
+export const validViews = ['overview', 'network', 'emails', 'logs', 'routes', 'apitokens', 'configuration', 'security', 'certificates', 'remoteingress', 'vpn'];
+class AppRouter {
+    router;
+    initialized = false;
+    suppressStateUpdate = false;
+    constructor() {
+        this.router = new SmartRouter({ debug: false });
+    }
+    init() {
+        if (this.initialized)
+            return;
+        this.setupRoutes();
+        this.setupStateSync();
+        this.handleInitialRoute();
+        this.initialized = true;
+    }
+    setupRoutes() {
+        for (const view of validViews) {
+            this.router.on(`/${view}`, async () => {
+                this.updateViewState(view);
+            });
+        }
+        // Root redirect
+        this.router.on('/', async () => {
+            this.navigateTo('/overview');
+        });
+    }
+    setupStateSync() {
+        appstate.uiStatePart.select().subscribe((uiState) => {
+            if (this.suppressStateUpdate)
+                return;
+            const currentPath = window.location.pathname;
+            const expectedPath = `/${uiState.activeView}`;
+            if (currentPath !== expectedPath) {
+                this.suppressStateUpdate = true;
+                this.router.pushUrl(expectedPath);
+                this.suppressStateUpdate = false;
+            }
+        });
+    }
+    handleInitialRoute() {
+        const path = window.location.pathname;
+        if (!path || path === '/') {
+            this.router.pushUrl('/overview');
+        }
+        else {
+            const segments = path.split('/').filter(Boolean);
+            const view = segments[0];
+            if (validViews.includes(view)) {
+                this.updateViewState(view);
+            }
+            else {
+                this.router.pushUrl('/overview');
+            }
+        }
+    }
+    updateViewState(view) {
+        this.suppressStateUpdate = true;
+        const currentState = appstate.uiStatePart.getState();
+        if (currentState.activeView !== view) {
+            appstate.uiStatePart.setState({
+                ...currentState,
+                activeView: view,
+            });
+        }
+        this.suppressStateUpdate = false;
+    }
+    navigateTo(path) {
+        this.router.pushUrl(path);
+    }
+    navigateToView(view) {
+        if (validViews.includes(view)) {
+            this.navigateTo(`/${view}`);
+        }
+        else {
+            this.navigateTo('/overview');
+        }
+    }
+    getCurrentView() {
+        return appstate.uiStatePart.getState().activeView;
+    }
+    destroy() {
+        this.router.destroy();
+        this.initialized = false;
+    }
+}
+export const appRouter = new AppRouter();
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicm91dGVyLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vdHNfd2ViL3JvdXRlci50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssT0FBTyxNQUFNLGNBQWMsQ0FBQztBQUN4QyxPQUFPLEtBQUssUUFBUSxNQUFNLGVBQWUsQ0FBQztBQUUxQyxNQUFNLFdBQVcsR0FBRyxPQUFPLENBQUMsUUFBUSxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUMsV0FBVyxDQUFDO0FBRXJFLE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBRyxDQUFDLFVBQVUsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxRQUFRLEVBQUUsV0FBVyxFQUFFLGVBQWUsRUFBRSxVQUFVLEVBQUUsY0FBYyxFQUFFLGVBQWUsRUFBRSxLQUFLLENBQVUsQ0FBQztBQUl6SyxNQUFNLFNBQVM7SUFDTCxNQUFNLENBQW1DO0lBQ3pDLFdBQVcsR0FBRyxLQUFLLENBQUM7SUFDcEIsbUJBQW1CLEdBQUcsS0FBSyxDQUFDO0lBRXBDO1FBQ0UsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLFdBQVcsQ0FBQyxFQUFFLEtBQUssRUFBRSxLQUFLLEVBQUUsQ0FBQyxDQUFDO0lBQ2xELENBQUM7SUFFTSxJQUFJO1FBQ1QsSUFBSSxJQUFJLENBQUMsV0FBVztZQUFFLE9BQU87UUFDN0IsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ25CLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN0QixJQUFJLENBQUMsa0JBQWtCLEVBQUUsQ0FBQztRQUMxQixJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQztJQUMxQixDQUFDO0lBRU8sV0FBVztRQUNqQixLQUFLLE1BQU0sSUFBSSxJQUFJLFVBQVUsRUFBRSxDQUFDO1lBQzlCLElBQUksQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDLElBQUksSUFBSSxFQUFFLEVBQUUsS0FBSyxJQUFJLEVBQUU7Z0JBQ3BDLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDN0IsQ0FBQyxDQUFDLENBQUM7UUFDTCxDQUFDO1FBRUQsZ0JBQWdCO1FBQ2hCLElBQUksQ0FBQyxNQUFNLENBQUMsRUFBRSxDQUFDLEdBQUcsRUFBRSxLQUFLLElBQUksRUFBRTtZQUM3QixJQUFJLENBQUMsVUFBVSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQy9CLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLGNBQWM7UUFDcEIsUUFBUSxDQUFDLFdBQVcsQ0FBQyxNQUFNLEVBQUUsQ0FBQyxTQUFTLENBQUMsQ0FBQyxPQUFPLEVBQUUsRUFBRTtZQUNsRCxJQUFJLElBQUksQ0FBQyxtQkFBbUI7Z0JBQUUsT0FBTztZQUVyQyxNQUFNLFdBQVcsR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQztZQUM3QyxNQUFNLFlBQVksR0FBRyxJQUFJLE9BQU8sQ0FBQyxVQUFVLEVBQUUsQ0FBQztZQUU5QyxJQUFJLFdBQVcsS0FBSyxZQUFZLEVBQUUsQ0FBQztnQkFDakMsSUFBSSxDQUFDLG1CQUFtQixHQUFHLElBQUksQ0FBQztnQkFDaEMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPLENBQUMsWUFBWSxDQUFDLENBQUM7Z0JBQ2xDLElBQUksQ0FBQyxtQkFBbUIsR0FBRyxLQUFLLENBQUM7WUFDbkMsQ0FBQztRQUNILENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLGtCQUFrQjtRQUN4QixNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQztRQUV0QyxJQUFJLENBQUMsSUFBSSxJQUFJLElBQUksS0FBSyxHQUFHLEVBQUUsQ0FBQztZQUMxQixJQUFJLENBQUMsTUFBTSxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUNuQyxDQUFDO2FBQU0sQ0FBQztZQUNOLE1BQU0sUUFBUSxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLENBQUMsTUFBTSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1lBQ2pELE1BQU0sSUFBSSxHQUFHLFFBQVEsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUV6QixJQUFJLFVBQVUsQ0FBQyxRQUFRLENBQUMsSUFBa0IsQ0FBQyxFQUFFLENBQUM7Z0JBQzVDLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBa0IsQ0FBQyxDQUFDO1lBQzNDLENBQUM7aUJBQU0sQ0FBQztnQkFDTixJQUFJLENBQUMsTUFBTSxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUMsQ0FBQztZQUNuQyxDQUFDO1FBQ0gsQ0FBQztJQUNILENBQUM7SUFFTyxlQUFlLENBQUMsSUFBWTtRQUNsQyxJQUFJLENBQUMsbUJBQW1CLEdBQUcsSUFBSSxDQUFDO1FBQ2hDLE1BQU0sWUFBWSxHQUFHLFFBQVEsQ0FBQyxXQUFXLENBQUMsUUFBUSxFQUFHLENBQUM7UUFDdEQsSUFBSSxZQUFZLENBQUMsVUFBVSxLQUFLLElBQUksRUFBRSxDQUFDO1lBQ3JDLFFBQVEsQ0FBQyxXQUFXLENBQUMsUUFBUSxDQUFDO2dCQUM1QixHQUFHLFlBQVk7Z0JBQ2YsVUFBVSxFQUFFLElBQUk7YUFDSSxDQUFDLENBQUM7UUFDMUIsQ0FBQztRQUNELElBQUksQ0FBQyxtQkFBbUIsR0FBRyxLQUFLLENBQUM7SUFDbkMsQ0FBQztJQUVNLFVBQVUsQ0FBQyxJQUFZO1FBQzVCLElBQUksQ0FBQyxNQUFNLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzVCLENBQUM7SUFFTSxjQUFjLENBQUMsSUFBWTtRQUNoQyxJQUFJLFVBQVUsQ0FBQyxRQUFRLENBQUMsSUFBa0IsQ0FBQyxFQUFFLENBQUM7WUFDNUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxJQUFJLElBQUksRUFBRSxDQUFDLENBQUM7UUFDOUIsQ0FBQzthQUFNLENBQUM7WUFDTixJQUFJLENBQUMsVUFBVSxDQUFDLFdBQVcsQ0FBQyxDQUFDO1FBQy9CLENBQUM7SUFDSCxDQUFDO0lBRU0sY0FBYztRQUNuQixPQUFPLFFBQVEsQ0FBQyxXQUFXLENBQUMsUUFBUSxFQUFHLENBQUMsVUFBVSxDQUFDO0lBQ3JELENBQUM7SUFFTSxPQUFPO1FBQ1osSUFBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPLEVBQUUsQ0FBQztRQUN0QixJQUFJLENBQUMsV0FBVyxHQUFHLEtBQUssQ0FBQztJQUMzQixDQUFDO0NBQ0Y7QUFFRCxNQUFNLENBQUMsTUFBTSxTQUFTLEdBQUcsSUFBSSxTQUFTLEVBQUUsQ0FBQyJ9