<script type="module">import e from"../components/env-picker.ok.js";import n from"../sections/db/modals/create-env-modal.ok.js";import o from"../sections/db/modals/demo-env-modal.ok.js";import s from"../stores/events-store.js";export default{tag:"default-layout",unwrap:!0,dependencies:[e,n,o],context:e=>({noticesExpanded:!1,dismissNotices(n){n&&(n.stopPropagation(),n.preventDefault()),e.$ok.stores.auth.dismissNotices()},hasEnvOption:n=>!!n&&(e.$ok.stores.okdb.envs||[]).some(e=>e?.name===n),syncEnvSearch(n){const o=e.$vars.$router;if(!o)return;const s=n??null;if((o._search?.env??null)===s)return;const t={...o._search||{}};s?t.env=s:delete t.env,o.replace(o.resolve(o._path||"",t,o._anchor||""))},applyEnvFromSearch(){const n=e.$vars.$router,o=n?._search?.env??null;return!(!o||!this.hasEnvOption(o)||(e.$ok.stores.okdb.selectedEnv!==o&&e.$ok.stores.okdb.selectEnv(o),0))},goToSection(n){const o=e.$vars.$router;if(!o)return;const s={},t=e.$ok.stores.okdb.selectedEnv;t&&(s.env=t);const r="system"===n?"/system/overview":`/${n}`;o.push(o.resolve(r,s))},async switchEnv(n){e.$ok.stores.okdb.selectEnv(n),e.$ok.shared?.toast?.info?.(`Environment: ${n}`)},async openCreateEnvModal(){await e.$ok.shared.modal.open({owner:e,title:"Create Environment",content:'<create-env-modal :modal="modal" :on-done="onDone" />',context:n=>({modal:n,onDone:async n=>{await e.$ok.stores.okdb.reloadEnvs(),e.$ok.stores.okdb.selectEnv(n),e.$ok.shared?.toast?.success?.(`Environment created: ${n}`)}})})},async openDemoModal(){await e.$ok.shared.modal.open({owner:e,title:'<span style="background:linear-gradient(135deg,#4FC1FF,#c084fc 50%,#4ade80);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700;font-size:15px;">✦ Demo Environment</span>',canDrag:!0,content:'<demo-env-modal :modal="modal" :on-done="onDone" />',context:n=>({modal:n,onDone:async n=>{await e.$ok.stores.okdb.reloadEnvs(),e.$ok.stores.okdb.selectEnv(n),e.$ok.shared?.toast?.success?.(`Demo environment "${n}" ready`)}})})}}),init(e){const n=()=>e.$ok.shared?.toast;e.$cache._unsubs=[s.on("type:registered",e=>n()?.info?.(`Type registered: ${e?.type??""}`)),s.on("type:drop",e=>n()?.info?.(`Type dropped: ${e?.type??""}`)),s.on("index:registered",e=>n()?.info?.(`Index registered on ${e?.type??""}: ${e?.key??""}`)),s.on("index:drop",e=>n()?.info?.(`Index dropped on ${e?.type??""}: ${e?.key??""}`)),s.on("fts:registered",e=>n()?.info?.(`FTS index created on ${e?.type??""}: ${e?.key??""}`)),s.on("fts:drop",e=>n()?.info?.(`FTS index dropped on ${e?.type??""}: ${e?.key??""}`)),s.on("env:opened",e=>n()?.info?.(`Environment ready: ${e?.name??""}`)),s.on("env:removed",e=>n()?.info?.(`Environment removed: ${e?.name??""}`)),s.on("engine:started",e=>n()?.success?.(`Engine started: ${e?.name??""}`)),s.on("engine:stopped",e=>n()?.info?.(`Engine stopped: ${e?.name??""}`)),s.on("engine:error",e=>n()?.error?.(`Engine error: ${e?.name??""}: ${e?.error??""}`)),s.on("engine:installed",e=>n()?.success?.(`Engine installed: ${e?.name??""}`)),s.on("engine:uninstalled",e=>n()?.info?.(`Engine uninstalled: ${e?.name??""}`)),s.on("embeddings:pipeline:ready",e=>n()?.success?.(`Pipeline ready: ${e?.name??""}`)),s.on("embeddings:indexer:flushed",e=>n()?.success?.(`Embeddings flushed: ${e?.name??""}`))],e.$ext("unmount",()=>{for(const n of e.$cache._unsubs||[])n();e.$cache._unsubs=[]}),this.applyEnvFromSearch()||this.syncEnvSearch(e.$ok.stores.okdb.selectedEnv??null),e.$watch(()=>e.$vars.$router?._search?.env,()=>{const n=e.$vars.$router?._search?.env??null;n&&this.hasEnvOption(n)?e.$ok.stores.okdb.selectedEnv!==n&&e.$ok.stores.okdb.selectEnv(n):this.syncEnvSearch(e.$ok.stores.okdb.selectedEnv??null)}),e.$watch(()=>e.$ok.stores.okdb.selectedEnv,()=>this.syncEnvSearch(e.$ok.stores.okdb.selectedEnv??null))}};</script><template><div class="layout"><aside class="layout__sidebar"><div class="layout__sidebar-cube"><component import="./okdb-cube.ok.html"></component><span class="layout__version">v{{ $ok.stores.okdb.info?.version ?? '…' }}</span></div><div class="layout__env-picker"><env-picker :selected="$ok.stores.okdb.selectedEnv" :envs="$ok.stores.okdb.envs || []" @change="switchEnv($event.detail)" @create="openCreateEnvModal()"/></div><div class="layout__sidebar-body"><if :="$ok.stores.okdb.selectedEnv"><slot name="sidebar"></slot></if></div><div class="layout__sidebar-footer"><div class="layout__auth-chip layout__auth-chip--sidebar" :title="$ok.stores.auth?.modeLabel || 'Authentication'"><div class="layout__auth-meta"><div class="layout__auth-userblock"><div class="layout__auth-user">{{ $ok.stores.auth?.username || 'anonymous' }}</div><if :="$ok.stores.auth?.rolesLabel"><div class="layout__auth-roles">{{ $ok.stores.auth.rolesLabel }}</div></if></div></div><if :="!$ok.stores.auth?.openAccess"><button class="layout__auth-logout" @click="$ok.stores.auth.logout()">Logout</button></if></div></div></aside><div class="layout__right-col"><nav class="layout__section-nav"><button :class="{ active: $route.params.section === 'db' }" :disabled="!$ok.stores.auth.canSection('db')" :title="$ok.stores.auth.canSection('db') ? '' : 'Requires data:read or env:read permission'" @click="$ok.stores.auth.canSection('db') && goToSection('db')"><span class="layout__nav-icon">⬡</span> DB<if :="!$ok.stores.auth.canSection('db')"><span class="layout__nav-lock">🔒</span></if></button> <button :class="{ active: $route.params.section === 'engines' || $route.params.section === 'embeddings' }" :disabled="!$ok.stores.auth.canSection('engines')" :title="$ok.stores.auth.canSection('engines') ? '' : 'Requires env:read permission'" @click="$ok.stores.auth.canSection('engines') && goToSection('engines')"><span class="layout__nav-icon">⛓</span> Engines<if :="!$ok.stores.auth.canSection('engines')"><span class="layout__nav-lock">🔒</span></if></button> <button :class="{ active: $route.params.section === 'files' }" :disabled="!$ok.stores.auth.canSection('files')" :title="$ok.stores.auth.canSection('files') ? '' : 'Requires files:read permission'" @click="$ok.stores.auth.canSection('files') && goToSection('files')"><span class="layout__nav-icon">⬚</span> Files<if :="!$ok.stores.auth.canSection('files')"><span class="layout__nav-lock">🔒</span></if></button> <button :class="{ active: $route.params.section === 'queue' }" :disabled="!$ok.stores.auth.canSection('queue')" :title="$ok.stores.auth.canSection('queue') ? '' : 'Requires queue:read permission'" @click="$ok.stores.auth.canSection('queue') && goToSection('queue')"><span class="layout__nav-icon">⇶</span> Queue<if :="!$ok.stores.auth.canSection('queue')"><span class="layout__nav-lock">🔒</span></if></button> <button :class="{ active: $route.params.section === 'functions' }" :disabled="!$ok.stores.auth.canSection('functions')" :title="$ok.stores.auth.canSection('functions') ? '' : 'Requires functions:read permission'" @click="$ok.stores.auth.canSection('functions') && goToSection('functions')"><span class="layout__nav-icon">ƒ</span> Functions<if :="!$ok.stores.auth.canSection('functions')"><span class="layout__nav-lock">🔒</span></if></button> <button :class="{ active: $route.params.section === 'views' }" @click="goToSection('views')"><span class="layout__nav-icon">⊞</span> Views</button> <button :class="{ active: $route.params.section === 'system' }" :disabled="!$ok.stores.auth.canSection('system')" :title="$ok.stores.auth.canSection('system') ? '' : 'Requires system:read permission'" @click="$ok.stores.auth.canSection('system') && goToSection('system')"><span class="layout__nav-icon">⚙</span> System<if :="!$ok.stores.auth.canSection('system')"><span class="layout__nav-lock">🔒</span></if></button><div class="layout__live-indicator" :title="$ok.stores.events?.connected ? 'Event stream live' : 'Event stream disconnected'"><span :class="$ok.stores.events?.connected ? 'layout__live-dot layout__live-dot--on' : 'layout__live-dot layout__live-dot--off'"></span> <span class="layout__live-label">{{ $ok.stores.events?.connected ? 'Live' : 'Off' }}</span></div><div class="layout__security-pill" :title="($ok.stores.auth?.modeLabel || 'Authentication') + ' · ' + ($ok.stores.auth?.username || 'anonymous')"><span class="layout__security-dot" :class="$ok.stores.auth?.openAccess ? 'layout__security-dot layout__security-dot--open' : 'layout__security-dot layout__security-dot--secure'"></span> <span class="layout__security-label">{{ $ok.stores.auth?.openAccess ? 'Open access' : 'Secure' }}</span></div></nav><div class="layout__main"><if :="$ok.stores.auth?.visibleNotices?.length > 0"><div class="layout__notices"><div class="layout__notices-bar" @click="noticesExpanded = !noticesExpanded"><span class="layout__notices-icon">⚠</span> <span class="layout__notices-summary">{{ $ok.stores.auth.visibleNotices.length }} security notice{{ $ok.stores.auth.visibleNotices.length > 1 ? 's' : '' }}<if :="$ok.stores.auth.visibleNotices[0]">· {{ $ok.stores.auth.visibleNotices[0].title }}<if :="$ok.stores.auth.visibleNotices.length > 1">and {{ $ok.stores.auth.visibleNotices.length - 1 }} more</if></if></span><span class="layout__notices-chevron">{{ noticesExpanded ? '▴' : '▾' }}</span> <button class="layout__notices-dismiss" @click="dismissNotices($event)" title="Dismiss for this session">✕</button></div><if :="noticesExpanded"><div class="layout__notices-detail"><each :of="$ok.stores.auth.visibleNotices" let:item="n"><div class="layout__notice-item"><div class="layout__notice-title">{{ n.title }}</div><div class="layout__notice-msg">{{ n.message }}</div><if :="n.hint"><div class="layout__notice-hint">{{ n.hint }}</div></if><if :="n.action"><a class="layout__notice-action" :href="n.action.href">{{ n.action.label }} →</a></if></div></each></div></if></div></if><header class="layout__header"><slot name="header"></slot></header><main class="layout__content"><if :="$ok.stores.okdb.selectedEnv"><slot></slot></if><if :="!$ok.stores.okdb.selectedEnv"><div class="layout__no-env"><div class="layout__no-env-icon">⬡</div><div class="layout__no-env-title">No environment selected</div><div class="layout__no-env-sub">Create a new environment or load the demo to get started.</div><div class="layout__no-env-actions"><button @click="openCreateEnvModal()" class="layout__no-env-btn">+ Create environment</button> <button @click="openDemoModal()" class="layout__no-env-btn layout__no-env-btn--demo">✦ Load demo</button></div></div></if></main></div></div></div></template><style>.layout{display:flex;flex-direction:row;height:100%;width:100%;min-height:0}.layout__sidebar{display:flex;flex-direction:column;width:210px;flex-shrink:0;border-right:1px solid var(--okdb-app-surface-2);background:var(--okdb-app-bg-deep);overflow:visible}.layout__sidebar-cube{height:150px;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative}.layout__version{position:absolute;bottom:8px;right:10px;font-size:10px;font-family:monospace;color:var(--okdb-app-fg-faint);letter-spacing:.04em;pointer-events:none;user-select:none;transition:color .2s}.layout__sidebar-cube:hover .layout__version{color:var(--okdb-app-fg-subtle)}.layout__env-picker{flex-shrink:0;padding:8px 10px 6px;border-top:1px solid var(--okdb-app-surface-2);border-bottom:1px solid var(--okdb-app-surface-2)}.layout__sidebar-body{flex:1;min-height:0;display:flex;flex-direction:column;gap:3px;padding:10px;border-top:1px solid var(--okdb-app-surface-2);overflow-y:auto;overflow-x:visible}.layout__sidebar-footer{flex-shrink:0;padding:8px 10px 10px;border-top:1px solid var(--okdb-app-surface-2);background:var(--okdb-app-bg-deep)}.layout__right-col{flex:1;min-width:0;display:flex;flex-direction:column;min-height:0}.layout__section-nav{display:flex;flex-direction:row;align-items:flex-end;height:150px;padding:0 8px;flex-shrink:0;background:var(--okdb-app-bg-deep);border-bottom:1px solid var(--okdb-app-surface-2)}.layout__section-nav button{display:flex;align-items:center;gap:7px;padding:0 16px;height:44px;border-radius:0;font-size:13px;font-weight:500;background:0 0;border:none;border-bottom:2px solid transparent;color:var(--okdb-app-fg-subtle);cursor:pointer;white-space:nowrap;letter-spacing:.01em;transition:color .15s,border-color .15s,background .15s;margin-bottom:-1px}.layout__section-nav button:hover{background:rgba(255,255,255,.03);border-color:transparent;color:var(--okdb-app-fg-muted);border-bottom-color:var(--okdb-app-border-subtle);transform:none;box-shadow:none}.layout__section-nav button:disabled{opacity:.35;cursor:not-allowed;background:0 0!important;border-color:transparent!important;border-bottom-color:transparent!important;color:var(--okdb-app-fg-faint)!important}.layout__section-nav button:disabled:hover{background:0 0;transform:none;box-shadow:none}.layout__section-nav button.active{background:0 0;border-color:transparent;color:var(--okdb-accent);border-bottom-color:var(--okdb-accent)}.layout__nav-icon{font-size:14px;opacity:.7;flex-shrink:0}.layout__nav-lock{font-size:10px;margin-left:4px;opacity:.7;flex-shrink:0;vertical-align:middle}.layout__section-nav button:hover .layout__nav-icon{opacity:.9}.layout__section-nav button.active .layout__nav-icon{opacity:1}.layout__live-indicator{margin-left:auto;margin-right:8px;margin-bottom:11px;display:flex;align-items:center;gap:5px;cursor:default}.layout__live-dot{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0}.layout__live-dot--on{background:var(--okdb-success);box-shadow:0 0 5px color-mix(in srgb,var(--okdb-success) 40%,transparent);animation:nav-pulse 2.5s ease-in-out infinite}.layout__live-dot--off{background:var(--okdb-danger);opacity:.6}.layout__live-label{font-size:10px;color:var(--okdb-app-fg-faint);letter-spacing:.04em;text-transform:uppercase}@keyframes nav-pulse{0%,100%{opacity:1}50%{opacity:.35}}.layout__security-pill{margin-bottom:9px;display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;border:1px solid var(--okdb-app-border);background:var(--okdb-app-bg);color:var(--okdb-app-fg-muted)}.layout__security-dot{width:7px;height:7px;border-radius:50%;display:inline-block;flex-shrink:0}.layout__security-dot--secure{background:var(--okdb-accent);box-shadow:0 0 6px var(--okdb-accent-soft-border)}.layout__security-dot--open{background:var(--okdb-warning);box-shadow:0 0 6px color-mix(in srgb,var(--okdb-warning) 33%,transparent)}.layout__security-label{font-size:10px;line-height:1;text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}.layout__auth-chip{margin-bottom:9px;display:inline-flex;align-items:center;gap:10px;padding:6px 10px;border-radius:10px;border:1px solid var(--okdb-app-border);background:var(--okdb-app-bg)}.layout__auth-chip--sidebar{width:100%;margin-bottom:0;align-items:center;justify-content:space-between;gap:12px;padding:0;border-radius:0;background:0 0;border:none;box-shadow:none}.layout__auth-meta{display:flex;align-items:center;gap:0;min-width:0;flex:1}.layout__auth-userblock{display:flex;flex-direction:column;min-width:0}.layout__auth-badge{font-size:10px;line-height:1;text-transform:uppercase;letter-spacing:.05em;padding:4px 7px;border-radius:999px;border:1px solid transparent;white-space:nowrap}.layout__auth-badge--open{color:var(--okdb-success);background:#4ade8011;border-color:#4ade8033}.layout__auth-badge--users{color:var(--okdb-accent);background:#4fc1FF11;border-color:#4fc1FF33}.layout__auth-user{font-size:11px;font-weight:600;color:var(--okdb-app-fg);line-height:1.1;text-transform:uppercase;letter-spacing:.05em}.layout__auth-roles{font-size:10px;color:var(--okdb-app-fg-muted);line-height:1.1;margin-top:2px;max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layout__auth-logout{font-size:11px;padding:0;border-radius:0;border:none;background:0 0;color:var(--okdb-danger);cursor:pointer;white-space:nowrap;align-self:center;letter-spacing:.04em;text-transform:uppercase;opacity:.88}.layout__auth-logout:hover{background:0 0;color:var(--okdb-danger-hover);opacity:1;transform:none;box-shadow:none}.layout__main{flex:1;display:flex;flex-direction:column;min-height:0;overflow:auto;padding:20px 24px 6px}.layout__header{flex-shrink:0}.layout__content{flex:1;min-height:0;min-width:0}.layout__content>*{animation:layout-fade-in .2s ease backwards}.layout__sidebar-body>*{animation:layout-fade-in .18s ease backwards}@keyframes layout-fade-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.layout__no-env{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:12px;animation:layout-fade-in .25s ease backwards}.layout__no-env-icon{font-size:48px;opacity:.12;line-height:1;margin-bottom:4px}.layout__no-env-title{font-size:18px;font-weight:600;color:var(--okdb-app-fg-muted)}.layout__no-env-sub{font-size:13px;color:var(--okdb-app-fg-subtle);text-align:center;max-width:320px;line-height:1.6}.layout__no-env-actions{display:flex;gap:10px;margin-top:8px}.layout__no-env-btn{padding:8px 18px;font-size:13px;border-radius:7px;border:1px solid var(--okdb-app-border);background:var(--okdb-app-surface);color:var(--okdb-app-fg-subtle);cursor:pointer;transition:background .12s,border-color .12s,color .12s}.layout__no-env-btn:hover{background:var(--okdb-app-surface-2);border-color:var(--okdb-app-border-strong);color:var(--okdb-app-fg-muted);transform:none;box-shadow:none}.layout__no-env-btn--demo{border-color:var(--okdb-accent-2-soft-border);background:var(--okdb-accent-2-soft-bg);color:var(--okdb-accent-2)}.layout__no-env-btn--demo:hover{background:var(--okdb-accent-2-soft-bg);border-color:var(--okdb-accent-2-soft-border);color:var(--okdb-accent-2);transform:none;box-shadow:none}.layout__notices{flex-shrink:0;margin:-20px -24px 16px;border-bottom:1px solid color-mix(in srgb,var(--okdb-warning) 22%,transparent);background:color-mix(in srgb,var(--okdb-warning) 5%,transparent)}.layout__notices-bar{display:flex;align-items:center;gap:10px;padding:9px 16px;cursor:pointer;user-select:none;transition:background .12s}.layout__notices-bar:hover{background:color-mix(in srgb,var(--okdb-warning) 9%,transparent)}.layout__notices-icon{font-size:15px;color:var(--okdb-warning);flex-shrink:0}.layout__notices-summary{font-size:12px;color:var(--okdb-warning-text);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layout__notices-chevron{font-size:14px;color:var(--okdb-warning-text);flex-shrink:0;line-height:1}.layout__notices-dismiss{font-size:14px;color:var(--okdb-warning-text);background:0 0;border:none;cursor:pointer;padding:3px 7px;border-radius:4px;flex-shrink:0;line-height:1;transition:color .1s,background .1s}.layout__notices-dismiss:hover{color:var(--okdb-warning);background:color-mix(in srgb,var(--okdb-warning) 15%,transparent)}.layout__notices-detail{padding:0 16px 14px;display:flex;flex-direction:column;gap:10px}.layout__notice-item{padding:12px 14px;border:1px solid color-mix(in srgb,var(--okdb-warning) 20%,transparent);border-radius:6px;background:color-mix(in srgb,var(--okdb-warning) 5%,transparent);display:flex;flex-direction:column;gap:6px}.layout__notice-title{font-size:13px;font-weight:600;color:var(--okdb-warning)}.layout__notice-msg{font-size:12px;color:var(--okdb-warning-text);line-height:1.55}.layout__notice-hint{font-size:12px;color:var(--okdb-warning-text);line-height:1.55;font-style:italic}.layout__notice-action{font-size:12px;color:var(--okdb-accent);text-decoration:none;margin-top:2px;display:inline-block}.layout__notice-action:hover{text-decoration:underline}</style>