@tower_74/cms-app 0.1.0

package/src/pages/Public/Shop/Index.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+import Pagination from '@/components/Pagination.vue';
+import Seo from '@/components/Seo.vue';
+import PublicLayout from '@/layouts/PublicLayout.vue';
+import { type Block, ProductGrid } from '@tower_74/cms-ui';
+
+interface ProductItem {
+    name: string;
+    url: string;
+    price: string | null;
+    image: { src: string; alt?: string } | null;
+}
+interface PageLink {
+    url: string | null;
+    label: string;
+    active: boolean;
+}
+
+defineProps<{
+    site: { name: string };
+    menu: Array<{ label: string; url: string }>;
+    footerWidgets: Block[];
+    cartCount?: number | null;
+    products: { data: ProductItem[]; links: PageLink[] };
+    seo: { title: string; description?: string | null; url?: string | null; image?: string | null; type?: string | null };
+}>();
+</script>
+
+<template>
+    <Seo :seo="seo" />
+
+    <PublicLayout :site="site" :menu="menu" :footer-widgets="footerWidgets" :cart-count="cartCount">
+        <div class="mx-auto max-w-6xl px-4 py-12 sm:px-6">
+            <h1 class="mb-8 text-3xl font-bold tracking-tight">Shop</h1>
+            <ProductGrid :products="products.data" :columns="3" empty="No products available yet." />
+            <Pagination :links="products.links" />
+        </div>
+    </PublicLayout>
+</template>

package/src/pages/Public/Shop/Show.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import Seo from '@/components/Seo.vue';
+import PublicLayout from '@/layouts/PublicLayout.vue';
+import { router } from '@inertiajs/vue3';
+import { type Block, BlockRenderer, ProductOverview } from '@tower_74/cms-ui';
+
+interface ProductData {
+    name: string;
+    description: string | null;
+    image: { src: string; alt?: string } | null;
+    blocks: Block[];
+    options: Array<{ name: string; values: string[] }>;
+    variants: Array<{ id: number; options: Record<string, string>; price: string; available: boolean }>;
+}
+
+defineProps<{
+    site: { name: string };
+    menu: Array<{ label: string; url: string }>;
+    footerWidgets: Block[];
+    cartCount?: number | null;
+    product: ProductData;
+    seo: { title: string; description?: string | null; url?: string | null; image?: string | null; type?: string | null };
+}>();
+
+const addToCart = (payload: { variantId: number | string; quantity: number }) => {
+    // Wired to the cart in Phase 8.3. For now this posts to the (future) cart endpoint.
+    router.post('/cart', { variant_id: payload.variantId, quantity: payload.quantity }, { preserveScroll: true });
+};
+</script>
+
+<template>
+    <Seo :seo="seo" />
+
+    <PublicLayout :site="site" :menu="menu" :footer-widgets="footerWidgets" :cart-count="cartCount">
+        <ProductOverview
+            :name="product.name"
+            :description="product.description ?? undefined"
+            :image="product.image ?? undefined"
+            :options="product.options"
+            :variants="product.variants"
+            @add-to-cart="addToCart"
+        />
+
+        <BlockRenderer v-if="product.blocks.length" :blocks="product.blocks" />
+    </PublicLayout>
+</template>

package/src/pages/Public/Show.vue

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+import Seo from '@/components/Seo.vue';
+import PublicLayout from '@/layouts/PublicLayout.vue';
+import { type Block, DetailPageTemplate, LandingPageTemplate } from '@tower_74/cms-ui';
+
+defineProps<{
+    site: { name: string };
+    menu: Array<{ label: string; url: string }>;
+    footerWidgets: Block[];
+    cartCount?: number | null;
+    edit?: { url: string; label: string } | null;
+    page: {
+        title: string;
+        template: 'landing' | 'detail';
+        showTitle?: boolean;
+        header?: { title: string; subtitle?: string | null };
+        featuredImage?: { src: string; alt?: string } | null;
+        blocks: Block[];
+    };
+    seo: { title: string; description?: string | null; url?: string | null; image?: string | null; type?: string | null };
+}>();
+</script>
+
+<template>
+    <Seo :seo="seo" />
+
+    <PublicLayout :site="site" :menu="menu" :footer-widgets="footerWidgets" :cart-count="cartCount" :edit="edit">
+        <template v-if="page.template === 'landing'">
+            <div v-if="page.showTitle" class="mx-auto max-w-6xl px-4 pb-2 pt-10 sm:px-6">
+                <h1 class="text-3xl font-bold tracking-tight text-text">{{ page.title }}</h1>
+            </div>
+            <LandingPageTemplate :blocks="page.blocks" />
+        </template>
+        <template v-else>
+            <div v-if="page.featuredImage" class="mx-auto max-w-3xl px-4 pt-8 sm:px-6">
+                <img :src="page.featuredImage.src" :alt="page.featuredImage.alt ?? ''" class="w-full rounded-lg object-cover" />
+            </div>
+            <DetailPageTemplate :header="page.header" :blocks="page.blocks" />
+        </template>
+    </PublicLayout>
+</template>

