@surdeddd/wmkit 0.7.2 → 0.9.0

package/README.md

@@ -24,7 +24,7 @@
 - ⌨️ **Accessible** — keyboard move/resize/snap, F6 window cycling, focus-trapped modals, `aria-live` announcements
 - ⚡ **Fast** — `transform`-only positioning, rAF-batched pointer input, structural sharing; 50 windows drag at 60fps
 - 💾 **Persistence** — one call to serialize the desktop, one call to restore it, with versioned migrations
-- 🎨 **Three themes** — dark glass, light glass and Win98 retro, or bring your own CSS
+- 🎨 **Sixteen themes** — glass, light, retro, terminal, paper, neon, aqua, frost, candy, carbon, brutalist, blueprint, amber, noir, forest, synth — or bring your own CSS
 - 🖼️ **Popout** *(experimental)* — send a window into Document Picture-in-Picture
 - 📦 **Zero dependencies**, strict TypeScript, ESM + CJS, ~10.7 kB brotli core
 
@@ -68,7 +68,7 @@ The desktop element becomes the coordinate space. Your markup stays yours — wm
 | Attribute | Meaning |
 | --- | --- |
 | `data-wm-drag` | drag handle (usually the titlebar); double-click toggles maximize |
-| `data-wm-title` | window title node, linked via `aria-labelledby` |
+| `data-wm-title` | window title node; its text follows the state, and it is linked via `aria-labelledby` when it shares a root with the window |
 | `data-wm-close` / `data-wm-minimize` / `data-wm-maximize` | control buttons, wired by delegation |
 | `data-wm-content` | scrollable content area (styled by themes) |
 
