@owdproject/nuxt-theme-paper 0.0.0-stage → 4.0.0-alpha.3

package/dist/runtime/assets/styles/partials/window-chrome.css

@@ -0,0 +1,45 @@
+/*
+ * Window titlebar chrome for Paper theme windows.
+ * Layout/sizing lives in Vue components; colors and hover states here.
+ */
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav {
+  min-height: var(--paper-nav-height);
+  padding: 0 0.5rem;
+  border-bottom: 1px solid var(--paper-border-window);
+  background: var(--paper-surface);
+  color: var(--paper-text);
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__btn-group--append {
+  align-self: stretch;
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__btn-group--append-inner {
+  display: flex;
+  align-items: stretch;
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__button {
+  color: var(--paper-text-secondary);
+  transition: background-color 0.12s ease, color 0.12s ease;
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__button:hover {
+  background: var(--paper-bg);
+  color: var(--paper-text);
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__button:active {
+  background: color-mix(in srgb, var(--paper-text) 8%, var(--paper-bg));
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__button--close:hover {
+  background: color-mix(in srgb, #c0392b 88%, var(--paper-surface));
+  color: #fff;
+}
+.owd-desktop--paper .paper-window.owd-window.resizable-component .paper-window-nav .owd-window-nav__button--close:active {
+  background: color-mix(in srgb, #e74c3c 92%, var(--paper-surface));
+  color: #fff;
+}
+
+.owd-desktop--paper .owd-window.resizable-component:not(.paper-window) .owd-window-nav .owd-window-nav__button {
+  color: var(--paper-text-secondary);
+}
+.owd-desktop--paper .owd-window.resizable-component:not(.paper-window) .owd-window-nav .owd-window-nav__button:hover {
+  background: var(--paper-bg);
+  color: var(--paper-text);
+}

package/dist/runtime/assets/styles/partials/window.css

@@ -0,0 +1,30 @@
+/* Theme Window chrome lives in Window*.vue (scoped). Globals only for fallbacks. */
+.owd-desktop--paper .paper-window.owd-window.resizable-component {
+  overflow: hidden;
+}
+
+/* Apps that use DesktopWindow without theme <Window> (e.g. kit-fs explorer) */
+.owd-desktop--paper .owd-window.resizable-component:not(.paper-window) {
+  box-sizing: border-box;
+  overflow: hidden;
+  background: var(--paper-surface);
+  border: 1px solid var(--paper-border-window);
+  border-radius: var(--paper-radius);
+}
+
+.owd-desktop--paper .owd-window.resizable-component:not(.paper-window) .owd-window-nav {
+  min-height: var(--paper-nav-height);
+  padding: 0 0.625rem;
+  border-bottom: 1px solid var(--paper-border-window);
+  background: var(--paper-surface);
+  align-items: center;
+}
+
+.owd-desktop--paper .owd-window.resizable-component:not(.paper-window) .desktop-window__content {
+  background: var(--paper-surface);
+}
+
+.owd-desktop--paper .desktop-window__content--padded {
+  padding: 10px;
+  box-sizing: border-box;
+}

package/dist/runtime/components/ButtonWindowNav.d.vue.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    title?: string;
+    disabled?: boolean;
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/ButtonWindowNav.vue

@@ -0,0 +1,12 @@
+<script setup>
+defineProps({
+  title: { type: String, required: false },
+  disabled: { type: Boolean, required: false }
+});
+</script>
+
+<template>
+  <DesktopWindowNavButton :title="title" :disabled="disabled">
+    <slot />
+  </DesktopWindowNavButton>
+</template>

package/dist/runtime/components/ButtonWindowNav.vue.d.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    title?: string;
+    disabled?: boolean;
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Desktop.d.vue.ts

@@ -0,0 +1,13 @@
+declare var __VLS_23: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_23) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Desktop.vue

@@ -0,0 +1,21 @@
+<script setup>
+import { ref } from "vue";
+import PaperSystemBar from "./PaperSystemBar.vue";
+import PaperWindowSnapHints from "./PaperWindowSnapHints.vue";
+import { useDesktopWorkArea } from "@owdproject/nuxt/runtime/composables/useDesktopWorkArea";
+const shellStageRef = ref(null);
+useDesktopWorkArea(shellStageRef);
+</script>
+
+<template>
+  <DesktopCore v-bind="$props" class="owd-desktop owd-desktop--paper">
+    <PaperSystemBar />
+    <PaperWindowSnapHints />
+    <div ref="shellStageRef" class="paper-shell__stage">
+      <DesktopContent>
+        <slot />
+      </DesktopContent>
+      <DesktopCoreApplicationRender />
+    </div>
+  </DesktopCore>
+</template>

package/dist/runtime/components/Desktop.vue.d.ts

@@ -0,0 +1,13 @@
+declare var __VLS_23: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_23) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopContent.d.vue.ts

@@ -0,0 +1,13 @@
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopContent.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="paper-desktop__content">
+    <slot />
+  </div>
+</template>
+
+<style scoped>
+.paper-desktop__content{height:100%;overflow:hidden;position:relative;width:100%}
+</style>

package/dist/runtime/components/DesktopContent.vue.d.ts

@@ -0,0 +1,13 @@
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindow.d.vue.ts

@@ -0,0 +1,21 @@
+type __VLS_Props = {
+    window?: IWindowController;
+    content?: WindowContent;
+};
+declare var __VLS_17: {}, __VLS_20: {}, __VLS_28: {};
+type __VLS_Slots = {} & {
+    'nav-prepend'?: (props: typeof __VLS_17) => any;
+} & {
+    'nav-append'?: (props: typeof __VLS_20) => any;
+} & {
+    default?: (props: typeof __VLS_28) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindow.vue

@@ -0,0 +1,51 @@
+<script setup>
+import { computed, useAttrs } from "vue";
+import { useWindowDragHandlers } from "@owdproject/nuxt/runtime/composables/useWindowDragHandlers";
+const props = defineProps({
+  window: { type: null, required: false },
+  content: { type: null, required: false }
+});
+defineOptions({ inheritAttrs: false });
+const attrs = useAttrs();
+const windowRootClass = computed(() => {
+  return ["paper-window", attrs.class].filter(Boolean);
+});
+const windowRef = computed(
+  () => props.window ?? attrs.window
+);
+const contentRef = computed(
+  () => props.content ?? attrs.content
+);
+const { onDragStart, onDragEnd } = useWindowDragHandlers(
+  () => windowRef.value
+);
+</script>
+
+<template>
+  <DesktopCoreWindow
+    :window="windowRef"
+    :content="contentRef"
+    v-show="windowRef?.state?.active !== false"
+    :class="windowRootClass"
+    @drag:start="onDragStart"
+    @drag:end="onDragEnd"
+  >
+    <div class="paper-window__frame">
+      <DesktopWindowNav>
+        <template v-slot:prepend>
+          <slot name="nav-prepend" />
+        </template>
+        <template v-slot:append>
+          <slot name="nav-append" />
+        </template>
+      </DesktopWindowNav>
+      <DesktopWindowContent>
+        <slot />
+      </DesktopWindowContent>
+    </div>
+  </DesktopCoreWindow>
+</template>
+
+<style scoped>
+.paper-window{border-radius:var(--paper-radius);overflow:hidden}.paper-window__frame{background:var(--paper-surface);border:1px solid var(--paper-border-window);border-radius:var(--paper-radius);box-sizing:border-box;display:flex;flex-direction:column;height:100%;overflow:hidden}.paper-window :deep(.desktop-window__content){flex:1;min-height:0}
+</style>

package/dist/runtime/components/DesktopWindow.vue.d.ts

@@ -0,0 +1,21 @@
+type __VLS_Props = {
+    window?: IWindowController;
+    content?: WindowContent;
+};
+declare var __VLS_17: {}, __VLS_20: {}, __VLS_28: {};
+type __VLS_Slots = {} & {
+    'nav-prepend'?: (props: typeof __VLS_17) => any;
+} & {
+    'nav-append'?: (props: typeof __VLS_20) => any;
+} & {
+    default?: (props: typeof __VLS_28) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowContent.d.vue.ts

@@ -0,0 +1,13 @@
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowContent.vue

@@ -0,0 +1,31 @@
+<template>
+  <DesktopCoreWindowContent class="paper-window__body">
+    <div class="paper-window-body">
+      <slot />
+    </div>
+  </DesktopCoreWindowContent>
+</template>
+
+<style scoped>
+:deep(.desktop-window__content) {
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
+
+.paper-window__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow: auto;
+  background: var(--paper-surface);
+}
+
+.paper-window-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-height: 0;
+  height: 100%;
+}
+</style>

package/dist/runtime/components/DesktopWindowContent.vue.d.ts

@@ -0,0 +1,13 @@
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowIframe.d.vue.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    config?: WindowConfig;
+    window?: IWindowController;
+    src: string;
+};
+declare var __VLS_8: {}, __VLS_11: {};
+type __VLS_Slots = {} & {
+    'nav-prepend'?: (props: typeof __VLS_8) => any;
+} & {
+    'nav-append'?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowIframe.vue

@@ -0,0 +1,30 @@
+<script setup>
+const props = defineProps({
+  config: { type: null, required: false },
+  window: { type: null, required: false },
+  src: { type: String, required: true }
+});
+</script>
+
+<template>
+  <DesktopWindow v-bind="$props">
+    <template #nav-prepend>
+      <slot name="nav-prepend" />
+    </template>
+    <template #nav-append>
+      <slot name="nav-append" />
+    </template>
+    <iframe :src="src" />
+  </DesktopWindow>
+</template>
+
+<style scoped>
+iframe {
+  display: block;
+  flex: 1 1 auto;
+  min-height: 0;
+  border: 0;
+  width: 100%;
+  height: 100%;
+}
+</style>

package/dist/runtime/components/DesktopWindowIframe.vue.d.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    config?: WindowConfig;
+    window?: IWindowController;
+    src: string;
+};
+declare var __VLS_8: {}, __VLS_11: {};
+type __VLS_Slots = {} & {
+    'nav-prepend'?: (props: typeof __VLS_8) => any;
+} & {
+    'nav-append'?: (props: typeof __VLS_11) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowNav.d.vue.ts

@@ -0,0 +1,15 @@
+declare var __VLS_7: {}, __VLS_14: {};
+type __VLS_Slots = {} & {
+    prepend?: (props: typeof __VLS_7) => any;
+} & {
+    append?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowNav.vue

@@ -0,0 +1,113 @@
+<script setup>
+import { inject } from "vue";
+const windowController = inject("windowController");
+function onClose() {
+  if (!windowController?.instanced) return;
+  windowController.actions.destroy();
+}
+</script>
+
+<template>
+  <DesktopCoreWindowNav class="paper-window-nav">
+    <div
+      v-if="$slots.prepend"
+      class="owd-window-nav__btn-group owd-window-nav__btn-group--prepend"
+    >
+      <slot name="prepend" />
+    </div>
+
+    <div v-if="windowController?.windowTitle" class="paper-window-nav__title-container">
+      <Icon
+        v-if="windowController?.icon"
+        :name="windowController.icon"
+        class="paper-window-nav__icon"
+      />
+      <span class="paper-window-nav__title">
+        {{ windowController.windowTitle }}
+      </span>
+    </div>
+
+    <div class="desktop-window-nav__btn-group owd-window-nav__btn-group owd-window-nav__btn-group--append">
+      <div
+        v-if="$slots.append"
+        class="owd-window-nav__btn-group owd-window-nav__btn-group--append-inner"
+      >
+        <slot name="append" />
+      </div>
+
+      <DesktopWindowNavButton
+        v-if="!windowController?.instanced || windowController?.isDestroyable"
+        class="owd-window-nav__button--close"
+        title="Close"
+        @mousedown.stop
+        @click.stop="onClose"
+      >
+        <svg width="9.5" height="9.5" viewBox="0 0 12 12" aria-hidden="true">
+          <path
+            d="M1 1l10 10M11 1L1 11"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="1.6"
+            stroke-linecap="round"
+          />
+        </svg>
+      </DesktopWindowNavButton>
+    </div>
+  </DesktopCoreWindowNav>
+</template>
+
+<style scoped>
+.paper-window-nav {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 0.5rem;
+  flex-shrink: 0;
+  min-height: var(--paper-nav-height);
+}
+
+.paper-window-nav__title-container {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex: 1;
+  min-width: 0;
+}
+
+.paper-window-nav__icon {
+  width: 14px;
+  height: 14px;
+  flex-shrink: 0;
+  color: var(--paper-text-secondary);
+}
+
+.paper-window-nav__title {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  pointer-events: none;
+  font-size: 0.75rem;
+  font-weight: 500;
+  line-height: 1.2;
+  color: var(--paper-text);
+}
+
+.owd-window-nav__btn-group {
+  display: flex;
+  align-items: stretch;
+  gap: 4px;
+}
+
+.owd-window-nav__btn-group--append {
+  margin-left: auto;
+}
+
+.owd-window-nav__btn-group--append-inner {
+  display: flex;
+  align-items: stretch;
+  gap: 4px;
+  margin: 0;
+  padding: 0;
+  border: 0;
+}
+</style>

package/dist/runtime/components/DesktopWindowNav.vue.d.ts

@@ -0,0 +1,15 @@
+declare var __VLS_7: {}, __VLS_14: {};
+type __VLS_Slots = {} & {
+    prepend?: (props: typeof __VLS_7) => any;
+} & {
+    append?: (props: typeof __VLS_14) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowNavButton.d.vue.ts

@@ -0,0 +1,17 @@
+type __VLS_Props = {
+    title?: string;
+    disabled?: boolean;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/DesktopWindowNavButton.vue

@@ -0,0 +1,54 @@
+<script setup>
+defineProps({
+  title: { type: String, required: false },
+  disabled: { type: Boolean, required: false }
+});
+</script>
+
+<template>
+  <button
+    type="button"
+    class="owd-window-nav__button"
+    :title="title"
+    :aria-label="title"
+    :disabled="disabled"
+    @mousedown.stop
+  >
+    <slot />
+  </button>
+</template>
+
+<style scoped>
+@charset "UTF-8";
+/* Sizing only — colors/hover in window-chrome.scss */
+.owd-window-nav__button {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  box-sizing: border-box;
+  width: var(--paper-nav-button-size);
+  min-width: var(--paper-nav-button-size);
+  height: var(--paper-nav-button-size);
+  min-height: var(--paper-nav-button-size);
+  margin: 0;
+  padding: 0;
+  border: none;
+  border-radius: var(--paper-radius);
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+}
+.owd-window-nav__button:disabled {
+  opacity: 0.45;
+  cursor: default;
+  pointer-events: none;
+}
+.owd-window-nav__button :deep(.iconify),
+.owd-window-nav__button :deep(svg) {
+  width: 12px;
+  height: 12px;
+  pointer-events: none;
+}
+</style>