package/src/pages/Setup/Complete.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { Head, Link } from '@inertiajs/vue3';
+import { Button, Card } from '@tower_74/cms-ui';
+
+defineProps<{
+    summary: { email: string; commerceEnabled: boolean; demoSeeded: boolean; version: string } | null;
+    loginUrl: string;
+}>();
+</script>
+
+<template>
+    <Head title="Setup complete" />
+
+    <div class="flex min-h-screen items-center justify-center bg-surface px-4 py-12">
+        <div class="w-full max-w-lg">
+            <Card>
+                <div class="text-center">
+                    <div class="bg-success/15 mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full text-2xl text-success">✓</div>
+                    <h1 class="text-2xl font-bold tracking-tight">You're all set!</h1>
+                    <p class="mt-1 text-sm text-muted">Your site has been installed and is ready to use.</p>
+                </div>
+
+                <dl v-if="summary" class="my-6 space-y-2 rounded-lg border border-border bg-background p-4 text-sm">
+                    <div class="flex justify-between">
+                        <dt class="text-muted">Admin email</dt>
+                        <dd class="font-medium">{{ summary.email }}</dd>
+                    </div>
+                    <div class="flex justify-between">
+                        <dt class="text-muted">Commerce</dt>
+                        <dd>{{ summary.commerceEnabled ? 'Enabled' : 'Disabled' }}</dd>
+                    </div>
+                    <div v-if="summary.demoSeeded" class="flex justify-between">
+                        <dt class="text-muted">Demo content</dt>
+                        <dd>Seeded</dd>
+                    </div>
+                    <div class="flex justify-between">
+                        <dt class="text-muted">Version</dt>
+                        <dd>{{ summary.version }}</dd>
+                    </div>
+                </dl>
+
+                <Link :href="loginUrl" class="block">
+                    <Button size="lg" class="w-full">Log in to your admin</Button>
+                </Link>
+            </Card>
+
+            <p class="mt-4 text-center text-xs text-muted">
+                Remember to build front-end assets if you haven't yet:
+                <code class="rounded bg-background px-1">npm ci && npm run build</code>.
+            </p>
+        </div>
+    </div>
+</template>

package/src/pages/Setup/Index.vue

@@ -0,0 +1,85 @@
+<script setup lang="ts">
+import { Head, useForm } from '@inertiajs/vue3';
+import { Button, Card, Checkbox, FormField, Input } from '@tower_74/cms-ui';
+
+const props = defineProps<{
+    appName: string;
+    siteName: string;
+    siteUrl: string | null;
+    commerceAvailable: boolean;
+    version: string;
+}>();
+
+const form = useForm({
+    admin_name: '',
+    admin_email: '',
+    admin_password: '',
+    site_name: props.siteName,
+    site_url: props.siteUrl ?? '',
+    with_commerce: false,
+    demo: false,
+});
+
+const submit = () => form.post('/setup');
+</script>
+
+<template>
+    <Head title="Set up your site" />
+
+    <div class="flex min-h-screen items-center justify-center bg-surface px-4 py-12">
+        <div class="w-full max-w-lg">
+            <div class="mb-6 text-center">
+                <h1 class="text-2xl font-bold tracking-tight">Welcome to {{ appName }}</h1>
+                <p class="mt-1 text-sm text-muted">Let's get your site set up. (v{{ version }})</p>
+            </div>
+
+            <Card>
+                <p v-if="form.errors.install" class="border-danger/40 bg-danger/10 mb-4 rounded border px-3 py-2 text-sm text-danger">
+                    {{ form.errors.install }}
+                </p>
+
+                <form class="space-y-6" @submit.prevent="submit">
+                    <div>
+                        <h2 class="mb-3 text-sm font-semibold uppercase tracking-wide text-muted">Administrator</h2>
+                        <div class="space-y-4">
+                            <FormField label="Your name" :error="form.errors.admin_name" required>
+                                <Input v-model="form.admin_name" :invalid="!!form.errors.admin_name" />
+                            </FormField>
+                            <FormField label="Email" :error="form.errors.admin_email" required>
+                                <Input v-model="form.admin_email" type="email" :invalid="!!form.errors.admin_email" />
+                            </FormField>
+                            <FormField label="Password" :error="form.errors.admin_password" help="At least 8 characters." required>
+                                <Input v-model="form.admin_password" type="password" :invalid="!!form.errors.admin_password" />
+                            </FormField>
+                        </div>
+                    </div>
+
+                    <div>
+                        <h2 class="mb-3 text-sm font-semibold uppercase tracking-wide text-muted">Site</h2>
+                        <div class="space-y-4">
+                            <FormField label="Site name" :error="form.errors.site_name" required>
+                                <Input v-model="form.site_name" :invalid="!!form.errors.site_name" />
+                            </FormField>
+                            <FormField label="Site URL" :error="form.errors.site_url" help="Optional — written to APP_URL.">
+                                <Input v-model="form.site_url" type="url" placeholder="https://example.com" :invalid="!!form.errors.site_url" />
+                            </FormField>
+                        </div>
+                    </div>
+
+                    <div class="space-y-3 border-t border-border pt-4">
+                        <Checkbox v-if="commerceAvailable" v-model="form.with_commerce" label="Enable commerce (storefront + cart)" />
+                        <Checkbox v-model="form.demo" label="Seed demo content to explore" />
+                    </div>
+
+                    <Button type="submit" size="lg" class="w-full" :disabled="form.processing">
+                        {{ form.processing ? 'Installing…' : 'Install' }}
+                    </Button>
+                </form>
+            </Card>
+
+            <p class="mt-4 text-center text-xs text-muted">
+                Prefer the CLI? Run <code class="rounded bg-background px-1">php artisan cms:install</code>.
+            </p>
+        </div>
+    </div>
+</template>