@owdproject/core 3.3.1 → 3.4.0

package/runtime/stores/storeDesktop.ts

@@ -1,43 +1,9 @@
 import { defineStore } from 'pinia'
 import { ref } from 'vue'
-
-export type DesktopWindowSurface = 'acrylic' | 'solid'
-
-export type DesktopAppearance = 'dark' | 'light'
-
-export type DesktopPersonalization = {
-  windowSurface: DesktopWindowSurface
-  /** Used when windowSurface is solid (CSS color string). */
-  windowTint: string
-  appearance: DesktopAppearance
-}
-
-export const defaultDesktopPersonalization: DesktopPersonalization = {
-  windowSurface: 'acrylic',
-  windowTint: '#2d2d30',
-  appearance: 'dark',
-}
-
-export function mergePersonalization(
-  raw: Partial<DesktopPersonalization> | undefined | null,
-): DesktopPersonalization {
-  const windowSurface =
-    raw?.windowSurface === 'solid' || raw?.windowSurface === 'acrylic'
-      ? raw.windowSurface
-      : defaultDesktopPersonalization.windowSurface
-  const appearance =
-    raw?.appearance === 'light' || raw?.appearance === 'dark'
-      ? raw.appearance
-      : defaultDesktopPersonalization.appearance
-  const tint =
-    typeof raw?.windowTint === 'string' && raw.windowTint.trim()
-      ? raw.windowTint.trim()
-      : defaultDesktopPersonalization.windowTint
-  return { windowSurface, windowTint: tint, appearance }
-}
+import { DESKTOP_STORE_ID } from './storeIds'
 
 export const useDesktopStore = defineStore(
-  'owd/desktop',
+  DESKTOP_STORE_ID,
   () => {
     const state = ref<{
       workspace: {
@@ -52,7 +18,11 @@ export const useDesktopStore = defineStore(
         positionZ: number
       }
       defaultApps: Record<string, { applicationId: string; entry: string }>
-      personalization: DesktopPersonalization
+      personalization: {
+        windowSurface: 'acrylic' | 'solid'
+        windowTint: string
+        appearance: 'dark' | 'light'
+      }
     }>({
       workspace: {
         overview: false,
@@ -66,33 +36,23 @@ export const useDesktopStore = defineStore(
         positionZ: 0,
       },
       defaultApps: {},
-      personalization: { ...defaultDesktopPersonalization },
+      personalization: {
+        windowSurface: 'acrylic',
+        windowTint: '#2d2d30',
+        appearance: 'dark',
+      },
     })
 
-    function setWindowSurface(value: DesktopWindowSurface) {
-      const base = mergePersonalization(state.value.personalization)
-      state.value.personalization = mergePersonalization({
-        ...base,
-        windowSurface: value,
-      })
+    function setWindowSurface(value: 'acrylic' | 'solid') {
+      state.value.personalization.windowSurface = value
     }
 
     function setWindowTint(value: string) {
-      const v = value.trim()
-      if (!v) return
-      const base = mergePersonalization(state.value.personalization)
-      state.value.personalization = mergePersonalization({
-        ...base,
-        windowTint: v,
-      })
+      state.value.personalization.windowTint = value
     }
 
-    function setAppearance(value: DesktopAppearance) {
-      const base = mergePersonalization(state.value.personalization)
-      state.value.personalization = mergePersonalization({
-        ...base,
-        appearance: value,
-      })
+    function setAppearance(value: 'dark' | 'light') {
+      state.value.personalization.appearance = value
     }
 
     return {

package/runtime/stores/storeDesktopDefaultApps.ts

@@ -1,8 +1,9 @@
 import { defineStore } from 'pinia'
 import { useDesktopStore } from './storeDesktop'
+import { DESKTOP_DEFAULT_APPS_STORE_ID } from './storeIds'
 
 export const useDesktopDefaultAppsStore = defineStore(
-  'owd/desktop/defaultApps',
+  DESKTOP_DEFAULT_APPS_STORE_ID,
   () => {
     const desktopStore = useDesktopStore()
 

package/runtime/stores/storeDesktopVolume.ts

@@ -1,8 +1,9 @@
 import { defineStore } from 'pinia'
 import { computed } from 'vue'
 import { useDesktopStore } from './storeDesktop'
+import { DESKTOP_VOLUME_STORE_ID } from './storeIds'
 
-export const useDesktopVolumeStore = defineStore('owd/desktop/volume', () => {
+export const useDesktopVolumeStore = defineStore(DESKTOP_VOLUME_STORE_ID, () => {
   const desktopStore = useDesktopStore()
 
   const master = computed(() => desktopStore.state.volume.master)

package/runtime/stores/storeDesktopWindow.ts

@@ -1,9 +1,21 @@
+import type { DesktopWorkAreaRect } from '@owdproject/core'
 import { defineStore } from 'pinia'
-import { computed } from 'vue'
+import { computed, readonly, shallowRef } from 'vue'
 import { useDesktopStore } from './storeDesktop'
+import { DESKTOP_WINDOW_STORE_ID } from './storeIds'
 
-export const useDesktopWindowStore = defineStore('owd/desktop/window', () => {
+export const EMPTY_DESKTOP_WORK_AREA: DesktopWorkAreaRect = {
+  x: 0,
+  y: 0,
+  width: 0,
+  height: 0,
+}
+
+export const useDesktopWindowStore = defineStore(DESKTOP_WINDOW_STORE_ID, () => {
   const desktopStore = useDesktopStore()
+  const workArea = shallowRef<DesktopWorkAreaRect>({
+    ...EMPTY_DESKTOP_WORK_AREA,
+  })
 
   const positionZ = computed(() => desktopStore.state.window.positionZ)
 
@@ -13,8 +25,14 @@ export const useDesktopWindowStore = defineStore('owd/desktop/window', () => {
     return desktopStore.state.window.positionZ
   }
 
+  function setWorkArea(rect: DesktopWorkAreaRect) {
+    workArea.value = { ...rect }
+  }
+
   return {
     positionZ,
     incrementPositionZ,
+    workArea: readonly(workArea),
+    setWorkArea,
   }
 })

package/runtime/stores/storeDesktopWorkspace.ts

@@ -1,10 +1,11 @@
 import { defineStore } from 'pinia'
 import { computed } from 'vue'
 import { useDesktopStore } from './storeDesktop'
+import { DESKTOP_WORKSPACE_STORE_ID } from './storeIds'
 import { nanoid } from 'nanoid'
 
 export const useDesktopWorkspaceStore = defineStore(
-  'owd/desktop/workspace',
+  DESKTOP_WORKSPACE_STORE_ID,
   () => {
     const desktopStore = useDesktopStore()
 
@@ -54,6 +55,33 @@ export const useDesktopWorkspaceStore = defineStore(
       desktopStore.state.workspace.list.push(nanoid(8))
     }
 
+    /** Last workspace in list excluding the given id (window migration target). */
+    function resolveWorkspaceFallback(workspaceId: string): string | null {
+      const remaining = desktopStore.state.workspace.list.filter(
+        (id) => id !== workspaceId,
+      )
+      return remaining.at(-1) ?? null
+    }
+
+    function removeWorkspace(workspaceId: string): boolean {
+      const list = desktopStore.state.workspace.list
+      if (list.length <= 2) return false
+
+      const index = list.indexOf(workspaceId)
+      if (index === -1) return false
+
+      const fallbackId = resolveWorkspaceFallback(workspaceId)
+      if (!fallbackId) return false
+
+      list.splice(index, 1)
+
+      if (desktopStore.state.workspace.active === workspaceId) {
+        desktopStore.state.workspace.active = fallbackId
+      }
+
+      return true
+    }
+
     const workspaceActiveIndex = computed(() => {
       return desktopStore.state.workspace.list.findIndex(
         (workspace) => workspace === desktopStore.state.workspace.active,
@@ -70,6 +98,8 @@ export const useDesktopWorkspaceStore = defineStore(
       setOverview,
       setWorkspace,
       createWorkspace,
+      resolveWorkspaceFallback,
+      removeWorkspace,
     }
   },
 )

package/runtime/stores/storeIds.ts

@@ -0,0 +1,35 @@
+export const DESKTOP_STORE_ID = 'desktop'
+export const DESKTOP_WORKSPACE_STORE_ID = 'desktop/workspace'
+export const DESKTOP_WINDOW_STORE_ID = 'desktop/window'
+export const DESKTOP_VOLUME_STORE_ID = 'desktop/volume'
+export const DESKTOP_DEFAULT_APPS_STORE_ID = 'desktop/defaultApps'
+
+export const applicationWindowsStoreId = (appId: string) =>
+  `desktop/application/${appId}/windows`
+
+export const applicationMetaStoreId = (appId: string) =>
+  `desktop/application/${appId}/meta`
+
+export const STORE_ID_MIGRATION_FLAG = 'desktop/store-id-migration/v1'
+
+/** Static legacy Pinia store ids mapped to their 3.4 replacements. */
+export const LEGACY_STORE_ID_MAP: Record<string, string> = {
+  'owd/desktop': DESKTOP_STORE_ID,
+  'owd/desktop/workspace': DESKTOP_WORKSPACE_STORE_ID,
+  'owd/desktop/window': DESKTOP_WINDOW_STORE_ID,
+  'owd/desktop/volume': DESKTOP_VOLUME_STORE_ID,
+  'owd/desktop/defaultApps': DESKTOP_DEFAULT_APPS_STORE_ID,
+}
+
+export const LEGACY_APPLICATION_STORE_PATTERN =
+  /^owd\/application\/([^/]+)\/(windows|meta)$/
+
+export function legacyApplicationStoreIdToNew(
+  legacyId: string,
+): string | null {
+  const match = legacyId.match(LEGACY_APPLICATION_STORE_PATTERN)
+  if (!match) return null
+
+  const [, appId, kind] = match
+  return `desktop/application/${appId}/${kind}`
+}

package/runtime/types/desktopMenu.ts

@@ -0,0 +1,10 @@
+/** Neutral menu model for window chrome (Menubar-compatible shape). */
+export interface DesktopMenuItem {
+  label?: string
+  icon?: string
+  command?: () => void
+  separator?: boolean
+  disabled?: boolean
+  items?: DesktopMenuItem[]
+  [key: string]: unknown
+}

package/runtime/utils/initDesktopShell.ts

@@ -0,0 +1,80 @@
+import { setActivePinia } from 'pinia'
+import type { Pinia } from 'pinia'
+import { useAppConfig, useRuntimeConfig } from 'nuxt/app'
+import { toRaw } from 'vue'
+import { useDesktopManager } from '../composables/useDesktopManager'
+import { useDesktopStore } from '../stores/storeDesktop'
+import { useDesktopWorkspaceStore } from '../stores/storeDesktopWorkspace'
+import { useDesktopDefaultAppsStore } from '../stores/storeDesktopDefaultApps'
+import { registerDesktopPluginPinia } from '../../kit/defineDesktopApp'
+
+/** Bind Nuxt's Pinia instance for store composables outside component setup timing. */
+export function bindDesktopPinia(pinia: Pinia | undefined) {
+  if (pinia) {
+    setActivePinia(pinia)
+    registerDesktopPluginPinia(pinia)
+  }
+}
+
+/** Sync `appConfig.desktop` from runtime when the composable is not ready yet (early client plugins). */
+export function ensureAppConfigDesktop() {
+  const runtimeConfig = useRuntimeConfig()
+  const publicDesktop = runtimeConfig.public?.desktop
+  if (!publicDesktop || typeof publicDesktop !== 'object') return undefined
+
+  let appConfig: ReturnType<typeof useAppConfig> | undefined
+  try {
+    appConfig = useAppConfig()
+  } catch {
+    return publicDesktop as DesktopConfig
+  }
+
+  if (!appConfig) return publicDesktop as DesktopConfig
+
+  if (!appConfig.desktop) {
+    appConfig.desktop = publicDesktop as DesktopConfig
+  }
+
+  return appConfig.desktop as DesktopConfig
+}
+
+function mergeShellKeysOntoAppConfig() {
+  if (import.meta.server) return
+
+  const desktopManager = useDesktopManager()
+  const desktop = ensureAppConfigDesktop()
+  if (!desktop) return
+
+  desktopManager.setConfig({
+    windows: desktop.windows ? toRaw(desktop.windows) : undefined,
+    systemBar: desktop.systemBar ? toRaw(desktop.systemBar) : undefined,
+    dockBar: desktop.dockBar ? toRaw(desktop.dockBar) : undefined,
+    workspaces: desktop.workspaces ? toRaw(desktop.workspaces) : undefined,
+  })
+}
+
+/** Re-run appConfig shell merge when `useAppConfig()` was not ready during early plugins. */
+export function syncDesktopShellAppConfig() {
+  mergeShellKeysOntoAppConfig()
+}
+
+/** Kernel shell bootstrap: workspaces, default apps, merged shell config on appConfig. */
+export function initDesktopShell() {
+  if (import.meta.server) return
+
+  const desktopStore = useDesktopStore()
+  const desktopWorkspaceStore = useDesktopWorkspaceStore()
+  const runtimeConfig = useRuntimeConfig()
+  const desktopDefaultAppsStore = useDesktopDefaultAppsStore()
+
+  if (desktopStore.$persistedState) {
+    desktopStore.$persistedState.isReady().then(() => {
+      desktopWorkspaceStore.setupWorkspaces()
+    })
+  } else {
+    desktopWorkspaceStore.setupWorkspaces()
+  }
+
+  desktopDefaultAppsStore.loadDefaultAppsFromConfig(runtimeConfig)
+  mergeShellKeysOntoAppConfig()
+}

package/runtime/utils/migratePersistedStoreIds.ts

@@ -0,0 +1,57 @@
+import {
+  LEGACY_STORE_ID_MAP,
+  STORE_ID_MIGRATION_FLAG,
+  legacyApplicationStoreIdToNew,
+} from '../stores/storeIds'
+
+function migrateStorageKey(
+  storage: Storage,
+  legacyId: string,
+  newId: string,
+) {
+  const legacyValue = storage.getItem(legacyId)
+  if (legacyValue === null) return
+
+  if (storage.getItem(newId) !== null) {
+    storage.removeItem(legacyId)
+    return
+  }
+
+  storage.setItem(newId, legacyValue)
+  storage.removeItem(legacyId)
+}
+
+function collectLegacyApplicationKeys(storage: Storage) {
+  const keys: string[] = []
+
+  for (let index = 0; index < storage.length; index++) {
+    const key = storage.key(index)
+    if (key && legacyApplicationStoreIdToNew(key)) {
+      keys.push(key)
+    }
+  }
+
+  return keys
+}
+
+/**
+ * One-shot migration of persisted Pinia state from legacy `owd/*` store ids
+ * to `desktop/*`. Runs before shell init so module-persistence hydrates new keys.
+ */
+export function migratePersistedStoreIds(storage: Storage = localStorage) {
+  if (typeof storage?.getItem !== 'function') return
+  if (storage.getItem(STORE_ID_MIGRATION_FLAG) === 'done') return
+
+  for (const [legacyId, newId] of Object.entries(LEGACY_STORE_ID_MAP)) {
+    migrateStorageKey(storage, legacyId, newId)
+  }
+
+  for (const legacyId of collectLegacyApplicationKeys(storage)) {
+    const newId = legacyApplicationStoreIdToNew(legacyId)
+    if (newId) {
+      migrateStorageKey(storage, legacyId, newId)
+    }
+  }
+
+  storage.setItem(STORE_ID_MIGRATION_FLAG, 'done')
+}

package/runtime/utils/utilApp.ts

@@ -1,5 +1,3 @@
-import type { Nuxt } from '@nuxt/schema'
-
 export function normalizeApplicationConfig(
   config: ApplicationConfig,
 ): ApplicationConfig {
@@ -25,13 +23,3 @@ export function normalizeApplicationConfig(
     entries: normalizedEntries,
   }
 }
-
-export function registerTailwindPath(nuxt: Nuxt, path: string) {
-  nuxt.options.runtimeConfig.app.owd = nuxt.options.runtimeConfig.app.owd || {}
-  nuxt.options.runtimeConfig.app.owd.tailwindPaths =
-    nuxt.options.runtimeConfig.app.owd.tailwindPaths || []
-
-  if (!nuxt.options.runtimeConfig.app.owd.tailwindPaths.includes(path)) {
-    nuxt.options.runtimeConfig.app.owd.tailwindPaths.push(path)
-  }
-}

package/runtime/utils/{captureElementToCanvas.ts → utilCaptureElementToCanvas.ts}

@@ -1,6 +1,6 @@
 /**
  * Renders a DOM subtree to a canvas via html2canvas (optional dependency).
- * Used for workspace thumbnails / previews; returns null if capture fails or html2canvas is missing.
+ * Used for workspace overview thumbnails; returns null if capture fails or html2canvas is missing.
  */
 export async function captureElementToCanvas(
   element: HTMLElement | null | undefined,

package/runtime/utils/utilDetectSnapZone.ts

@@ -0,0 +1,57 @@
+import type { DesktopWorkAreaRect, WindowLayout } from '@owdproject/core'
+import {
+  WINDOW_SNAP_EDGE_PX,
+  WORKSPACE_EDGE_DROP_PX,
+} from '../constants/shellLayout'
+import { workAreaBottom, workAreaRight } from './utilWindowLayout'
+
+export type SnapZoneHint = Exclude<WindowLayout, 'normal'>
+
+export type DetectSnapZoneOptions = {
+  edgePx?: number
+  /** When true, left/right half snap is suppressed in the outer workspace-edge band. */
+  deferSideSnapForWorkspaceEdge?: boolean
+}
+
+/**
+ * Resolve snap zone from pointer position and shell work area.
+ * Returns null when the pointer is not in a snap band.
+ */
+export function detectSnapZone(
+  clientX: number,
+  clientY: number,
+  workArea: DesktopWorkAreaRect,
+  options?: DetectSnapZoneOptions,
+): SnapZoneHint | null {
+  const edge = options?.edgePx ?? WINDOW_SNAP_EDGE_PX
+  const { x, y, width, height } = workArea
+
+  if (width <= 0 || height <= 0) {
+    return null
+  }
+
+  const bottom = workAreaBottom(workArea)
+  const right = workAreaRight(workArea)
+
+  const nearTop = clientY <= y + edge
+  const nearBottom = clientY >= bottom - edge
+  const nearLeft = clientX <= x + edge
+  const nearRight = clientX >= right - edge
+
+  const inWorkspaceEdgeBand =
+    options?.deferSideSnapForWorkspaceEdge === true &&
+    typeof globalThis !== 'undefined' &&
+    (clientX <= WORKSPACE_EDGE_DROP_PX ||
+      clientX >= globalThis.innerWidth - WORKSPACE_EDGE_DROP_PX)
+
+  if (nearTop && nearLeft) return 'top-left'
+  if (nearTop && nearRight) return 'top-right'
+  if (nearBottom && nearLeft) return 'bottom-left'
+  if (nearBottom && nearRight) return 'bottom-right'
+  if (nearTop) return 'maximize'
+  if (nearBottom) return 'bottom-half'
+  if (nearLeft && !inWorkspaceEdgeBand) return 'left-half'
+  if (nearRight && !inWorkspaceEdgeBand) return 'right-half'
+
+  return null
+}

package/runtime/utils/utilWindowLayout.ts

@@ -0,0 +1,82 @@
+import type {
+  DesktopWorkAreaRect,
+  IWindowController,
+  WindowBounds,
+  WindowLayout,
+} from '@owdproject/core'
+
+export type { WindowLayout, WindowBounds, DesktopWorkAreaRect }
+
+export function workAreaBottom(workArea: DesktopWorkAreaRect): number {
+  return workArea.y + workArea.height
+}
+
+export function workAreaRight(workArea: DesktopWorkAreaRect): number {
+  return workArea.x + workArea.width
+}
+
+/**
+ * Viewport rectangle for a snap zone inside the shell work area.
+ */
+export function computeSnapRect(
+  zone: Exclude<WindowLayout, 'normal'>,
+  workArea: DesktopWorkAreaRect,
+): WindowBounds {
+  const { x, y, width, height } = workArea
+  const halfW = Math.floor(width / 2)
+  const halfH = Math.floor(height / 2)
+
+  switch (zone) {
+    case 'maximize':
+      return { x, y, width, height }
+    case 'left-half':
+      return { x, y, width: halfW, height }
+    case 'right-half':
+      return { x: x + halfW, y, width: width - halfW, height }
+    case 'bottom-half':
+      return { x, y: y + halfH, width, height: height - halfH }
+    case 'top-left':
+      return { x, y, width: halfW, height: halfH }
+    case 'top-right':
+      return { x: x + halfW, y, width: width - halfW, height: halfH }
+    case 'bottom-left':
+      return { x, y: y + halfH, width: halfW, height: height - halfH }
+    case 'bottom-right':
+      return {
+        x: x + halfW,
+        y: y + halfH,
+        width: width - halfW,
+        height: height - halfH,
+      }
+    default: {
+      const _exhaustive: never = zone
+      return _exhaustive
+    }
+  }
+}
+
+export function applyWindowBounds(
+  win: IWindowController,
+  bounds: WindowBounds,
+): void {
+  win.actions.setPosition({ x: bounds.x, y: bounds.y })
+  win.actions.setSize({ width: bounds.width, height: bounds.height })
+}
+
+export function applySnapToWindow(
+  win: IWindowController,
+  zone: Exclude<WindowLayout, 'normal'>,
+  workArea: DesktopWorkAreaRect,
+): boolean {
+  if (!win.isMaximizable) {
+    return false
+  }
+
+  win.actions.setLayout(zone)
+  applyWindowBounds(win, computeSnapRect(zone, workArea))
+  return true
+}
+
+export function restoreWindowBounds(win: IWindowController): boolean {
+  return win.actions.clearLayout()
+}

package/runtime/utils/utilWindowMaximizeLayout.ts

@@ -0,0 +1,44 @@
+function computeMaximizeRect(workArea: DesktopWorkAreaRect): WindowBounds {
+  const { x, y, width, height } = workArea
+  return { x, y, width, height }
+}
+
+function applyWindowBounds(
+  win: IWindowController,
+  bounds: WindowBounds,
+): void {
+  win.actions.setPosition({ x: bounds.x, y: bounds.y })
+  win.actions.setSize({ width: bounds.width, height: bounds.height })
+}
+
+function applyMaximizeToWindow(
+  win: IWindowController,
+  workArea: DesktopWorkAreaRect,
+): boolean {
+  if (!win.isMaximizable) {
+    return false
+  }
+
+  win.actions.setLayout('maximize')
+  applyWindowBounds(win, computeMaximizeRect(workArea))
+  return true
+}
+
+export function toggleWindowMaximizeLayout(
+  win: IWindowController,
+  workArea: DesktopWorkAreaRect,
+): boolean {
+  if (!win.isMaximizable) {
+    return false
+  }
+
+  if (win.isMaximized || (win.state.layout && win.state.layout !== 'normal')) {
+    return win.actions.clearLayout()
+  }
+
+  if (workArea.width <= 0 || workArea.height <= 0) {
+    return win.actions.setLayout('maximize')
+  }
+
+  return applyMaximizeToWindow(win, workArea)
+}

package/runtime/utils/utilWorkspaceWindows.ts

@@ -0,0 +1,33 @@
+/**
+ * Collect open windows that belong to a workspace (explicit id or implicit active desktop).
+ */
+export function collectWindowsOnWorkspace(
+  apps: Iterable<IApplicationController>,
+  workspaceId: string,
+  activeWorkspaceId: string,
+): IWindowController[] {
+  const result: IWindowController[] = []
+
+  for (const app of apps) {
+    for (const win of app.windows.values()) {
+      const ws = win.state.workspace
+      if (ws === workspaceId) {
+        result.push(win)
+        continue
+      }
+      if (!ws && workspaceId === activeWorkspaceId) {
+        result.push(win)
+      }
+    }
+  }
+
+  return result
+}
+
+export function countWindowsOnWorkspace(
+  apps: Iterable<IApplicationController>,
+  workspaceId: string,
+  activeWorkspaceId: string,
+): number {
+  return collectWindowsOnWorkspace(apps, workspaceId, activeWorkspaceId).length
+}