@@ -326,6 +326,61 @@ persist(wm, {
 
 Moves a window's content into a [Document Picture-in-Picture](https://developer.mozilla.org/docs/Web/API/Document_Picture-in-Picture_API) always-on-top OS window, keeping the same JS context and state. Feature-detect with `isPopoutSupported()`.
 
+### `pinch(options?)`, `swipe(options?)`, `touchGestures(options?)` — `@surdeddd/wmkit/gestures`
+
+Two-finger gestures, opt-in so the core never pays for them: pinch a window to resize it around the point between your fingers, swipe two fingers sideways to change workspace. 1.46 kB brotlied.
+
+```js
+import { attachDesktop } from '@surdeddd/wmkit'
+import { touchGestures } from '@surdeddd/wmkit/gestures'
+
+attachDesktop(wm, root, { gestures: [touchGestures({ swipe: { workspaces: 4 } })] })
+```
+
+A gesture is just a function that takes a `GestureContext` and returns its teardown, so your own gestures cooperate with the built-in drag and resize through the same `claim`/`busy` pair — see [docs/api.md](docs/api.md).
+
+### `skin(spec)`, `defaultSkin`, `barebones` — `@surdeddd/wmkit/chrome`
+
+Builds the window itself from a markup string, so a consumer can ship their own chrome and their own buttons without writing a single listener. 802 B brotlied.
+
+```js
+import { attachDesktop } from '@surdeddd/wmkit'
+import { skin } from '@surdeddd/wmkit/chrome'
+
+const mine = skin({
+  name: 'mine',
+  template:
+    '<section><header data-wm-drag><span data-wm-title>{{title}}</span>' +
+    '<button data-wm-close aria-label="Close {{title}}"></button></header>' +
+    '<div data-wm-content></div></section>',
+})
+
+const desktop = attachDesktop(wm, root, { skins: { mine } })
+desktop.mountWindow('notes', 'mine').content.append(myApp)
+```
+
+`data-wm-close`, `data-wm-minimize`, `data-wm-maximize`, `data-wm-restore`, `data-wm-center`, `data-wm-send-back`, `data-wm-snap="left"` and `data-wm-to-workspace="2"` are read straight off your markup. Every `{{placeholder}}` is HTML-escaped. `shadow: true` seals the chrome inside an open shadow root without losing grouping, focus trapping or the accessible name — see [docs/recipes.md](docs/recipes.md).
+
+### `createDevtools(wm, options?)` — `@surdeddd/wmkit/devtools`
+
+An opt-in panel that shows the live window table, an event log and the manager controls, so you can see what the state machine is doing without a debugger. It follows the manager, never the DOM, so it works with any adapter or none.
+
+```js
+import { createDevtools, devtoolsMessagesRu } from '@surdeddd/wmkit/devtools'
+
+const panel = createDevtools(wm, { logLimit: 100 })
+panel.destroy()
+```
+
+| Option | Default | Meaning |
+| --- | --- | --- |
+| `container` | `document.body` | where the panel mounts |
+| `messages` | English catalog | pass `devtoolsMessagesRu` for Russian, or your own strings |
+| `logLimit` | `50` | ring buffer size for the event log |
+| `events` | open, close, focus, stage, workspace, group, modalblocked | which manager events to log |
+
+Rows are patched in place rather than re-rendered, so keyboard focus inside the panel survives while windows move. It injects one scoped stylesheet, shared between panels and removed with the last one.
+
 ## Theming
 
 `@surdeddd/wmkit/themes/glass.css` styles the `data-wm-*` attributes and exposes CSS variables:
@@ -339,7 +394,9 @@ Moves a window's content into a [Document Picture-in-Picture](https://developer.
 }
 ```
 
-Two more ready-made themes ship alongside: `themes/light.css` (light glass) and `themes/retro.css` (pixel-perfect Win98 nostalgia). All three style the same `data-wm-*` attributes, so switching is a one-line import swap.
+Fifteen more ready-made themes ship alongside — `light`, `retro`, `terminal`, `paper`, `neon`, `aqua`, `frost`, `candy`, `carbon`, `brutalist`, `blueprint`, `amber`, `noir`, `forest` and `synth`. They all style the same `data-wm-*` attributes, so switching is a one-line import swap, and every one of them ships 24px pointer targets plus `prefers-reduced-motion` and `forced-colors` blocks.
+
+A theme dresses every window; a variant dresses one. Set `meta.variant` on a window and the desktop mirrors it to `data-wm-variant` for your CSS to pick up — see [docs/theming.md](docs/theming.md).
 
 Skip the import entirely and the library stays headless: state attributes (`data-wm-stage`, `data-wm-focused`, `data-wm-dragging`, `data-wm-flash`, `[hidden]`) are yours to style.
 

package/README.ru.md

@@ -20,7 +20,7 @@
 - ⌨️ **Доступность** — move/resize/snap с клавиатуры, цикл окон по F6, focus-trap в модалках, `aria-live`-анонсы
 - ⚡ **Производительность** — позиционирование только через `transform`, rAF-батчинг ввода, structural sharing; 50 окон таскаются на 60fps
 - 💾 **Персист** — один вызов сериализует рабочий стол, один — восстанавливает, с версионированием и миграциями
-- 🎨 **Три темы** — тёмное стекло, светлое стекло и Win98-ретро, либо полностью свой CSS
+- 🎨 **Шестнадцать тем** — glass, light, retro, terminal, paper, neon, aqua, frost, candy, carbon, brutalist, blueprint, amber, noir, forest, synth — либо полностью свой CSS
 - 🖼️ **Popout** *(experimental)* — вынос окна в Document Picture-in-Picture
 - 📦 **Ноль зависимостей**, строгий TypeScript, ESM + CJS, ~10.7 kB brotli
 
@@ -64,7 +64,7 @@ desktop.attachWindow(win.id, el, { removeOnClose: true })
 | Атрибут | Смысл |
 | --- | --- |
 | `data-wm-drag` | ручка перетаскивания (обычно тайтлбар); двойной клик — toggle maximize |
-| `data-wm-title` | узел заголовка, связывается через `aria-labelledby` |
+| `data-wm-title` | узел заголовка: его текст следует за состоянием, а связь через `aria-labelledby` ставится, когда узел лежит в том же корне, что и окно |
 | `data-wm-close` / `data-wm-minimize` / `data-wm-maximize` | кнопки управления, работают через делегирование |
 | `data-wm-content` | скроллируемая область контента |
 
@@ -262,11 +262,68 @@ if (isPopoutSupported()) await popout(wm, 'docs', contentElement)
 
 Окно уезжает в настоящее always-on-top окно ОС (Document Picture-in-Picture) с тем же JS-контекстом и состоянием.
 
+### `pinch(options?)`, `swipe(options?)`, `touchGestures(options?)` — `@surdeddd/wmkit/gestures`
+
+Жесты двумя пальцами, подключаются по желанию — ядро за них не платит: пинч растягивает окно вокруг точки между пальцами, свайп двумя пальцами вбок переключает рабочий стол. 1.46 кБ в brotli.
+
+```js
+import { attachDesktop } from '@surdeddd/wmkit'
+import { touchGestures } from '@surdeddd/wmkit/gestures'
+
+attachDesktop(wm, root, { gestures: [touchGestures({ swipe: { workspaces: 4 } })] })
+```
+
+Жест — это просто функция: принимает `GestureContext`, возвращает свою отписку. Свои жесты уживаются со встроенными драгом и ресайзом через ту же пару `claim`/`busy` — подробности в [docs/api.md](docs/api.md).
+
+### `skin(spec)`, `defaultSkin`, `barebones` — `@surdeddd/wmkit/chrome`
+
+Собирает само окно из строки разметки: можно принести свою обвязку и свои кнопки, не написав ни одного обработчика. 802 Б в brotli.
+
+```js
+import { attachDesktop } from '@surdeddd/wmkit'
+import { skin } from '@surdeddd/wmkit/chrome'
+
+const mine = skin({
+  name: 'mine',
+  template:
+    '<section><header data-wm-drag><span data-wm-title>{{title}}</span>' +
+    '<button data-wm-close aria-label="Закрыть {{title}}"></button></header>' +
+    '<div data-wm-content></div></section>',
+})
+
+const desktop = attachDesktop(wm, root, { skins: { mine } })
+desktop.mountWindow('notes', 'mine').content.append(myApp)
+```
+
+`data-wm-close`, `data-wm-minimize`, `data-wm-maximize`, `data-wm-restore`, `data-wm-center`, `data-wm-send-back`, `data-wm-snap="left"` и `data-wm-to-workspace="2"` читаются прямо из вашей разметки. Каждая подстановка `{{...}}` экранируется. `shadow: true` запечатывает обвязку в открытом теневом корне, не теряя ни группировку, ни ловушку фокуса, ни доступное имя — подробности в [docs/recipes.md](docs/recipes.md).
+
+### `createDevtools(wm, options?)` — `@surdeddd/wmkit/devtools`
+
+Панель, которую подключают по желанию: живая таблица окон, журнал событий и управление менеджером — чтобы видеть, что делает машина состояний, без отладчика. Она следит за менеджером, а не за DOM, поэтому работает с любым адаптером и без него.
+
+```js
+import { createDevtools, devtoolsMessagesRu } from '@surdeddd/wmkit/devtools'
+
+const panel = createDevtools(wm, { messages: devtoolsMessagesRu })
+panel.destroy()
+```
+
+| Опция | По умолчанию | Значение |
+| --- | --- | --- |
+| `container` | `document.body` | куда монтируется панель |
+| `messages` | английский каталог | `devtoolsMessagesRu` для русского или свои строки |
+| `logLimit` | `50` | размер кольцевого буфера журнала |
+| `events` | open, close, focus, stage, workspace, group, modalblocked | какие события менеджера писать |
+
+Строки обновляются точечно, а не перерисовываются целиком, поэтому фокус клавиатуры внутри панели переживает перемещение окон. Панель добавляет один изолированный стиль — общий для всех панелей и удаляемый вместе с последней.
+
 ## Темизация
 
 Подключите `@surdeddd/wmkit/themes/glass.css` и переопределяйте CSS-переменные (`--wm-radius`, `--wm-bg`, `--wm-accent`, …) — или не подключайте ничего и стилизуйте `data-wm-stage`, `data-wm-focused`, `data-wm-dragging`, `[hidden]` сами.
 
-Ещё две готовые темы: `themes/light.css` (светлое стекло) и `themes/retro.css` (Win98-ностальгия). Все три стилизуют одни и те же `data-wm-*` атрибуты — переключение = замена одного импорта.
+Ещё пятнадцать готовых тем: `light`, `retro`, `terminal`, `paper`, `neon`, `aqua`, `frost`, `candy`, `carbon`, `brutalist`, `blueprint`, `amber`, `noir`, `forest`, `synth`. Все стилизуют одни и те же `data-wm-*` атрибуты — переключение = замена одного импорта, и у каждой есть 24px тач-цели плюс блоки `prefers-reduced-motion` и `forced-colors`.
+
+Тема одевает все окна, вариант — одно. Задайте `meta.variant` у окна, и десктоп отзеркалит его в `data-wm-variant` для вашего CSS — подробности в [docs/theming.md](docs/theming.md).
 
 ## SSR
 

package/dist/angular.cjs

@@ -1,6 +1,7 @@
 'use strict';
 
-var chunkNJAI5R4J_cjs = require('./chunk-NJAI5R4J.cjs');
+var chunkZWUVWRUS_cjs = require('./chunk-ZWUVWRUS.cjs');
+require('./chunk-BDHFXEJN.cjs');
 var core = require('@angular/core');
 
 function onDestroy(dispose) {
@@ -13,7 +14,7 @@ function onDestroy(dispose) {
   destroyRef?.onDestroy(dispose);
 }
 function useWindowManager(options) {
-  const wm = chunkNJAI5R4J_cjs.createWindowManager(options);
+  const wm = chunkZWUVWRUS_cjs.createWindowManager(options);
   onDestroy(() => wm.destroy());
   return wm;
 }
@@ -28,7 +29,7 @@ function useWmWindow(wm, id) {
   return core.computed(() => state().windows[id]);
 }
 function createDesktop(wm, options) {
-  const binder = chunkNJAI5R4J_cjs.createDesktopBinder(wm, options);
+  const binder = chunkZWUVWRUS_cjs.createDesktopBinder(wm, options);
   onDestroy(() => binder.destroy());
   return {
     binder,

package/dist/angular.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/adapters/angular.ts"],"names":["inject","DestroyRef","createWindowManager","signal","computed","createDesktopBinder"],"mappings":";;;;;AAMA,SAAS,UAAU,OAAA,EAA2B;AAC5C,EAAA,IAAI,UAAA,GAAgC,IAAA;AACpC,EAAA,IAAI;AACF,IAAA,UAAA,GAAaA,YAAOC,eAAU,CAAA;AAAA,EAChC,CAAA,CAAA,MAAQ;AACN,IAAA,UAAA,GAAa,IAAA;AAAA,EACf;AACA,EAAA,UAAA,EAAY,UAAU,OAAO,CAAA;AAC/B;AAEO,SAAS,iBAAiB,OAAA,EAAyC;AACxE,EAAA,MAAM,EAAA,GAAKC,sCAAoB,OAAO,CAAA;AACtC,EAAA,SAAA,CAAU,MAAM,EAAA,CAAG,OAAA,EAAS,CAAA;AAC5B,EAAA,OAAO,EAAA;AACT;AAEO,SAAS,WAAW,EAAA,EAAyC;AAClE,EAAA,MAAM,KAAA,GAAQC,WAAA,CAAO,EAAA,CAAG,QAAA,EAAU,CAAA;AAClC,EAAA,MAAM,IAAA,GAAO,GAAG,SAAA,CAAU,CAAC,SAAS,KAAA,CAAM,GAAA,CAAI,IAAI,CAAC,CAAA;AACnD,EAAA,SAAA,CAAU,IAAI,CAAA;AACd,EAAA,OAAO,MAAM,UAAA,EAAW;AAC1B;AAEO,SAAS,WAAA,CAAY,IAAmB,EAAA,EAA6C;AAC1F,EAAA,MAAM,KAAA,GAAQ,WAAW,EAAE,CAAA;AAC3B,EAAA,OAAOC,cAAS,MAAM,KAAA,EAAM,CAAE,OAAA,CAAQ,EAAE,CAAC,CAAA;AAC3C;AAQO,SAAS,aAAA,CAAc,IAAmB,OAAA,EAA0C;AACzF,EAAA,MAAM,MAAA,GAASC,qCAAA,CAAoB,EAAA,EAAI,OAAO,CAAA;AAC9C,EAAA,SAAA,CAAU,MAAM,MAAA,CAAO,OAAA,EAAS,CAAA;AAChC,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA,QAAQ,OAAA,EAAS;AACf,MAAA,MAAM,MAAA,GAAS,MAAA,CAAO,WAAA,CAAY,OAAO,CAAA;AACzC,MAAA,SAAA,CAAU,MAAM,CAAA;AAAA,IAClB,CAAA;AAAA,IACA,MAAA,CAAO,IAAI,aAAA,EAAe;AACxB,MAAA,OAAO,CAAC,OAAA,KAAY;AAClB,QAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,EAAA,EAAI,SAAS,aAAa,CAAA;AAC3D,QAAA,SAAA,CAAU,MAAM,CAAA;AAAA,MAClB,CAAA;AAAA,IACF;AAAA,GACF;AACF","file":"angular.cjs","sourcesContent":["import { computed, DestroyRef, inject, type Signal, signal } from '@angular/core'\nimport { createWindowManager } from '../core/manager'\nimport type { ManagerOptions, ManagerState, WindowManager, WindowState } from '../core/types'\nimport { createDesktopBinder, type DesktopBinder } from '../dom/binder'\nimport type { DesktopOptions, WindowAttachOptions } from '../dom/shared'\n\nfunction onDestroy(dispose: () => void): void {\n  let destroyRef: DestroyRef | null = null\n  try {\n    destroyRef = inject(DestroyRef)\n  } catch {\n    destroyRef = null\n  }\n  destroyRef?.onDestroy(dispose)\n}\n\nexport function useWindowManager(options?: ManagerOptions): WindowManager {\n  const wm = createWindowManager(options)\n  onDestroy(() => wm.destroy())\n  return wm\n}\n\nexport function useWmState(wm: WindowManager): Signal<ManagerState> {\n  const state = signal(wm.getState())\n  const stop = wm.subscribe((next) => state.set(next))\n  onDestroy(stop)\n  return state.asReadonly()\n}\n\nexport function useWmWindow(wm: WindowManager, id: string): Signal<WindowState | undefined> {\n  const state = useWmState(wm)\n  return computed(() => state().windows[id])\n}\n\nexport interface AngularDesktop {\n  binder: DesktopBinder\n  desktop(element: HTMLElement): void\n  window(id: string, options?: WindowAttachOptions): (element: HTMLElement) => void\n}\n\nexport function createDesktop(wm: WindowManager, options?: DesktopOptions): AngularDesktop {\n  const binder = createDesktopBinder(wm, options)\n  onDestroy(() => binder.destroy())\n  return {\n    binder,\n    desktop(element) {\n      const unbind = binder.bindDesktop(element)\n      onDestroy(unbind)\n    },\n    window(id, windowOptions) {\n      return (element) => {\n        const unbind = binder.bindWindow(id, element, windowOptions)\n        onDestroy(unbind)\n      }\n    },\n  }\n}\n"]}
+{"version":3,"sources":["../src/adapters/angular.ts"],"names":["inject","DestroyRef","createWindowManager","signal","computed","createDesktopBinder"],"mappings":";;;;;;AAMA,SAAS,UAAU,OAAA,EAA2B;AAC5C,EAAA,IAAI,UAAA,GAAgC,IAAA;AACpC,EAAA,IAAI;AACF,IAAA,UAAA,GAAaA,YAAOC,eAAU,CAAA;AAAA,EAChC,CAAA,CAAA,MAAQ;AACN,IAAA,UAAA,GAAa,IAAA;AAAA,EACf;AACA,EAAA,UAAA,EAAY,UAAU,OAAO,CAAA;AAC/B;AAEO,SAAS,iBAAiB,OAAA,EAAyC;AACxE,EAAA,MAAM,EAAA,GAAKC,sCAAoB,OAAO,CAAA;AACtC,EAAA,SAAA,CAAU,MAAM,EAAA,CAAG,OAAA,EAAS,CAAA;AAC5B,EAAA,OAAO,EAAA;AACT;AAEO,SAAS,WAAW,EAAA,EAAyC;AAClE,EAAA,MAAM,KAAA,GAAQC,WAAA,CAAO,EAAA,CAAG,QAAA,EAAU,CAAA;AAClC,EAAA,MAAM,IAAA,GAAO,GAAG,SAAA,CAAU,CAAC,SAAS,KAAA,CAAM,GAAA,CAAI,IAAI,CAAC,CAAA;AACnD,EAAA,SAAA,CAAU,IAAI,CAAA;AACd,EAAA,OAAO,MAAM,UAAA,EAAW;AAC1B;AAEO,SAAS,WAAA,CAAY,IAAmB,EAAA,EAA6C;AAC1F,EAAA,MAAM,KAAA,GAAQ,WAAW,EAAE,CAAA;AAC3B,EAAA,OAAOC,cAAS,MAAM,KAAA,EAAM,CAAE,OAAA,CAAQ,EAAE,CAAC,CAAA;AAC3C;AAQO,SAAS,aAAA,CAAc,IAAmB,OAAA,EAA0C;AACzF,EAAA,MAAM,MAAA,GAASC,qCAAA,CAAoB,EAAA,EAAI,OAAO,CAAA;AAC9C,EAAA,SAAA,CAAU,MAAM,MAAA,CAAO,OAAA,EAAS,CAAA;AAChC,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA,QAAQ,OAAA,EAAS;AACf,MAAA,MAAM,MAAA,GAAS,MAAA,CAAO,WAAA,CAAY,OAAO,CAAA;AACzC,MAAA,SAAA,CAAU,MAAM,CAAA;AAAA,IAClB,CAAA;AAAA,IACA,MAAA,CAAO,IAAI,aAAA,EAAe;AACxB,MAAA,OAAO,CAAC,OAAA,KAAY;AAClB,QAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,EAAA,EAAI,SAAS,aAAa,CAAA;AAC3D,QAAA,SAAA,CAAU,MAAM,CAAA;AAAA,MAClB,CAAA;AAAA,IACF;AAAA,GACF;AACF","file":"angular.cjs","sourcesContent":["import { computed, DestroyRef, inject, type Signal, signal } from '@angular/core'\nimport { createWindowManager } from '../core/manager'\nimport type { ManagerOptions, ManagerState, WindowManager, WindowState } from '../core/types'\nimport { createDesktopBinder, type DesktopBinder } from '../dom/binder'\nimport type { DesktopOptions, WindowAttachOptions } from '../dom/shared'\n\nfunction onDestroy(dispose: () => void): void {\n  let destroyRef: DestroyRef | null = null\n  try {\n    destroyRef = inject(DestroyRef)\n  } catch {\n    destroyRef = null\n  }\n  destroyRef?.onDestroy(dispose)\n}\n\nexport function useWindowManager(options?: ManagerOptions): WindowManager {\n  const wm = createWindowManager(options)\n  onDestroy(() => wm.destroy())\n  return wm\n}\n\nexport function useWmState(wm: WindowManager): Signal<ManagerState> {\n  const state = signal(wm.getState())\n  const stop = wm.subscribe((next) => state.set(next))\n  onDestroy(stop)\n  return state.asReadonly()\n}\n\nexport function useWmWindow(wm: WindowManager, id: string): Signal<WindowState | undefined> {\n  const state = useWmState(wm)\n  return computed(() => state().windows[id])\n}\n\nexport interface AngularDesktop {\n  binder: DesktopBinder\n  desktop(element: HTMLElement): void\n  window(id: string, options?: WindowAttachOptions): (element: HTMLElement) => void\n}\n\nexport function createDesktop(wm: WindowManager, options?: DesktopOptions): AngularDesktop {\n  const binder = createDesktopBinder(wm, options)\n  onDestroy(() => binder.destroy())\n  return {\n    binder,\n    desktop(element) {\n      const unbind = binder.bindDesktop(element)\n      onDestroy(unbind)\n    },\n    window(id, windowOptions) {\n      return (element) => {\n        const unbind = binder.bindWindow(id, element, windowOptions)\n        onDestroy(unbind)\n      }\n    },\n  }\n}\n"]}

package/dist/angular.d.cts

@@ -1,6 +1,7 @@
 import { Signal } from '@angular/core';
 import { W as WindowManager, M as ManagerOptions, a as ManagerState, b as WindowState } from './types-jG2lHGcA.cjs';
-import { D as DesktopBinder, W as WindowAttachOptions, a as DesktopOptions } from './binder-_L3Iww0u.cjs';
+import { D as DesktopBinder } from './binder-DGoj0xG1.cjs';
+import { W as WindowAttachOptions, D as DesktopOptions } from './shared-DdGFz3oy.cjs';
 
 declare function useWindowManager(options?: ManagerOptions): WindowManager;
 declare function useWmState(wm: WindowManager): Signal<ManagerState>;

package/dist/angular.d.ts

@@ -1,6 +1,7 @@
 import { Signal } from '@angular/core';
 import { W as WindowManager, M as ManagerOptions, a as ManagerState, b as WindowState } from './types-jG2lHGcA.js';
-import { D as DesktopBinder, W as WindowAttachOptions, a as DesktopOptions } from './binder-DvQFmO3K.js';
+import { D as DesktopBinder } from './binder-Lo13iTVB.js';
+import { W as WindowAttachOptions, D as DesktopOptions } from './shared-BoHXlPCu.js';
 
 declare function useWindowManager(options?: ManagerOptions): WindowManager;
 declare function useWmState(wm: WindowManager): Signal<ManagerState>;

package/dist/angular.js

@@ -1,4 +1,5 @@
-import { createWindowManager, createDesktopBinder } from './chunk-FOWW4LXS.js';
+import { createWindowManager, createDesktopBinder } from './chunk-TUGQX3CX.js';
+import './chunk-5XVIC5LH.js';
 import { signal, computed, inject, DestroyRef } from '@angular/core';
 
 function onDestroy(dispose) {

package/dist/angular.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/adapters/angular.ts"],"names":[],"mappings":";;;AAMA,SAAS,UAAU,OAAA,EAA2B;AAC5C,EAAA,IAAI,UAAA,GAAgC,IAAA;AACpC,EAAA,IAAI;AACF,IAAA,UAAA,GAAa,OAAO,UAAU,CAAA;AAAA,EAChC,CAAA,CAAA,MAAQ;AACN,IAAA,UAAA,GAAa,IAAA;AAAA,EACf;AACA,EAAA,UAAA,EAAY,UAAU,OAAO,CAAA;AAC/B;AAEO,SAAS,iBAAiB,OAAA,EAAyC;AACxE,EAAA,MAAM,EAAA,GAAK,oBAAoB,OAAO,CAAA;AACtC,EAAA,SAAA,CAAU,MAAM,EAAA,CAAG,OAAA,EAAS,CAAA;AAC5B,EAAA,OAAO,EAAA;AACT;AAEO,SAAS,WAAW,EAAA,EAAyC;AAClE,EAAA,MAAM,KAAA,GAAQ,MAAA,CAAO,EAAA,CAAG,QAAA,EAAU,CAAA;AAClC,EAAA,MAAM,IAAA,GAAO,GAAG,SAAA,CAAU,CAAC,SAAS,KAAA,CAAM,GAAA,CAAI,IAAI,CAAC,CAAA;AACnD,EAAA,SAAA,CAAU,IAAI,CAAA;AACd,EAAA,OAAO,MAAM,UAAA,EAAW;AAC1B;AAEO,SAAS,WAAA,CAAY,IAAmB,EAAA,EAA6C;AAC1F,EAAA,MAAM,KAAA,GAAQ,WAAW,EAAE,CAAA;AAC3B,EAAA,OAAO,SAAS,MAAM,KAAA,EAAM,CAAE,OAAA,CAAQ,EAAE,CAAC,CAAA;AAC3C;AAQO,SAAS,aAAA,CAAc,IAAmB,OAAA,EAA0C;AACzF,EAAA,MAAM,MAAA,GAAS,mBAAA,CAAoB,EAAA,EAAI,OAAO,CAAA;AAC9C,EAAA,SAAA,CAAU,MAAM,MAAA,CAAO,OAAA,EAAS,CAAA;AAChC,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA,QAAQ,OAAA,EAAS;AACf,MAAA,MAAM,MAAA,GAAS,MAAA,CAAO,WAAA,CAAY,OAAO,CAAA;AACzC,MAAA,SAAA,CAAU,MAAM,CAAA;AAAA,IAClB,CAAA;AAAA,IACA,MAAA,CAAO,IAAI,aAAA,EAAe;AACxB,MAAA,OAAO,CAAC,OAAA,KAAY;AAClB,QAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,EAAA,EAAI,SAAS,aAAa,CAAA;AAC3D,QAAA,SAAA,CAAU,MAAM,CAAA;AAAA,MAClB,CAAA;AAAA,IACF;AAAA,GACF;AACF","file":"angular.js","sourcesContent":["import { computed, DestroyRef, inject, type Signal, signal } from '@angular/core'\nimport { createWindowManager } from '../core/manager'\nimport type { ManagerOptions, ManagerState, WindowManager, WindowState } from '../core/types'\nimport { createDesktopBinder, type DesktopBinder } from '../dom/binder'\nimport type { DesktopOptions, WindowAttachOptions } from '../dom/shared'\n\nfunction onDestroy(dispose: () => void): void {\n  let destroyRef: DestroyRef | null = null\n  try {\n    destroyRef = inject(DestroyRef)\n  } catch {\n    destroyRef = null\n  }\n  destroyRef?.onDestroy(dispose)\n}\n\nexport function useWindowManager(options?: ManagerOptions): WindowManager {\n  const wm = createWindowManager(options)\n  onDestroy(() => wm.destroy())\n  return wm\n}\n\nexport function useWmState(wm: WindowManager): Signal<ManagerState> {\n  const state = signal(wm.getState())\n  const stop = wm.subscribe((next) => state.set(next))\n  onDestroy(stop)\n  return state.asReadonly()\n}\n\nexport function useWmWindow(wm: WindowManager, id: string): Signal<WindowState | undefined> {\n  const state = useWmState(wm)\n  return computed(() => state().windows[id])\n}\n\nexport interface AngularDesktop {\n  binder: DesktopBinder\n  desktop(element: HTMLElement): void\n  window(id: string, options?: WindowAttachOptions): (element: HTMLElement) => void\n}\n\nexport function createDesktop(wm: WindowManager, options?: DesktopOptions): AngularDesktop {\n  const binder = createDesktopBinder(wm, options)\n  onDestroy(() => binder.destroy())\n  return {\n    binder,\n    desktop(element) {\n      const unbind = binder.bindDesktop(element)\n      onDestroy(unbind)\n    },\n    window(id, windowOptions) {\n      return (element) => {\n        const unbind = binder.bindWindow(id, element, windowOptions)\n        onDestroy(unbind)\n      }\n    },\n  }\n}\n"]}
+{"version":3,"sources":["../src/adapters/angular.ts"],"names":[],"mappings":";;;;AAMA,SAAS,UAAU,OAAA,EAA2B;AAC5C,EAAA,IAAI,UAAA,GAAgC,IAAA;AACpC,EAAA,IAAI;AACF,IAAA,UAAA,GAAa,OAAO,UAAU,CAAA;AAAA,EAChC,CAAA,CAAA,MAAQ;AACN,IAAA,UAAA,GAAa,IAAA;AAAA,EACf;AACA,EAAA,UAAA,EAAY,UAAU,OAAO,CAAA;AAC/B;AAEO,SAAS,iBAAiB,OAAA,EAAyC;AACxE,EAAA,MAAM,EAAA,GAAK,oBAAoB,OAAO,CAAA;AACtC,EAAA,SAAA,CAAU,MAAM,EAAA,CAAG,OAAA,EAAS,CAAA;AAC5B,EAAA,OAAO,EAAA;AACT;AAEO,SAAS,WAAW,EAAA,EAAyC;AAClE,EAAA,MAAM,KAAA,GAAQ,MAAA,CAAO,EAAA,CAAG,QAAA,EAAU,CAAA;AAClC,EAAA,MAAM,IAAA,GAAO,GAAG,SAAA,CAAU,CAAC,SAAS,KAAA,CAAM,GAAA,CAAI,IAAI,CAAC,CAAA;AACnD,EAAA,SAAA,CAAU,IAAI,CAAA;AACd,EAAA,OAAO,MAAM,UAAA,EAAW;AAC1B;AAEO,SAAS,WAAA,CAAY,IAAmB,EAAA,EAA6C;AAC1F,EAAA,MAAM,KAAA,GAAQ,WAAW,EAAE,CAAA;AAC3B,EAAA,OAAO,SAAS,MAAM,KAAA,EAAM,CAAE,OAAA,CAAQ,EAAE,CAAC,CAAA;AAC3C;AAQO,SAAS,aAAA,CAAc,IAAmB,OAAA,EAA0C;AACzF,EAAA,MAAM,MAAA,GAAS,mBAAA,CAAoB,EAAA,EAAI,OAAO,CAAA;AAC9C,EAAA,SAAA,CAAU,MAAM,MAAA,CAAO,OAAA,EAAS,CAAA;AAChC,EAAA,OAAO;AAAA,IACL,MAAA;AAAA,IACA,QAAQ,OAAA,EAAS;AACf,MAAA,MAAM,MAAA,GAAS,MAAA,CAAO,WAAA,CAAY,OAAO,CAAA;AACzC,MAAA,SAAA,CAAU,MAAM,CAAA;AAAA,IAClB,CAAA;AAAA,IACA,MAAA,CAAO,IAAI,aAAA,EAAe;AACxB,MAAA,OAAO,CAAC,OAAA,KAAY;AAClB,QAAA,MAAM,MAAA,GAAS,MAAA,CAAO,UAAA,CAAW,EAAA,EAAI,SAAS,aAAa,CAAA;AAC3D,QAAA,SAAA,CAAU,MAAM,CAAA;AAAA,MAClB,CAAA;AAAA,IACF;AAAA,GACF;AACF","file":"angular.js","sourcesContent":["import { computed, DestroyRef, inject, type Signal, signal } from '@angular/core'\nimport { createWindowManager } from '../core/manager'\nimport type { ManagerOptions, ManagerState, WindowManager, WindowState } from '../core/types'\nimport { createDesktopBinder, type DesktopBinder } from '../dom/binder'\nimport type { DesktopOptions, WindowAttachOptions } from '../dom/shared'\n\nfunction onDestroy(dispose: () => void): void {\n  let destroyRef: DestroyRef | null = null\n  try {\n    destroyRef = inject(DestroyRef)\n  } catch {\n    destroyRef = null\n  }\n  destroyRef?.onDestroy(dispose)\n}\n\nexport function useWindowManager(options?: ManagerOptions): WindowManager {\n  const wm = createWindowManager(options)\n  onDestroy(() => wm.destroy())\n  return wm\n}\n\nexport function useWmState(wm: WindowManager): Signal<ManagerState> {\n  const state = signal(wm.getState())\n  const stop = wm.subscribe((next) => state.set(next))\n  onDestroy(stop)\n  return state.asReadonly()\n}\n\nexport function useWmWindow(wm: WindowManager, id: string): Signal<WindowState | undefined> {\n  const state = useWmState(wm)\n  return computed(() => state().windows[id])\n}\n\nexport interface AngularDesktop {\n  binder: DesktopBinder\n  desktop(element: HTMLElement): void\n  window(id: string, options?: WindowAttachOptions): (element: HTMLElement) => void\n}\n\nexport function createDesktop(wm: WindowManager, options?: DesktopOptions): AngularDesktop {\n  const binder = createDesktopBinder(wm, options)\n  onDestroy(() => binder.destroy())\n  return {\n    binder,\n    desktop(element) {\n      const unbind = binder.bindDesktop(element)\n      onDestroy(unbind)\n    },\n    window(id, windowOptions) {\n      return (element) => {\n        const unbind = binder.bindWindow(id, element, windowOptions)\n        onDestroy(unbind)\n      }\n    },\n  }\n}\n"]}

package/dist/binder-DGoj0xG1.d.cts

@@ -0,0 +1,13 @@
+import { W as WindowManager } from './types-jG2lHGcA.cjs';
+import { a as DesktopController, W as WindowAttachOptions, D as DesktopOptions } from './shared-DdGFz3oy.cjs';
+
+interface DesktopBinder {
+    wm: WindowManager;
+    controller(): DesktopController | null;
+    bindDesktop(element: HTMLElement): () => void;
+    bindWindow(id: string, element: HTMLElement, options?: WindowAttachOptions): () => void;
+    destroy(): void;
+}
+declare function createDesktopBinder(wm: WindowManager, options?: DesktopOptions): DesktopBinder;
+
+export { type DesktopBinder as D, createDesktopBinder as c };

package/dist/binder-Lo13iTVB.d.ts

@@ -0,0 +1,13 @@
+import { W as WindowManager } from './types-jG2lHGcA.js';
+import { a as DesktopController, W as WindowAttachOptions, D as DesktopOptions } from './shared-BoHXlPCu.js';
+
+interface DesktopBinder {
+    wm: WindowManager;
+    controller(): DesktopController | null;
+    bindDesktop(element: HTMLElement): () => void;
+    bindWindow(id: string, element: HTMLElement, options?: WindowAttachOptions): () => void;
+    destroy(): void;
+}
+declare function createDesktopBinder(wm: WindowManager, options?: DesktopOptions): DesktopBinder;
+
+export { type DesktopBinder as D, createDesktopBinder as c };

package/dist/chrome.cjs

@@ -0,0 +1,122 @@
+'use strict';
+
+// src/plugins/chrome/messages.ts
+var chromeMessages = {
+  minimize: "Minimize",
+  maximize: "Maximize",
+  close: "Close"
+};
+var chromeMessagesRu = {
+  minimize: "\u0421\u0432\u0435\u0440\u043D\u0443\u0442\u044C",
+  maximize: "\u0420\u0430\u0437\u0432\u0435\u0440\u043D\u0443\u0442\u044C",
+  close: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C"
+};
+
+// src/plugins/chrome/template.ts
+var ESCAPES = {
+  "&": "&",
+  "<": "&lt;",
+  ">": "&gt;",
+  '"': "&quot;",
+  "'": "&#39;"
+};
+function escapeHtml(value) {
+  return value.replace(/[&<>"']/g, (char) => ESCAPES[char]);
+}
+function compileTemplate(template) {
+  const parts = template.split(/\{\{\s*([a-z]+)\s*\}\}/i);
+  return (values) => parts.map((part, index) => index % 2 === 0 ? part : escapeHtml(values[part] ?? "")).join("");
+}
+
+// src/plugins/chrome/index.ts
+var SLOT = "[data-wm-content]";
+var SLOT_PATTERN = /data-wm-content\b/g;
+var BAD_SLOT_COUNT = "wmkit: a skin template needs exactly one [data-wm-content]";
+var BAD_STRUCTURE = "wmkit: a skin template needs a single root element that holds its [data-wm-content]";
+var UNSCOPED_STYLES = "wmkit: a skin with styles needs a name to scope them to";
+function valuesOf(win) {
+  const variant = win.meta.variant;
+  return {
+    id: win.id,
+    title: win.title,
+    stage: win.stage,
+    layer: win.layer,
+    workspace: String(win.workspace),
+    variant: typeof variant === "string" ? variant : ""
+  };
+}
+function injectStyles(doc, name, styles) {
+  if (doc.head.querySelector(`style[data-wm-skin-styles="${name}"]`)) return;
+  const tag = doc.createElement("style");
+  tag.dataset.wmSkinStyles = name;
+  tag.textContent = styles;
+  doc.head.append(tag);
+}
+function skin(spec) {
+  if ((spec.template.match(SLOT_PATTERN) ?? []).length !== 1) throw new Error(BAD_SLOT_COUNT);
+  if (spec.styles !== void 0 && spec.name === void 0) throw new Error(UNSCOPED_STYLES);
+  const render = compileTemplate(spec.template);
+  const sheets = /* @__PURE__ */ new WeakMap();
+  function adopt(root, doc, css) {
+    if (typeof CSSStyleSheet.prototype.replaceSync !== "function") {
+      const tag = doc.createElement("style");
+      tag.textContent = css;
+      root.prepend(tag);
+      return;
+    }
+    let sheet = sheets.get(doc);
+    if (!sheet) {
+      sheet = new CSSStyleSheet();
+      sheet.replaceSync(css);
+      sheets.set(doc, sheet);
+    }
+    root.adoptedStyleSheets = [...root.adoptedStyleSheets, sheet];
+  }
+  return ({ doc, window: win }) => {
+    const holder = doc.createElement("template");
+    holder.innerHTML = render(valuesOf(win));
+    const built = holder.content.firstElementChild;
+    const slot = built === null ? null : built.matches(SLOT) ? built : built.querySelector(SLOT);
+    if (built === null || slot === null) throw new Error(BAD_STRUCTURE);
+    if (spec.shadow !== true) {
+      if (spec.name !== void 0) built.dataset.wmSkin = spec.name;
+      if (spec.styles !== void 0) injectStyles(doc, spec.name, spec.styles);
+      return { element: built, content: slot };
+    }
+    const element = doc.createElement("div");
+    if (spec.name !== void 0) element.dataset.wmSkin = spec.name;
+    const root = element.attachShadow({ mode: "open" });
+    const projection = doc.createElement("slot");
+    if (slot === built) root.append(projection);
+    else {
+      slot.replaceWith(projection);
+      root.append(...built.childNodes);
+    }
+    if (spec.styles !== void 0) adopt(root, doc, spec.styles);
+    const content = doc.createElement("div");
+    content.dataset.wmContent = "";
+    element.append(content);
+    return { element, content };
+  };
+}
+function windowChrome(messages = chromeMessages) {
+  return skin({
+    name: "wmkit",
+    template: `<section><header data-wm-drag><span data-wm-title>{{title}}</span><span data-wm-controls><button type="button" data-wm-minimize aria-label="${messages.minimize}"></button><button type="button" data-wm-maximize aria-label="${messages.maximize}"></button><button type="button" data-wm-close aria-label="${messages.close}"></button></span></header><div data-wm-content></div></section>`
+  });
+}
+var defaultSkin = windowChrome();
+var barebones = skin({
+  name: "barebones",
+  template: "<section><header data-wm-drag><span data-wm-title>{{title}}</span></header><div data-wm-content></div></section>"
+});
+
+exports.barebones = barebones;
+exports.chromeMessages = chromeMessages;
+exports.chromeMessagesRu = chromeMessagesRu;
+exports.compileTemplate = compileTemplate;
+exports.defaultSkin = defaultSkin;
+exports.skin = skin;
+exports.windowChrome = windowChrome;
+//# sourceMappingURL=chrome.cjs.map
+//# sourceMappingURL=chrome.cjs.map

package/dist/chrome.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/plugins/chrome/messages.ts","../src/plugins/chrome/template.ts","../src/plugins/chrome/index.ts"],"names":[],"mappings":";;;AAMO,IAAM,cAAA,GAAiC;AAAA,EAC5C,QAAA,EAAU,UAAA;AAAA,EACV,QAAA,EAAU,UAAA;AAAA,EACV,KAAA,EAAO;AACT;AAEO,IAAM,gBAAA,GAAmC;AAAA,EAC9C,QAAA,EAAU,kDAAA;AAAA,EACV,QAAA,EAAU,8DAAA;AAAA,EACV,KAAA,EAAO;AACT;;;AChBA,IAAM,OAAA,GAAkC;AAAA,EACtC,GAAA,EAAK,OAAA;AAAA,EACL,GAAA,EAAK,MAAA;AAAA,EACL,GAAA,EAAK,MAAA;AAAA,EACL,GAAA,EAAK,QAAA;AAAA,EACL,GAAA,EAAK;AACP,CAAA;AAEA,SAAS,WAAW,KAAA,EAAuB;AACzC,EAAA,OAAO,MAAM,OAAA,CAAQ,UAAA,EAAY,CAAC,IAAA,KAAS,OAAA,CAAQ,IAAI,CAAW,CAAA;AACpE;AAEO,SAAS,gBAAgB,QAAA,EAA8D;AAC5F,EAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,KAAA,CAAM,yBAAyB,CAAA;AACtD,EAAA,OAAO,CAAC,MAAA,KACN,KAAA,CAAM,IAAI,CAAC,IAAA,EAAM,UAAW,KAAA,GAAQ,CAAA,KAAM,IAAI,IAAA,GAAO,UAAA,CAAW,OAAO,IAAI,CAAA,IAAK,EAAE,CAAE,CAAA,CAAE,KAAK,EAAE,CAAA;AACjG;;;ACAA,IAAM,IAAA,GAAO,mBAAA;AACb,IAAM,YAAA,GAAe,oBAAA;AAErB,IAAM,cAAA,GAAiB,4DAAA;AACvB,IAAM,aAAA,GACJ,qFAAA;AACF,IAAM,eAAA,GAAkB,yDAAA;AAExB,SAAS,SAAS,GAAA,EAA0C;AAC1D,EAAA,MAAM,OAAA,GAAU,IAAI,IAAA,CAAK,OAAA;AACzB,EAAA,OAAO;AAAA,IACL,IAAI,GAAA,CAAI,EAAA;AAAA,IACR,OAAO,GAAA,CAAI,KAAA;AAAA,IACX,OAAO,GAAA,CAAI,KAAA;AAAA,IACX,OAAO,GAAA,CAAI,KAAA;AAAA,IACX,SAAA,EAAW,MAAA,CAAO,GAAA,CAAI,SAAS,CAAA;AAAA,IAC/B,OAAA,EAAS,OAAO,OAAA,KAAY,QAAA,GAAW,OAAA,GAAU;AAAA,GACnD;AACF;AAEA,SAAS,YAAA,CAAa,GAAA,EAAe,IAAA,EAAc,MAAA,EAAsB;AACvE,EAAA,IAAI,IAAI,IAAA,CAAK,aAAA,CAAc,CAAA,2BAAA,EAA8B,IAAI,IAAI,CAAA,EAAG;AACpE,EAAA,MAAM,GAAA,GAAM,GAAA,CAAI,aAAA,CAAc,OAAO,CAAA;AACrC,EAAA,GAAA,CAAI,QAAQ,YAAA,GAAe,IAAA;AAC3B,EAAA,GAAA,CAAI,WAAA,GAAc,MAAA;AAClB,EAAA,GAAA,CAAI,IAAA,CAAK,OAAO,GAAG,CAAA;AACrB;AAEO,SAAS,KAAK,IAAA,EAA4B;AAC/C,EAAA,IAAA,CAAK,IAAA,CAAK,QAAA,CAAS,KAAA,CAAM,YAAY,CAAA,IAAK,EAAC,EAAG,MAAA,KAAW,CAAA,EAAG,MAAM,IAAI,KAAA,CAAM,cAAc,CAAA;AAC1F,EAAA,IAAI,IAAA,CAAK,WAAW,MAAA,IAAa,IAAA,CAAK,SAAS,MAAA,EAAW,MAAM,IAAI,KAAA,CAAM,eAAe,CAAA;AACzF,EAAA,MAAM,MAAA,GAAS,eAAA,CAAgB,IAAA,CAAK,QAAQ,CAAA;AAC5C,EAAA,MAAM,MAAA,uBAAa,OAAA,EAAiC;AAEpD,EAAA,SAAS,KAAA,CAAM,IAAA,EAAkB,GAAA,EAAe,GAAA,EAAmB;AACjE,IAAA,IAAI,OAAO,aAAA,CAAc,SAAA,CAAU,WAAA,KAAgB,UAAA,EAAY;AAC7D,MAAA,MAAM,GAAA,GAAM,GAAA,CAAI,aAAA,CAAc,OAAO,CAAA;AACrC,MAAA,GAAA,CAAI,WAAA,GAAc,GAAA;AAClB,MAAA,IAAA,CAAK,QAAQ,GAAG,CAAA;AAChB,MAAA;AAAA,IACF;AACA,IAAA,IAAI,KAAA,GAAQ,MAAA,CAAO,GAAA,CAAI,GAAG,CAAA;AAC1B,IAAA,IAAI,CAAC,KAAA,EAAO;AACV,MAAA,KAAA,GAAQ,IAAI,aAAA,EAAc;AAC1B,MAAA,KAAA,CAAM,YAAY,GAAG,CAAA;AACrB,MAAA,MAAA,CAAO,GAAA,CAAI,KAAK,KAAK,CAAA;AAAA,IACvB;AACA,IAAA,IAAA,CAAK,kBAAA,GAAqB,CAAC,GAAG,IAAA,CAAK,oBAAoB,KAAK,CAAA;AAAA,EAC9D;AAEA,EAAA,OAAO,CAAC,EAAE,GAAA,EAAK,MAAA,EAAQ,KAAI,KAAiB;AAC1C,IAAA,MAAM,MAAA,GAAS,GAAA,CAAI,aAAA,CAAc,UAAU,CAAA;AAC3C,IAAA,MAAA,CAAO,SAAA,GAAY,MAAA,CAAO,QAAA,CAAS,GAAG,CAAC,CAAA;AACvC,IAAA,MAAM,KAAA,GAAQ,OAAO,OAAA,CAAQ,iBAAA;AAC7B,IAAA,MAAM,IAAA,GACJ,KAAA,KAAU,IAAA,GAAO,IAAA,GAAO,KAAA,CAAM,OAAA,CAAQ,IAAI,CAAA,GAAI,KAAA,GAAQ,KAAA,CAAM,aAAA,CAA2B,IAAI,CAAA;AAC7F,IAAA,IAAI,UAAU,IAAA,IAAQ,IAAA,KAAS,MAAM,MAAM,IAAI,MAAM,aAAa,CAAA;AAElE,IAAA,IAAI,IAAA,CAAK,WAAW,IAAA,EAAM;AACxB,MAAA,IAAI,KAAK,IAAA,KAAS,MAAA,EAAW,KAAA,CAAM,OAAA,CAAQ,SAAS,IAAA,CAAK,IAAA;AACzD,MAAA,IAAI,IAAA,CAAK,WAAW,MAAA,EAAW,YAAA,CAAa,KAAK,IAAA,CAAK,IAAA,EAAgB,KAAK,MAAM,CAAA;AACjF,MAAA,OAAO,EAAE,OAAA,EAAS,KAAA,EAAO,OAAA,EAAS,IAAA,EAAK;AAAA,IACzC;AAEA,IAAA,MAAM,OAAA,GAAU,GAAA,CAAI,aAAA,CAAc,KAAK,CAAA;AACvC,IAAA,IAAI,KAAK,IAAA,KAAS,MAAA,EAAW,OAAA,CAAQ,OAAA,CAAQ,SAAS,IAAA,CAAK,IAAA;AAC3D,IAAA,MAAM,OAAO,OAAA,CAAQ,YAAA,CAAa,EAAE,IAAA,EAAM,QAAQ,CAAA;AAClD,IAAA,MAAM,UAAA,GAAa,GAAA,CAAI,aAAA,CAAc,MAAM,CAAA;AAC3C,IAAA,IAAI,IAAA,KAAS,KAAA,EAAO,IAAA,CAAK,MAAA,CAAO,UAAU,CAAA;AAAA,SACrC;AACH,MAAA,IAAA,CAAK,YAAY,UAAU,CAAA;AAC3B,MAAA,IAAA,CAAK,MAAA,CAAO,GAAG,KAAA,CAAM,UAAU,CAAA;AAAA,IACjC;AACA,IAAA,IAAI,KAAK,MAAA,KAAW,MAAA,QAAiB,IAAA,EAAM,GAAA,EAAK,KAAK,MAAM,CAAA;AAC3D,IAAA,MAAM,OAAA,GAAU,GAAA,CAAI,aAAA,CAAc,KAAK,CAAA;AACvC,IAAA,OAAA,CAAQ,QAAQ,SAAA,GAAY,EAAA;AAC5B,IAAA,OAAA,CAAQ,OAAO,OAAO,CAAA;AACtB,IAAA,OAAO,EAAE,SAAS,OAAA,EAAQ;AAAA,EAC5B,CAAA;AACF;AAEO,SAAS,YAAA,CAAa,WAA2B,cAAA,EAA4B;AAClF,EAAA,OAAO,IAAA,CAAK;AAAA,IACV,IAAA,EAAM,OAAA;AAAA,IACN,QAAA,EACE,+IAIsD,QAAA,CAAS,QAAQ,iEACjB,QAAA,CAAS,QAAQ,CAAA,2DAAA,EACpB,QAAA,CAAS,KAAK,CAAA,gEAAA;AAAA,GAKpE,CAAA;AACH;AAEO,IAAM,cAA0B,YAAA;AAEhC,IAAM,YAAwB,IAAA,CAAK;AAAA,EACxC,IAAA,EAAM,WAAA;AAAA,EACN,QAAA,EACE;AAIJ,CAAC","file":"chrome.cjs","sourcesContent":["export interface ChromeMessages {\n  minimize: string\n  maximize: string\n  close: string\n}\n\nexport const chromeMessages: ChromeMessages = {\n  minimize: 'Minimize',\n  maximize: 'Maximize',\n  close: 'Close',\n}\n\nexport const chromeMessagesRu: ChromeMessages = {\n  minimize: 'Свернуть',\n  maximize: 'Развернуть',\n  close: 'Закрыть',\n}\n","const ESCAPES: Record<string, string> = {\n  '&': '&amp;',\n  '<': '&lt;',\n  '>': '&gt;',\n  '\"': '&quot;',\n  \"'\": '&#39;',\n}\n\nfunction escapeHtml(value: string): string {\n  return value.replace(/[&<>\"']/g, (char) => ESCAPES[char] as string)\n}\n\nexport function compileTemplate(template: string): (values: Record<string, string>) => string {\n  const parts = template.split(/\\{\\{\\s*([a-z]+)\\s*\\}\\}/i)\n  return (values) =>\n    parts.map((part, index) => (index % 2 === 0 ? part : escapeHtml(values[part] ?? ''))).join('')\n}\n","import type { WindowState } from '../../core/types'\nimport type { SkinMount, WindowSkin } from '../../dom/shared'\nimport { type ChromeMessages, chromeMessages } from './messages'\nimport { compileTemplate } from './template'\n\nexport type { ChromeMessages } from './messages'\nexport { chromeMessages, chromeMessagesRu } from './messages'\nexport { compileTemplate } from './template'\n\nexport interface SkinSpec {\n  template: string\n  styles?: string\n  shadow?: boolean\n  name?: string\n}\n\nconst SLOT = '[data-wm-content]'\nconst SLOT_PATTERN = /data-wm-content\\b/g\n\nconst BAD_SLOT_COUNT = 'wmkit: a skin template needs exactly one [data-wm-content]'\nconst BAD_STRUCTURE =\n  'wmkit: a skin template needs a single root element that holds its [data-wm-content]'\nconst UNSCOPED_STYLES = 'wmkit: a skin with styles needs a name to scope them to'\n\nfunction valuesOf(win: WindowState): Record<string, string> {\n  const variant = win.meta.variant\n  return {\n    id: win.id,\n    title: win.title,\n    stage: win.stage,\n    layer: win.layer,\n    workspace: String(win.workspace),\n    variant: typeof variant === 'string' ? variant : '',\n  }\n}\n\nfunction injectStyles(doc: Document, name: string, styles: string): void {\n  if (doc.head.querySelector(`style[data-wm-skin-styles=\"${name}\"]`)) return\n  const tag = doc.createElement('style')\n  tag.dataset.wmSkinStyles = name\n  tag.textContent = styles\n  doc.head.append(tag)\n}\n\nexport function skin(spec: SkinSpec): WindowSkin {\n  if ((spec.template.match(SLOT_PATTERN) ?? []).length !== 1) throw new Error(BAD_SLOT_COUNT)\n  if (spec.styles !== undefined && spec.name === undefined) throw new Error(UNSCOPED_STYLES)\n  const render = compileTemplate(spec.template)\n  const sheets = new WeakMap<Document, CSSStyleSheet>()\n\n  function adopt(root: ShadowRoot, doc: Document, css: string): void {\n    if (typeof CSSStyleSheet.prototype.replaceSync !== 'function') {\n      const tag = doc.createElement('style')\n      tag.textContent = css\n      root.prepend(tag)\n      return\n    }\n    let sheet = sheets.get(doc)\n    if (!sheet) {\n      sheet = new CSSStyleSheet()\n      sheet.replaceSync(css)\n      sheets.set(doc, sheet)\n    }\n    root.adoptedStyleSheets = [...root.adoptedStyleSheets, sheet]\n  }\n\n  return ({ doc, window: win }): SkinMount => {\n    const holder = doc.createElement('template')\n    holder.innerHTML = render(valuesOf(win))\n    const built = holder.content.firstElementChild as HTMLElement | null\n    const slot =\n      built === null ? null : built.matches(SLOT) ? built : built.querySelector<HTMLElement>(SLOT)\n    if (built === null || slot === null) throw new Error(BAD_STRUCTURE)\n\n    if (spec.shadow !== true) {\n      if (spec.name !== undefined) built.dataset.wmSkin = spec.name\n      if (spec.styles !== undefined) injectStyles(doc, spec.name as string, spec.styles)\n      return { element: built, content: slot }\n    }\n\n    const element = doc.createElement('div')\n    if (spec.name !== undefined) element.dataset.wmSkin = spec.name\n    const root = element.attachShadow({ mode: 'open' })\n    const projection = doc.createElement('slot')\n    if (slot === built) root.append(projection)\n    else {\n      slot.replaceWith(projection)\n      root.append(...built.childNodes)\n    }\n    if (spec.styles !== undefined) adopt(root, doc, spec.styles)\n    const content = doc.createElement('div')\n    content.dataset.wmContent = ''\n    element.append(content)\n    return { element, content }\n  }\n}\n\nexport function windowChrome(messages: ChromeMessages = chromeMessages): WindowSkin {\n  return skin({\n    name: 'wmkit',\n    template:\n      '<section>' +\n      '<header data-wm-drag>' +\n      '<span data-wm-title>{{title}}</span>' +\n      '<span data-wm-controls>' +\n      `<button type=\"button\" data-wm-minimize aria-label=\"${messages.minimize}\"></button>` +\n      `<button type=\"button\" data-wm-maximize aria-label=\"${messages.maximize}\"></button>` +\n      `<button type=\"button\" data-wm-close aria-label=\"${messages.close}\"></button>` +\n      '</span>' +\n      '</header>' +\n      '<div data-wm-content></div>' +\n      '</section>',\n  })\n}\n\nexport const defaultSkin: WindowSkin = windowChrome()\n\nexport const barebones: WindowSkin = skin({\n  name: 'barebones',\n  template:\n    '<section>' +\n    '<header data-wm-drag><span data-wm-title>{{title}}</span></header>' +\n    '<div data-wm-content></div>' +\n    '</section>',\n})\n"]}

