@stackonward/cli 1.3.3 → 1.5.0

package/dist/resources/components/nuxt/site-source/app/components/site/{MarketingHeader.vue → Header.vue}

@@ -1,35 +1,35 @@
 <script setup lang="ts">
-import type { MarketingNavigationItem } from "~/types/site-shell";
+import type { NavItem } from "~/navigation/types";
 
 const site = useSiteShell();
-const { marketingNav, primaryActionLabel, secondaryActionLabel } = useNavigation();
+const { items, primaryActionLabel, secondaryActionLabel } = useNavigation();
 const { t } = useI18n();
-const menuOpen = ref(false);
+const isMenuOpen = ref(false);
 
 function closeMenu(): void {
-  menuOpen.value = false;
+  isMenuOpen.value = false;
 }
 
-function hasChildren(item: MarketingNavigationItem): boolean {
+function hasChildren(item: NavItem): boolean {
   return Boolean(item.children?.length);
 }
 </script>
 
 <template>
-  <header class="marketing-header">
-    <div class="marketing-header__inner">
+  <header class="site-header">
+    <div class="site-header__inner">
       <SiteBrand />
 
-      <nav class="marketing-header__nav" :aria-label="t('navigation.primary')">
-        <template v-for="item in marketingNav" :key="item.label">
-          <details v-if="hasChildren(item)" class="marketing-nav-menu">
+      <nav class="site-header__nav" :aria-label="t('navigation.primary')">
+        <template v-for="item in items" :key="item.label">
+          <details v-if="hasChildren(item)" class="site-nav-menu">
             <summary>{{ item.label }}</summary>
-            <div class="marketing-nav-menu__panel">
+            <div class="site-nav-menu__panel">
               <NuxtLinkLocale
                 v-for="child in item.children"
                 :key="child.label"
                 :to="child.to || site.homePath"
-                class="marketing-nav-menu__item"
+                class="site-nav-menu__item"
               >
                 <span>{{ child.label }}</span>
                 <small v-if="child.description">{{ child.description }}</small>
@@ -38,23 +38,23 @@ function hasChildren(item: MarketingNavigationItem): boolean {
           </details>
           <a
             v-else-if="item.external"
-            class="marketing-nav-link"
+            class="site-nav-link"
             :href="item.to"
             target="_blank"
             rel="noopener noreferrer"
           >
             {{ item.label }}
           </a>
-          <NuxtLinkLocale v-else class="marketing-nav-link" :to="item.to || site.homePath">
+          <NuxtLinkLocale v-else class="site-nav-link" :to="item.to || site.homePath">
             {{ item.label }}
           </NuxtLinkLocale>
         </template>
       </nav>
 
-      <div class="marketing-header__actions">
-        <div class="marketing-header__preferences">
-          <ThemeSwitcher />
-          <LocaleSwitcher />
+      <div class="site-header__actions">
+        <div class="site-header__preferences">
+          <ThemeMenu />
+          <LocaleMenu />
         </div>
         <slot name="actions">
           <NuxtLinkLocale :to="site.secondaryActionPath" class="base-button base-button--secondary">
@@ -67,15 +67,15 @@ function hasChildren(item: MarketingNavigationItem): boolean {
         </slot>
         <button
           type="button"
-          class="icon-button marketing-header__menu-button"
-          :aria-expanded="menuOpen"
+          class="icon-button site-header__menu-button"
+          :aria-expanded="isMenuOpen"
           aria-controls="mobile-nav"
           :aria-label="t('navigation.toggle')"
-          @click="menuOpen = !menuOpen"
+          @click="isMenuOpen = !isMenuOpen"
         >
           <UIcon
-            :name="menuOpen ? 'i-lucide-x' : 'i-lucide-menu'"
-            class="marketing-header__menu-icon"
+            :name="isMenuOpen ? 'i-lucide-x' : 'i-lucide-menu'"
+            class="site-header__menu-icon"
           />
         </button>
       </div>
@@ -84,10 +84,10 @@ function hasChildren(item: MarketingNavigationItem): boolean {
     <nav
       id="mobile-nav"
       class="mobile-nav"
-      :class="{ 'mobile-nav--open': menuOpen }"
+      :class="{ 'mobile-nav--open': isMenuOpen }"
       :aria-label="t('navigation.mobilePrimary')"
     >
-      <template v-for="item in marketingNav" :key="item.label">
+      <template v-for="item in items" :key="item.label">
         <NuxtLinkLocale
           v-if="!hasChildren(item)"
           :to="item.to || site.homePath"
@@ -110,8 +110,8 @@ function hasChildren(item: MarketingNavigationItem): boolean {
         </details>
       </template>
       <div class="mobile-nav__preferences">
-        <ThemeSwitcher @changed="closeMenu" />
-        <LocaleSwitcher @changed="closeMenu" />
+        <ThemeMenu @select="closeMenu" />
+        <LocaleMenu @select="closeMenu" />
       </div>
     </nav>
   </header>

package/dist/resources/components/nuxt/site-source/app/components/site/Shell.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import BackToTop from "./BackToTop.vue";
+
+const LazyHeader = defineLazyHydrationComponent("idle", () => import("./Header.vue"));
+const LazyFooter = defineLazyHydrationComponent("visible", () => import("./Footer.vue"));
+</script>
+
+<template>
+  <div class="site-shell">
+    <slot name="header">
+      <LazyHeader :hydrate-on-idle="800" />
+    </slot>
+
+    <main id="site-content" class="site-shell__main">
+      <slot />
+    </main>
+
+    <slot name="footer">
+      <LazyFooter hydrate-on-visible />
+    </slot>
+
+    <div class="site-floating-stack">
+      <BackToTop />
+      <slot name="consent">
+        <ConsentBanner />
+      </slot>
+    </div>
+  </div>
+</template>

package/dist/resources/components/nuxt/site-source/app/components/{site/ThemeSwitcher.vue → theme/Menu.vue}

@@ -3,7 +3,7 @@ type ThemePreference = "system" | "light" | "dark";
 
 defineOptions({ inheritAttrs: false });
 
-const emit = defineEmits<{ changed: [] }>();
+const emit = defineEmits<{ select: [value: ThemePreference] }>();
 const colorMode = useColorMode();
 const { t } = useI18n();
 const dropdown = ref<HTMLDetailsElement | null>(null);
@@ -23,7 +23,7 @@ const current = computed(
 function selectTheme(value: ThemePreference): void {
   colorMode.preference = value;
   dropdown.value?.removeAttribute("open");
-  emit("changed");
+  emit("select", value);
 }
 
 function handleKeydown(event: KeyboardEvent): void {

package/dist/resources/components/nuxt/site-source/app/components/ui/{BaseButton.vue → Button.vue}

@@ -1,12 +1,5 @@
 <script setup lang="ts">
-type ButtonColor =
-  | "primary"
-  | "secondary"
-  | "success"
-  | "info"
-  | "warning"
-  | "error"
-  | "neutral";
+type ButtonColor = "primary" | "secondary" | "success" | "info" | "warning" | "error" | "neutral";
 type ButtonVariant = "solid" | "outline" | "soft" | "subtle" | "ghost" | "link";
 type ButtonSize = "xs" | "sm" | "md" | "lg" | "xl";
 

package/dist/resources/components/nuxt/site-source/app/components/ui/InfiniteScroll.vue

@@ -93,12 +93,12 @@ watch(
     <div ref="sentinelRef" class="infinite-scroll__sentinel" aria-hidden="true" />
     <div v-if="loading" class="infinite-scroll__state">
       <slot name="loading">
-        <BaseText as="p" size="sm" tone="muted">Loading more...</BaseText>
+        <UiText as="p" size="sm" tone="muted">Loading more...</UiText>
       </slot>
     </div>
     <div v-else-if="!hasMore" class="infinite-scroll__state">
       <slot name="complete">
-        <BaseText as="p" size="sm" tone="muted">All items loaded.</BaseText>
+        <UiText as="p" size="sm" tone="muted">All items loaded.</UiText>
       </slot>
     </div>
   </div>

package/dist/resources/components/nuxt/site-source/app/components/{ui/YoutubeEmbed.vue → youtube/Embed.vue}

@@ -84,12 +84,20 @@ const embedSrc = computed(() => {
       :src="embedSrc"
       :title="title"
       loading="lazy"
-      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+      allow="
+        accelerometer;
+        autoplay;
+        clipboard-write;
+        encrypted-media;
+        gyroscope;
+        picture-in-picture;
+        web-share;
+      "
       referrerpolicy="strict-origin-when-cross-origin"
       allowfullscreen
     />
     <div v-else class="youtube-embed__fallback">
-      <BaseText tone="danger" size="sm">Invalid YouTube source.</BaseText>
+      <UiText tone="danger" size="sm">Invalid YouTube source.</UiText>
     </div>
   </figure>
 </template>

package/dist/resources/components/nuxt/site-source/app/composables/useConsent.ts

@@ -3,11 +3,11 @@ import type { ComputedRef, Ref } from "vue";
 import type {
   ConsentInitializationResult,
   ConsentMutationResult,
+  ConsentConfig,
+  ConsentController,
   ConsentState,
   ConsentValue,
-  SiteConsentController,
-  SiteShellConsentConfig,
-} from "~/types/site-shell";
+} from "~/consent/types";
 
 const CONSENT_RECORD_VERSION = 1;
 const MAX_TIMER_DELAY = 2_147_483_647;
@@ -26,16 +26,14 @@ interface ConsentAnalyticsBridge {
   readonly reset: () => void;
 }
 
-interface CreateSiteConsentControllerOptions {
+interface ControllerOptions {
   readonly state: Ref<ConsentState>;
-  readonly config: Readonly<ComputedRef<SiteShellConsentConfig>>;
+  readonly config: Readonly<ComputedRef<ConsentConfig>>;
   readonly analytics: ConsentAnalyticsBridge;
 }
 
 /** 在应用生命周期内协调同意状态、持久化和分析开关。 */
-export function createSiteConsentController(
-  options: CreateSiteConsentControllerOptions,
-): SiteConsentController {
+export function createConsentController(options: ControllerOptions): ConsentController {
   let initialized = false;
   let disposed = false;
   let expiryTimer: ReturnType<typeof setTimeout> | undefined;
@@ -311,9 +309,9 @@ export class ConsentLifecycleError extends Error {
 }
 
 /** 返回 Nuxt 应用提供的唯一同意控制器。 */
-export function useConsent(): SiteConsentController {
+export function useConsent(): ConsentController {
   const nuxtApp = useNuxtApp() as ReturnType<typeof useNuxtApp> & {
-    readonly $siteConsent: SiteConsentController;
+    readonly $siteConsent: ConsentController;
   };
   return nuxtApp.$siteConsent;
 }

package/dist/resources/components/nuxt/site-source/app/composables/useNavigation.ts

@@ -1,32 +1,27 @@
-import type {
-  AppNavigationItem,
-  LocalizedNavigationItemConfig,
-  MarketingNavigationItem,
-  ResolvedSiteNavigation,
-} from "~/types/site-shell";
+import type { AppNavItem, NavItem, NavItemConfig, Navigation } from "~/navigation/types";
 
 /** 将产品配置中的资源键投影为当前语言可渲染的导航。 */
-export function useNavigation(): ResolvedSiteNavigation {
+export function useNavigation(): Navigation {
   const site = useSiteShell();
   const { t } = useI18n();
 
-  function resolveMarketingItem(item: LocalizedNavigationItemConfig): MarketingNavigationItem {
+  function resolveItem(item: NavItemConfig): NavItem {
     return {
       label: t(item.labelKey),
       ...(item.to === undefined ? {} : { to: item.to }),
       ...(item.external === undefined ? {} : { external: item.external }),
       ...(item.descriptionKey === undefined ? {} : { description: t(item.descriptionKey) }),
-      ...(item.children === undefined ? {} : { children: item.children.map(resolveMarketingItem) }),
+      ...(item.children === undefined ? {} : { children: item.children.map(resolveItem) }),
     };
   }
 
   return {
-    marketingNav: computed(() => site.value.navigation.marketing.map(resolveMarketingItem)),
-    appNavGroups: computed(() =>
+    items: computed(() => site.value.navigation.main.map(resolveItem)),
+    appGroups: computed(() =>
       site.value.navigation.app.map((group) => ({
         ...(group.labelKey === undefined ? {} : { label: t(group.labelKey) }),
         items: group.items.map(
-          (item): AppNavigationItem => ({
+          (item): AppNavItem => ({
             label: t(item.labelKey),
             to: item.to,
             ...(item.icon === undefined ? {} : { icon: item.icon }),
@@ -38,10 +33,10 @@ export function useNavigation(): ResolvedSiteNavigation {
     footerGroups: computed(() =>
       site.value.navigation.footer.map((group) => ({
         title: t(group.titleKey),
-        links: group.links.map(resolveMarketingItem),
+        links: group.links.map(resolveItem),
       })),
     ),
-    legalLinks: computed(() => site.value.navigation.legal.map(resolveMarketingItem)),
+    legalLinks: computed(() => site.value.navigation.legal.map(resolveItem)),
     socialLinks: computed(() =>
       site.value.navigation.social.map((link) => ({
         label: t(link.labelKey),

package/dist/resources/components/nuxt/site-source/app/composables/useSeo.ts

@@ -1,3 +1,5 @@
+import { formatTitle } from "@stackonward/nuxt-site-shell/runtime";
+
 export interface SeoInput {
   title?: string;
   description?: string;
@@ -23,7 +25,7 @@ export function useSeo(input: SeoInput): void {
   useSeoMeta({
     title: input.title,
     description,
-    ogTitle: input.title,
+    ogTitle: computed(() => formatTitle(input.title, site.value.name)),
     ogDescription: description,
     ogImage: input.image,
     robots: input.robots,

package/dist/resources/components/nuxt/site-source/app/composables/useSiteShell.ts

@@ -1,21 +1,18 @@
 import type { ComputedRef } from "vue";
-import type {
-  SiteShellConfig,
-  SiteShellConsentConfig,
-  StorageDisclosureConfig,
-} from "~/types/site-shell";
+import type { ConsentConfig, StorageDisclosure } from "~/consent/types";
+import type { Config } from "~/site/config";
 
-type SiteShellConfigInput = Omit<
-  Partial<SiteShellConfig>,
+type ConfigInput = Omit<
+  Partial<Config>,
   "consent" | "storageDisclosures" | "navigation" | "content"
 > & {
-  readonly consent?: Partial<SiteShellConsentConfig>;
-  readonly storageDisclosures?: readonly StorageDisclosureConfig[];
-  readonly navigation?: Partial<SiteShellConfig["navigation"]>;
-  readonly content?: Partial<SiteShellConfig["content"]>;
+  readonly consent?: Partial<ConsentConfig>;
+  readonly storageDisclosures?: readonly StorageDisclosure[];
+  readonly navigation?: Partial<Config["navigation"]>;
+  readonly content?: Partial<Config["content"]>;
 };
 
-const DEFAULT_SITE_SHELL_CONFIG: SiteShellConfig = {
+const DEFAULT_CONFIG: Config = {
   name: "Product Studio",
   descriptionKey: "site.description",
   url: "",
@@ -35,7 +32,7 @@ const DEFAULT_SITE_SHELL_CONFIG: SiteShellConfig = {
   },
   storageDisclosures: [],
   navigation: {
-    marketing: [],
+    main: [],
     app: [],
     footer: [],
     legal: [],
@@ -49,28 +46,28 @@ const DEFAULT_SITE_SHELL_CONFIG: SiteShellConfig = {
   },
 };
 
-function mergeSiteShellConfig(input: SiteShellConfigInput | undefined): SiteShellConfig {
+function mergeConfig(input: ConfigInput | undefined): Config {
   return {
-    ...DEFAULT_SITE_SHELL_CONFIG,
+    ...DEFAULT_CONFIG,
     ...input,
     consent: {
-      ...DEFAULT_SITE_SHELL_CONFIG.consent,
+      ...DEFAULT_CONFIG.consent,
       ...input?.consent,
     },
-    storageDisclosures: input?.storageDisclosures ?? DEFAULT_SITE_SHELL_CONFIG.storageDisclosures,
+    storageDisclosures: input?.storageDisclosures ?? DEFAULT_CONFIG.storageDisclosures,
     navigation: {
-      ...DEFAULT_SITE_SHELL_CONFIG.navigation,
+      ...DEFAULT_CONFIG.navigation,
       ...input?.navigation,
     },
     content: {
-      ...DEFAULT_SITE_SHELL_CONFIG.content,
+      ...DEFAULT_CONFIG.content,
       ...input?.content,
     },
   };
 }
 
 /** 返回当前 Nuxt 应用拥有的站点配置只读视图。 */
-export function useSiteShell(): Readonly<ComputedRef<SiteShellConfig>> {
-  const appConfig = useAppConfig() as { readonly siteShell?: SiteShellConfigInput };
-  return computed(() => mergeSiteShellConfig(appConfig.siteShell));
+export function useSiteShell(): Readonly<ComputedRef<Config>> {
+  const appConfig = useAppConfig() as { readonly siteShell?: ConfigInput };
+  return computed(() => mergeConfig(appConfig.siteShell));
 }

package/dist/resources/components/nuxt/site-source/app/consent/types.ts

@@ -0,0 +1,59 @@
+import type { ComputedRef, DeepReadonly, Ref } from "vue";
+
+export interface StorageDisclosure {
+  readonly name: string;
+  readonly category: "necessary" | "preferences" | "analytics";
+  readonly purposeKey: string;
+  readonly retentionKey: string;
+  readonly providerKey: string;
+}
+
+export interface ConsentConfig {
+  readonly enabled: boolean;
+  readonly storageKey: string;
+  readonly policyRevision: string;
+  readonly retentionDays: number;
+  readonly policyPath: string;
+}
+
+export type ConsentValue = "accepted" | "rejected";
+
+export type ConsentPersistenceError =
+  | "read-failed"
+  | "write-failed"
+  | "clear-failed"
+  | "write-and-clear-failed";
+
+export interface ConsentState {
+  decision: ConsentValue | null;
+  ready: boolean;
+  settingsOpen: boolean;
+  persistence: "none" | "persisted" | "cleared" | "cleanup-failed" | "session-only";
+  error: ConsentPersistenceError | null;
+}
+
+export type ConsentInitializationResult =
+  | { status: "restored"; value: ConsentValue }
+  | { status: "undecided"; cleanup: "not-required" | "cleared" }
+  | { status: "undecided"; cleanup: "failed"; error: "clear-failed" }
+  | { status: "storage-unavailable"; error: "read-failed" };
+
+export type ConsentMutationResult =
+  | { status: "persisted"; value: ConsentValue }
+  | { status: "cleared"; value: "rejected"; error: "write-failed" }
+  | {
+      status: "session-only";
+      value: ConsentValue;
+      error: "write-failed" | "write-and-clear-failed";
+    };
+
+export interface ConsentController {
+  readonly state: DeepReadonly<Ref<ConsentState>>;
+  readonly visible: Readonly<ComputedRef<boolean>>;
+  initialize(): ConsentInitializationResult;
+  accept(): ConsentMutationResult;
+  reject(): ConsentMutationResult;
+  openSettings(): void;
+  closeSettings(): void;
+  dispose(): void;
+}

package/dist/resources/components/nuxt/site-source/app/content/types.ts

@@ -0,0 +1,17 @@
+export interface ListItem {
+  readonly title: string;
+  readonly description?: string;
+  readonly to: string;
+  readonly category?: string;
+  readonly date?: string;
+  readonly author?: string;
+}
+
+export interface Article {
+  readonly title: string;
+  readonly description?: string;
+  readonly category?: string;
+  readonly author?: string;
+  readonly date?: string;
+  readonly updatedAt?: string;
+}

package/dist/resources/components/nuxt/site-source/app/layouts/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <ApplicationShell>
+  <AppShell>
     <slot />
-  </ApplicationShell>
+  </AppShell>
 </template>

package/dist/resources/components/nuxt/site-source/app/layouts/default.vue

@@ -1,5 +1,5 @@
 <template>
-  <MarketingShell>
+  <SiteShell>
     <slot />
-  </MarketingShell>
+  </SiteShell>
 </template>

package/dist/resources/components/nuxt/site-source/app/navigation/types.ts

@@ -0,0 +1,68 @@
+import type { ComputedRef } from "vue";
+
+export interface NavItemConfig {
+  readonly labelKey: string;
+  readonly to?: string;
+  readonly external?: boolean;
+  readonly descriptionKey?: string;
+  readonly children?: readonly NavItemConfig[];
+}
+
+export interface NavItem {
+  readonly label: string;
+  readonly to?: string;
+  readonly external?: boolean;
+  readonly description?: string;
+  readonly children?: readonly NavItem[];
+}
+
+export interface AppNavItemConfig {
+  readonly labelKey: string;
+  readonly to: string;
+  readonly icon?: string;
+  readonly badge?: string;
+}
+
+export interface AppNavItem extends Omit<AppNavItemConfig, "labelKey"> {
+  readonly label: string;
+}
+
+export interface NavGroupConfig {
+  readonly labelKey?: string;
+  readonly items: readonly AppNavItemConfig[];
+}
+
+export interface NavGroup {
+  readonly label?: string;
+  readonly items: readonly AppNavItem[];
+}
+
+export interface FooterGroupConfig {
+  readonly titleKey: string;
+  readonly links: readonly NavItemConfig[];
+}
+
+export interface FooterGroup {
+  readonly title: string;
+  readonly links: readonly NavItem[];
+}
+
+export interface SocialLinkConfig {
+  readonly labelKey: string;
+  readonly href: string;
+}
+
+export interface SocialLink {
+  readonly label: string;
+  readonly href: string;
+}
+
+export interface Navigation {
+  readonly items: Readonly<ComputedRef<readonly NavItem[]>>;
+  readonly appGroups: Readonly<ComputedRef<readonly NavGroup[]>>;
+  readonly footerGroups: Readonly<ComputedRef<readonly FooterGroup[]>>;
+  readonly legalLinks: Readonly<ComputedRef<readonly NavItem[]>>;
+  readonly socialLinks: Readonly<ComputedRef<readonly SocialLink[]>>;
+  readonly primaryActionLabel: Readonly<ComputedRef<string>>;
+  readonly secondaryActionLabel: Readonly<ComputedRef<string>>;
+}

package/dist/resources/components/nuxt/site-source/app/plugins/consent.ts

@@ -1,4 +1,4 @@
-import type { ConsentState } from "~/types/site-shell";
+import type { ConsentState } from "~/consent/types";
 
 export default defineNuxtPlugin({
   name: "site:consent",
@@ -14,7 +14,7 @@ export default defineNuxtPlugin({
       persistence: "none",
       error: null,
     }));
-    const controller = createSiteConsentController({
+    const controller = createConsentController({
       state,
       config: computed(() => site.value.consent),
       analytics: {

package/dist/resources/components/nuxt/site-source/app/site/config.ts

@@ -0,0 +1,35 @@
+import type { ConsentConfig, StorageDisclosure } from "~/consent/types";
+import type {
+  FooterGroupConfig,
+  NavGroupConfig,
+  NavItemConfig,
+  SocialLinkConfig,
+} from "~/navigation/types";
+
+export interface Config {
+  readonly name: string;
+  readonly descriptionKey: string;
+  readonly url: string;
+  readonly defaultLocale: string;
+  readonly homePath: string;
+  readonly appPath: string;
+  readonly logoText: string;
+  readonly primaryActionLabelKey: string;
+  readonly secondaryActionLabelKey: string;
+  readonly secondaryActionPath: string;
+  readonly consent: ConsentConfig;
+  readonly storageDisclosures: readonly StorageDisclosure[];
+  readonly navigation: {
+    readonly main: readonly NavItemConfig[];
+    readonly app: readonly NavGroupConfig[];
+    readonly footer: readonly FooterGroupConfig[];
+    readonly legal: readonly NavItemConfig[];
+    readonly social: readonly SocialLinkConfig[];
+  };
+  readonly content: {
+    readonly blogPath: string;
+    readonly authorPath: string;
+    readonly previewPath: string;
+    readonly sitemapSourcePath: string;
+  };
+}