package/dist/chrome.d.cts

@@ -0,0 +1,25 @@
+import { l as WindowSkin } from './shared-DdGFz3oy.cjs';
+import './types-jG2lHGcA.cjs';
+
+interface ChromeMessages {
+    minimize: string;
+    maximize: string;
+    close: string;
+}
+declare const chromeMessages: ChromeMessages;
+declare const chromeMessagesRu: ChromeMessages;
+
+declare function compileTemplate(template: string): (values: Record<string, string>) => string;
+
+interface SkinSpec {
+    template: string;
+    styles?: string;
+    shadow?: boolean;
+    name?: string;
+}
+declare function skin(spec: SkinSpec): WindowSkin;
+declare function windowChrome(messages?: ChromeMessages): WindowSkin;
+declare const defaultSkin: WindowSkin;
+declare const barebones: WindowSkin;
+
+export { type ChromeMessages, type SkinSpec, barebones, chromeMessages, chromeMessagesRu, compileTemplate, defaultSkin, skin, windowChrome };

package/dist/chrome.d.ts

@@ -0,0 +1,25 @@
+import { l as WindowSkin } from './shared-BoHXlPCu.js';
+import './types-jG2lHGcA.js';
+
+interface ChromeMessages {
+    minimize: string;
+    maximize: string;
+    close: string;
+}
+declare const chromeMessages: ChromeMessages;
+declare const chromeMessagesRu: ChromeMessages;
+
+declare function compileTemplate(template: string): (values: Record<string, string>) => string;
+
+interface SkinSpec {
+    template: string;
+    styles?: string;
+    shadow?: boolean;
+    name?: string;
+}
+declare function skin(spec: SkinSpec): WindowSkin;
+declare function windowChrome(messages?: ChromeMessages): WindowSkin;
+declare const defaultSkin: WindowSkin;
+declare const barebones: WindowSkin;
+
+export { type ChromeMessages, type SkinSpec, barebones, chromeMessages, chromeMessagesRu, compileTemplate, defaultSkin, skin, windowChrome };

package/dist/chrome.js

@@ -0,0 +1,114 @@
+// src/plugins/chrome/messages.ts
+var chromeMessages = {
+  minimize: "Minimize",
+  maximize: "Maximize",
+  close: "Close"
+};
+var chromeMessagesRu = {
+  minimize: "\u0421\u0432\u0435\u0440\u043D\u0443\u0442\u044C",
+  maximize: "\u0420\u0430\u0437\u0432\u0435\u0440\u043D\u0443\u0442\u044C",
+  close: "\u0417\u0430\u043A\u0440\u044B\u0442\u044C"
+};
+
+// src/plugins/chrome/template.ts
+var ESCAPES = {
+  "&": "&",
+  "<": "&lt;",
+  ">": "&gt;",
+  '"': "&quot;",
+  "'": "&#39;"
+};
+function escapeHtml(value) {
+  return value.replace(/[&<>"']/g, (char) => ESCAPES[char]);
+}
+function compileTemplate(template) {
+  const parts = template.split(/\{\{\s*([a-z]+)\s*\}\}/i);
+  return (values) => parts.map((part, index) => index % 2 === 0 ? part : escapeHtml(values[part] ?? "")).join("");
+}
+
+// src/plugins/chrome/index.ts
+var SLOT = "[data-wm-content]";
+var SLOT_PATTERN = /data-wm-content\b/g;
+var BAD_SLOT_COUNT = "wmkit: a skin template needs exactly one [data-wm-content]";
+var BAD_STRUCTURE = "wmkit: a skin template needs a single root element that holds its [data-wm-content]";
+var UNSCOPED_STYLES = "wmkit: a skin with styles needs a name to scope them to";
+function valuesOf(win) {
+  const variant = win.meta.variant;
+  return {
+    id: win.id,
+    title: win.title,
+    stage: win.stage,
+    layer: win.layer,
+    workspace: String(win.workspace),
+    variant: typeof variant === "string" ? variant : ""
+  };
+}
+function injectStyles(doc, name, styles) {
+  if (doc.head.querySelector(`style[data-wm-skin-styles="${name}"]`)) return;
+  const tag = doc.createElement("style");
+  tag.dataset.wmSkinStyles = name;
+  tag.textContent = styles;
+  doc.head.append(tag);
+}
+function skin(spec) {
+  if ((spec.template.match(SLOT_PATTERN) ?? []).length !== 1) throw new Error(BAD_SLOT_COUNT);
+  if (spec.styles !== void 0 && spec.name === void 0) throw new Error(UNSCOPED_STYLES);
+  const render = compileTemplate(spec.template);
+  const sheets = /* @__PURE__ */ new WeakMap();
+  function adopt(root, doc, css) {
+    if (typeof CSSStyleSheet.prototype.replaceSync !== "function") {
+      const tag = doc.createElement("style");
+      tag.textContent = css;
+      root.prepend(tag);
+      return;
+    }
+    let sheet = sheets.get(doc);
+    if (!sheet) {
+      sheet = new CSSStyleSheet();
+      sheet.replaceSync(css);
+      sheets.set(doc, sheet);
+    }
+    root.adoptedStyleSheets = [...root.adoptedStyleSheets, sheet];
+  }
+  return ({ doc, window: win }) => {
+    const holder = doc.createElement("template");
+    holder.innerHTML = render(valuesOf(win));
+    const built = holder.content.firstElementChild;
+    const slot = built === null ? null : built.matches(SLOT) ? built : built.querySelector(SLOT);
+    if (built === null || slot === null) throw new Error(BAD_STRUCTURE);
+    if (spec.shadow !== true) {
+      if (spec.name !== void 0) built.dataset.wmSkin = spec.name;
+      if (spec.styles !== void 0) injectStyles(doc, spec.name, spec.styles);
+      return { element: built, content: slot };
+    }
+    const element = doc.createElement("div");
+    if (spec.name !== void 0) element.dataset.wmSkin = spec.name;
+    const root = element.attachShadow({ mode: "open" });
+    const projection = doc.createElement("slot");
+    if (slot === built) root.append(projection);
+    else {
+      slot.replaceWith(projection);
+      root.append(...built.childNodes);
+    }
+    if (spec.styles !== void 0) adopt(root, doc, spec.styles);
+    const content = doc.createElement("div");
+    content.dataset.wmContent = "";
+    element.append(content);
+    return { element, content };
+  };
+}
+function windowChrome(messages = chromeMessages) {
+  return skin({
+    name: "wmkit",
+    template: `<section><header data-wm-drag><span data-wm-title>{{title}}</span><span data-wm-controls><button type="button" data-wm-minimize aria-label="${messages.minimize}"></button><button type="button" data-wm-maximize aria-label="${messages.maximize}"></button><button type="button" data-wm-close aria-label="${messages.close}"></button></span></header><div data-wm-content></div></section>`
+  });
+}
+var defaultSkin = windowChrome();
+var barebones = skin({
+  name: "barebones",
+  template: "<section><header data-wm-drag><span data-wm-title>{{title}}</span></header><div data-wm-content></div></section>"
+});
+
+export { barebones, chromeMessages, chromeMessagesRu, compileTemplate, defaultSkin, skin, windowChrome };
+//# sourceMappingURL=chrome.js.map
+//# sourceMappingURL=chrome.js.map