feat(KAN-18): redesign foundational UI components

Reviewed-on: #111

app/Actions/Notifications/BuildProjectNotificationSettingsPayload.php

@@ -2,6 +2,8 @@
 
 namespace App\Actions\Notifications;
 
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Actions\Projects\ResolveProjectTemplateState;
 use App\Enums\DiscordAllowedMentionType;
 use App\Enums\NotificationChannel;
 use App\Enums\NotificationEventType;
@@ -15,6 +17,7 @@ class BuildProjectNotificationSettingsPayload
 {
     public function __construct(
         private readonly ListProjectNotificationActions $listProjectNotificationActions,
+        private readonly ResolveProjectTemplateState $resolveProjectTemplateState,
     ) {}
 
     /**
@@ -33,6 +36,9 @@ class BuildProjectNotificationSettingsPayload
             )->resolve(),
             'project' => ProjectResource::make($project)->resolve(),
             'status' => $status,
+            'templateState' => $this->resolveProjectTemplateState->handle($project, [
+                DuplicateProjectConfiguration::COPY_NOTIFICATION_ACTIONS,
+            ]),
             'templateVariables' => $this->templateVariables(),
         ];
     }

app/Actions/ProjectBoard/UpdateTicketStatusTransitions.php

@@ -2,11 +2,19 @@
 
 namespace App\Actions\ProjectBoard;
 
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Actions\Projects\ProjectTemplateOverrideManager;
+use App\Actions\Projects\RefreshProjectBaseTemplate;
 use App\Models\TicketStatus;
 use Illuminate\Support\Arr;
 
 class UpdateTicketStatusTransitions
 {
+    public function __construct(
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
+        private readonly RefreshProjectBaseTemplate $refreshProjectBaseTemplate,
+    ) {}
+
     /**
      * @param  array{allowed_ticket_status_ids?: array<int, int|string>|null}  $validated
      */
@@ -19,6 +27,14 @@ class UpdateTicketStatusTransitions
             ->all();
 
         $ticketStatus->allowedTargetStatuses()->sync($allowedTicketStatusIds);
+        $this->projectTemplateOverrideManager->mark(
+            $ticketStatus->project,
+            DuplicateProjectConfiguration::COPY_STATUS_TRANSITIONS,
+        );
+        $this->refreshProjectBaseTemplate->handle(
+            $ticketStatus->project,
+            DuplicateProjectConfiguration::COPY_STATUS_TRANSITIONS,
+        );
 
         return $ticketStatus->fresh();
     }

app/Actions/ProjectTicketMetadata/UpdateProjectTicketMetadataSettings.php

@@ -2,11 +2,19 @@
 
 namespace App\Actions\ProjectTicketMetadata;
 
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Actions\Projects\ProjectTemplateOverrideManager;
+use App\Actions\Projects\RefreshProjectBaseTemplate;
 use App\Models\Project;
 use Illuminate\Support\Arr;
 
 class UpdateProjectTicketMetadataSettings
 {
+    public function __construct(
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
+        private readonly RefreshProjectBaseTemplate $refreshProjectBaseTemplate,
+    ) {}
+
     /**
      * @param  array{show_author?: bool|null, show_story_points?: bool|null}  $validated
      */
@@ -16,6 +24,14 @@ class UpdateProjectTicketMetadataSettings
             'show_author' => Arr::get($validated, 'show_author', false),
             'show_story_points' => Arr::get($validated, 'show_story_points', false),
         ]);
+        $this->projectTemplateOverrideManager->mark(
+            $project,
+            DuplicateProjectConfiguration::COPY_PROJECT_SETTINGS,
+        );
+        $this->refreshProjectBaseTemplate->handle(
+            $project,
+            DuplicateProjectConfiguration::COPY_PROJECT_SETTINGS,
+        );
 
         return $project->fresh();
     }

app/Actions/Projects/BuildProjectBoardSettingsPayload.php

@@ -9,6 +9,10 @@ use App\Models\Project;
 
 class BuildProjectBoardSettingsPayload
 {
+    public function __construct(
+        private readonly ResolveProjectTemplateState $resolveProjectTemplateState,
+    ) {}
+
     /**
      * @return array<string, mixed>
      */
@@ -27,6 +31,9 @@ class BuildProjectBoardSettingsPayload
             )->resolve(),
             'project' => ProjectResource::make($project)->resolve(),
             'status' => $status,
+            'templateState' => $this->resolveProjectTemplateState->handle($project, [
+                DuplicateProjectConfiguration::COPY_BOARD_WORKFLOW,
+            ]),
             'ticketStatuses' => TicketStatusResource::collection(
                 $project->ticketStatuses()
                     ->with(['allowedTargetStatuses.boardColumn', 'boardColumn'])

app/Actions/Projects/BuildProjectTicketMetadataSettingsPayload.php

@@ -13,6 +13,10 @@ use App\Models\TicketFieldDefinition;
 
 class BuildProjectTicketMetadataSettingsPayload
 {
+    public function __construct(
+        private readonly ResolveProjectTemplateState $resolveProjectTemplateState,
+    ) {}
+
     /**
      * @return array<string, mixed>
      */
@@ -23,6 +27,13 @@ class BuildProjectTicketMetadataSettingsPayload
             'project' => ProjectResource::make($project)->resolve(),
             'error' => $error,
             'status' => $status,
+            'templateState' => $this->resolveProjectTemplateState->handle($project, [
+                DuplicateProjectConfiguration::COPY_PROJECT_SETTINGS,
+                DuplicateProjectConfiguration::COPY_TICKET_TYPES,
+                DuplicateProjectConfiguration::COPY_TICKET_PRIORITIES,
+                DuplicateProjectConfiguration::COPY_TICKET_FIELDS,
+                DuplicateProjectConfiguration::COPY_TICKET_LINK_TYPES,
+            ]),
             'ticketFieldDefinitions' => TicketFieldDefinitionResource::collection($project->ticketFieldDefinitions()->get())->resolve(),
             'ticketLinkTypes' => TicketLinkTypeResource::collection($project->ticketLinkTypes()->get())->resolve(),
             'ticketPriorities' => TicketPriorityResource::collection($project->ticketPriorities()->get())->resolve(),

app/Actions/Projects/CreateProject.php

@@ -6,25 +6,85 @@ use App\Actions\Permissions\PermissionService;
 use App\Actions\ProjectTicketMetadata\InitializeProjectTicketMetadata;
 use App\Enums\Permission;
 use App\Models\Project;
+use App\Models\ProjectTemplate;
 use App\Models\User;
+use Illuminate\Support\Arr;
+use Illuminate\Support\Facades\DB;
 
 class CreateProject
 {
     public function __construct(
+        private readonly CreateProjectBaseTemplate $createProjectBaseTemplate,
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
         private readonly InitializeProjectTicketMetadata $initializeProjectTicketMetadata,
         private readonly PermissionService $permissionService,
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
     ) {}
 
     /**
-     * @param  array{key: string, name: string}  $attributes
+     * @param  array{key: string, name: string, creation_mode?: string, source_project_id?: int|string|null, source_template_id?: int|string|null, copy_areas?: array<int, string>|null}  $attributes
      */
     public function handle(array $attributes, User $actor): Project
     {
-        $project = Project::query()->create($attributes);
+        return DB::transaction(function () use ($attributes, $actor): Project {
+            $project = Project::query()->create(Arr::only($attributes, ['key', 'name']));
+            $creationMode = Arr::get($attributes, 'creation_mode', 'scratch');
+            $sourceTemplateId = Arr::get($attributes, 'source_template_id');
+            $baseTemplate = null;
+            $sourceTemplate = null;
 
-        $this->initializeProjectTicketMetadata->handle($project);
-        $this->permissionService->grant($actor, Permission::ProjectAdmin, $project);
+            if ($creationMode === 'template' && $sourceTemplateId !== null) {
+                $sourceTemplate = ProjectTemplate::query()
+                    ->published()
+                    ->findOrFail((int) $sourceTemplateId);
 
-        return $project;
+                $project->forceFill([
+                    'project_template_id' => $sourceTemplate->id,
+                    'template_overrides' => [],
+                ])->saveQuietly();
+            } else {
+                $baseTemplate = $this->createProjectBaseTemplate->handle($project);
+
+                $project->forceFill([
+                    'project_template_id' => $baseTemplate->id,
+                    'template_overrides' => [],
+                ])->saveQuietly();
+            }
+
+            $project = $project->fresh() ?? $project;
+
+            $this->projectTemplateOverrideManager->withoutRecording(
+                fn () => $this->initializeProjectTicketMetadata->handle($project),
+            );
+            $this->permissionService->grant($actor, Permission::ProjectAdmin, $project);
+
+            if ($creationMode === 'duplicate' && Arr::get($attributes, 'source_project_id') !== null) {
+                $sourceProject = Project::query()->findOrFail((int) Arr::get($attributes, 'source_project_id'));
+
+                $this->duplicateProjectConfiguration->handle(
+                    $sourceProject,
+                    $project,
+                    array_values(Arr::get($attributes, 'copy_areas', [])),
+                );
+            }
+
+            if ($creationMode === 'template' && $sourceTemplate !== null) {
+                $this->duplicateProjectConfiguration->apply(
+                    $project->fresh() ?? $project,
+                    $sourceTemplate->configuration_snapshot ?? [],
+                );
+            }
+
+            if ($baseTemplate !== null) {
+                $baseTemplate->forceFill([
+                    'configuration_snapshot' => $this->duplicateProjectConfiguration->export(
+                        $project->fresh() ?? $project,
+                        DuplicateProjectConfiguration::copyableAreas(),
+                    ),
+                ])->save();
+            }
+
+            return $project->fresh() ?? $project;
+        });
     }
 }

app/Actions/Projects/CreateProjectBaseTemplate.php

@@ -0,0 +1,28 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+
+class CreateProjectBaseTemplate
+{
+    public function __construct(
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
+    ) {}
+
+    public function handle(Project $project): ProjectTemplate
+    {
+        $copyAreas = DuplicateProjectConfiguration::copyableAreas();
+
+        return ProjectTemplate::query()->create([
+            'project_id' => $project->id,
+            'source_project_id' => $project->id,
+            'name' => "{$project->name} base template",
+            'slug' => strtolower($project->key).'-base-template',
+            'is_published' => false,
+            'copy_areas' => $copyAreas,
+            'configuration_snapshot' => $this->duplicateProjectConfiguration->export($project, $copyAreas),
+        ]);
+    }
+}

app/Actions/Projects/CreateProjectTemplate.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Support\Arr;
+
+class CreateProjectTemplate
+{
+    public function __construct(
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
+    ) {}
+
+    /**
+     * @param  array{name: string, slug: string, copy_areas?: array<int, string>}  $attributes
+     */
+    public function handle(Project $sourceProject, array $attributes): ProjectTemplate
+    {
+        $copyAreas = array_values(Arr::get($attributes, 'copy_areas', []));
+
+        return ProjectTemplate::query()->create([
+            'project_id' => null,
+            'source_project_id' => $sourceProject->id,
+            'name' => $attributes['name'],
+            'slug' => $attributes['slug'],
+            'is_published' => true,
+            'copy_areas' => $this->duplicateProjectConfiguration->normalizeCopyAreas($copyAreas),
+            'configuration_snapshot' => $this->duplicateProjectConfiguration->export($sourceProject, $copyAreas),
+        ]);
+    }
+}

app/Actions/Projects/DuplicateProjectConfiguration.php

@@ -0,0 +1,339 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+use Illuminate\Database\Eloquent\Collection as EloquentCollection;
+use Illuminate\Database\Eloquent\Model;
+
+class DuplicateProjectConfiguration
+{
+    public const COPY_PROJECT_SETTINGS = 'project_settings';
+
+    public const COPY_BOARD_COLUMNS = 'board_columns';
+
+    public const COPY_TICKET_STATUSES = 'ticket_statuses';
+
+    public const COPY_STATUS_TRANSITIONS = 'status_transitions';
+
+    public const COPY_TICKET_TYPES = 'ticket_types';
+
+    public const COPY_TICKET_PRIORITIES = 'ticket_priorities';
+
+    public const COPY_TICKET_FIELDS = 'ticket_fields';
+
+    public const COPY_TICKET_LINK_TYPES = 'ticket_link_types';
+
+    public const COPY_REPOSITORY_CONNECTIONS = 'repository_connections';
+
+    public const COPY_NOTIFICATION_ACTIONS = 'notification_actions';
+
+    public const COPY_BOARD_WORKFLOW = 'board_workflow';
+
+    public function __construct(
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
+    ) {}
+
+    /** @return list<string> */
+    public static function copyableAreas(): array
+    {
+        return [
+            self::COPY_PROJECT_SETTINGS,
+            self::COPY_BOARD_COLUMNS,
+            self::COPY_TICKET_STATUSES,
+            self::COPY_STATUS_TRANSITIONS,
+            self::COPY_TICKET_TYPES,
+            self::COPY_TICKET_PRIORITIES,
+            self::COPY_TICKET_FIELDS,
+            self::COPY_TICKET_LINK_TYPES,
+            self::COPY_REPOSITORY_CONNECTIONS,
+            self::COPY_NOTIFICATION_ACTIONS,
+        ];
+    }
+
+    /** @return list<string> */
+    public static function acceptedCopyAreas(): array
+    {
+        return [...self::copyableAreas(), self::COPY_BOARD_WORKFLOW];
+    }
+
+    /** @return list<array{value: string, label: string, description: string}> */
+    public static function copyAreaOptions(): array
+    {
+        return [
+            ['value' => self::COPY_PROJECT_SETTINGS, 'label' => 'Project settings', 'description' => 'General project preferences like story points and author visibility.'],
+            ['value' => self::COPY_BOARD_COLUMNS, 'label' => 'Board columns', 'description' => 'Columns and their order on the project board.'],
+            ['value' => self::COPY_TICKET_STATUSES, 'label' => 'Ticket statuses', 'description' => 'Statuses and their assignment to board columns.'],
+            ['value' => self::COPY_STATUS_TRANSITIONS, 'label' => 'Status transitions', 'description' => 'Allowed moves between ticket statuses.'],
+            ['value' => self::COPY_TICKET_TYPES, 'label' => 'Ticket types', 'description' => 'Available ticket types, including parent types.'],
+            ['value' => self::COPY_TICKET_PRIORITIES, 'label' => 'Ticket priorities', 'description' => 'Available ticket priorities.'],
+            ['value' => self::COPY_TICKET_FIELDS, 'label' => 'Custom ticket fields', 'description' => 'Custom field definitions without ticket values.'],
+            ['value' => self::COPY_TICKET_LINK_TYPES, 'label' => 'Ticket link types', 'description' => 'Relationship labels between tickets.'],
+            ['value' => self::COPY_REPOSITORY_CONNECTIONS, 'label' => 'Repository connections', 'description' => 'Repositories linked to the project.'],
+            ['value' => self::COPY_NOTIFICATION_ACTIONS, 'label' => 'Notification actions', 'description' => 'Notification rules and delivery settings.'],
+        ];
+    }
+
+    /** @param list<string> $copyAreas @return list<string> */
+    public function normalizeCopyAreas(array $copyAreas): array
+    {
+        if (in_array(self::COPY_BOARD_WORKFLOW, $copyAreas, true)) {
+            $copyAreas = [
+                ...array_diff($copyAreas, [self::COPY_BOARD_WORKFLOW]),
+                self::COPY_BOARD_COLUMNS,
+                self::COPY_TICKET_STATUSES,
+                self::COPY_STATUS_TRANSITIONS,
+            ];
+        }
+
+        return array_values(array_intersect(self::copyableAreas(), array_unique($copyAreas)));
+    }
+
+    /** @param array<string, mixed> $configuration @return array<string, mixed> */
+    public function normalizeConfiguration(array $configuration): array
+    {
+        $workflow = $configuration[self::COPY_BOARD_WORKFLOW] ?? null;
+
+        if (is_array($workflow)) {
+            $statuses = $workflow['ticket_statuses'] ?? [];
+            $configuration[self::COPY_BOARD_COLUMNS] ??= $workflow['board_columns'] ?? [];
+            $configuration[self::COPY_TICKET_STATUSES] ??= array_map(
+                static fn (array $status): array => array_diff_key($status, ['allowed_target_indexes' => true]),
+                $statuses,
+            );
+            $configuration[self::COPY_STATUS_TRANSITIONS] ??= array_map(
+                static fn (array $status): array => $status['allowed_target_indexes'] ?? [],
+                $statuses,
+            );
+            unset($configuration[self::COPY_BOARD_WORKFLOW]);
+        }
+
+        return $configuration;
+    }
+
+    /** @param list<string> $copyAreas @return array<string, mixed> */
+    public function export(Project $sourceProject, array $copyAreas): array
+    {
+        $selectedAreas = $this->normalizeCopyAreas($copyAreas);
+
+        if ($selectedAreas === []) {
+            return [];
+        }
+
+        $sourceProject->load([
+            'boardColumns', 'notificationActions', 'repositoryConnections', 'ticketFieldDefinitions',
+            'ticketLinkTypes', 'ticketPriorities', 'ticketStatuses.allowedTargetStatuses', 'ticketTypes',
+        ]);
+        $configuration = [];
+
+        if (in_array(self::COPY_PROJECT_SETTINGS, $selectedAreas, true)) {
+            $configuration[self::COPY_PROJECT_SETTINGS] = [
+                'show_author' => $sourceProject->show_author,
+                'show_story_points' => $sourceProject->show_story_points,
+            ];
+        }
+
+        $columnIndexes = $sourceProject->boardColumns->values()->mapWithKeys(
+            static fn ($column, int $index): array => [$column->id => $index],
+        );
+        $statusIndexes = $sourceProject->ticketStatuses->values()->mapWithKeys(
+            static fn ($status, int $index): array => [$status->id => $index],
+        );
+
+        if (in_array(self::COPY_BOARD_COLUMNS, $selectedAreas, true)) {
+            $configuration[self::COPY_BOARD_COLUMNS] = $sourceProject->boardColumns->values()->map(
+                static fn ($column): array => ['name' => $column->name, 'position' => $column->position],
+            )->all();
+        }
+
+        if (in_array(self::COPY_TICKET_STATUSES, $selectedAreas, true)) {
+            $configuration[self::COPY_TICKET_STATUSES] = $sourceProject->ticketStatuses->values()->map(
+                static fn ($status): array => [
+                    'board_column_index' => $status->board_column_id === null ? null : $columnIndexes->get($status->board_column_id),
+                    'name' => $status->name,
+                    'position' => $status->position,
+                ],
+            )->all();
+        }
+
+        if (in_array(self::COPY_STATUS_TRANSITIONS, $selectedAreas, true)) {
+            $configuration[self::COPY_STATUS_TRANSITIONS] = $sourceProject->ticketStatuses->values()->map(
+                static fn ($status): array => $status->allowedTargetStatuses->pluck('id')->map(
+                    static fn (int $id): ?int => $statusIndexes->get($id),
+                )->filter(static fn (?int $index): bool => $index !== null)->values()->all(),
+            )->all();
+        }
+
+        $simpleAreas = [
+            self::COPY_TICKET_TYPES => fn ($item): array => ['name' => $item->name, 'position' => $item->position, 'is_parent' => $item->is_parent],
+            self::COPY_TICKET_PRIORITIES => fn ($item): array => ['name' => $item->name, 'position' => $item->position],
+            self::COPY_TICKET_FIELDS => fn ($item): array => ['field_type' => $item->field_type, 'label' => $item->label, 'position' => $item->position],
+            self::COPY_TICKET_LINK_TYPES => fn ($item): array => ['label' => $item->label, 'counterpart_label' => $item->counterpart_label, 'position' => $item->position],
+            self::COPY_REPOSITORY_CONNECTIONS => fn ($item): array => [
+                'provider' => $item->provider->value, 'base_url' => $item->base_url,
+                'provider_repository_id' => $item->provider_repository_id, 'owner_name' => $item->owner_name,
+                'repository_name' => $item->repository_name, 'repository_full_name' => $item->repository_full_name,
+                'repository_url' => $item->repository_url,
+            ],
+            self::COPY_NOTIFICATION_ACTIONS => fn ($item): array => [
+                'name' => $item->name, 'enabled' => $item->enabled, 'event_type' => $item->event_type->value,
+                'channel' => $item->channel->value, 'channel_configuration' => $item->channel_configuration ?? [],
+                'message_template' => $item->message_template, 'delivery_url' => $item->delivery_url,
+                'filters' => $item->filters ?? [],
+            ],
+        ];
+        $relations = [
+            self::COPY_TICKET_TYPES => 'ticketTypes', self::COPY_TICKET_PRIORITIES => 'ticketPriorities',
+            self::COPY_TICKET_FIELDS => 'ticketFieldDefinitions', self::COPY_TICKET_LINK_TYPES => 'ticketLinkTypes',
+            self::COPY_REPOSITORY_CONNECTIONS => 'repositoryConnections', self::COPY_NOTIFICATION_ACTIONS => 'notificationActions',
+        ];
+
+        foreach ($simpleAreas as $area => $mapper) {
+            if (in_array($area, $selectedAreas, true)) {
+                $configuration[$area] = $sourceProject->{$relations[$area]}->values()->map($mapper)->all();
+            }
+        }
+
+        return $configuration;
+    }
+
+    /**
+     * @param  array<string, mixed>  $configuration
+     * @param  array<int|string, int|string>  $statusReplacements
+     * @return list<string> areas which retained referenced local values
+     */
+    public function apply(Project $targetProject, array $configuration, array $statusReplacements = []): array
+    {
+        $configuration = $this->normalizeConfiguration($configuration);
+
+        $blockedAreas = $this->projectTemplateOverrideManager->withoutRecording(function () use ($targetProject, $configuration, $statusReplacements): array {
+            $blockedAreas = [];
+
+            if (isset($configuration[self::COPY_PROJECT_SETTINGS])) {
+                $targetProject->forceFill($configuration[self::COPY_PROJECT_SETTINGS])->saveQuietly();
+            }
+
+            if (isset($configuration[self::COPY_BOARD_COLUMNS])) {
+                $blocked = $this->syncModels(
+                    $targetProject->boardColumns()->get(),
+                    $configuration[self::COPY_BOARD_COLUMNS],
+                    fn (array $item) => $targetProject->boardColumns()->create($item),
+                    static fn (Model $model, array $item) => $model->forceFill($item)->saveQuietly(),
+                    static fn (Model $column): bool => ! $column->ticketStatuses()->exists(),
+                );
+                if ($blocked) {
+                    $blockedAreas[] = self::COPY_BOARD_COLUMNS;
+                }
+            }
+
+            if (isset($configuration[self::COPY_TICKET_STATUSES])) {
+                $columns = $targetProject->boardColumns()->get()->values();
+                $items = collect($configuration[self::COPY_TICKET_STATUSES])->map(static function (array $item) use ($columns): array {
+                    $columnIndex = $item['board_column_index'] ?? null;
+                    $item['board_column_id'] = $columnIndex === null ? null : $columns->get($columnIndex)?->id;
+                    unset($item['board_column_index']);
+
+                    return $item;
+                })->all();
+                $blocked = $this->syncModels(
+                    $targetProject->ticketStatuses()->get(),
+                    $items,
+                    fn (array $item) => $targetProject->ticketStatuses()->create($item),
+                    static fn (Model $model, array $item) => $model->forceFill($item)->saveQuietly(),
+                    function (Model $status) use ($statusReplacements): bool {
+                        if (! $status->tickets()->exists()) {
+                            return true;
+                        }
+                        $replacementId = $statusReplacements[$status->id] ?? null;
+                        if ($replacementId === null) {
+                            return false;
+                        }
+                        $status->tickets()->update(['ticket_status_id' => $replacementId]);
+
+                        return true;
+                    },
+                );
+                if ($blocked) {
+                    $blockedAreas[] = self::COPY_TICKET_STATUSES;
+                }
+            }
+
+            if (isset($configuration[self::COPY_STATUS_TRANSITIONS])) {
+                $statuses = $targetProject->ticketStatuses()->get()->values();
+                foreach ($configuration[self::COPY_STATUS_TRANSITIONS] as $index => $targets) {
+                    $status = $statuses->get($index);
+                    if ($status !== null) {
+                        $status->allowedTargetStatuses()->sync(collect($targets)->map(fn (int $target): ?int => $statuses->get($target)?->id)->filter()->all());
+                    }
+                }
+            }
+
+            $relations = [
+                self::COPY_TICKET_TYPES => ['ticketTypes', fn (Model $item): bool => ! $item->tickets()->exists()],
+                self::COPY_TICKET_PRIORITIES => ['ticketPriorities', fn (Model $item): bool => ! $item->tickets()->exists()],
+                self::COPY_TICKET_FIELDS => ['ticketFieldDefinitions', fn (Model $item): bool => ! $item->ticketFieldValues()->exists()],
+                self::COPY_TICKET_LINK_TYPES => ['ticketLinkTypes', fn (Model $item): bool => ! $item->ticketLinks()->exists()],
+                self::COPY_REPOSITORY_CONNECTIONS => ['repositoryConnections', null],
+                self::COPY_NOTIFICATION_ACTIONS => ['notificationActions', null],
+            ];
+
+            foreach ($relations as $area => [$relation, $canDelete]) {
+                if (! isset($configuration[$area])) {
+                    continue;
+                }
+                $blocked = $this->syncModels(
+                    $targetProject->{$relation}()->get(),
+                    $configuration[$area],
+                    fn (array $item) => $targetProject->{$relation}()->create($item),
+                    static fn (Model $model, array $item) => $model->forceFill($item)->saveQuietly(),
+                    $canDelete,
+                );
+                if ($blocked) {
+                    $blockedAreas[] = $area;
+                }
+            }
+
+            foreach ($targetProject->configurationRelations() as $relation) {
+                $targetProject->{$relation}()->update(['project_template_id' => $targetProject->project_template_id]);
+            }
+
+            return array_values(array_unique($blockedAreas));
+        });
+
+        foreach ($blockedAreas as $area) {
+            $this->projectTemplateOverrideManager->mark($targetProject->fresh(), $area);
+        }
+
+        return $blockedAreas;
+    }
+
+    /** @param list<string> $copyAreas */
+    public function handle(Project $sourceProject, Project $targetProject, array $copyAreas): void
+    {
+        $this->apply($targetProject, $this->export($sourceProject, $copyAreas));
+    }
+
+    /**
+     * @param  EloquentCollection<int, Model>  $models
+     * @param  array<int, array<string, mixed>>  $items
+     */
+    private function syncModels(EloquentCollection $models, array $items, callable $create, callable $update, ?callable $canDelete = null): bool
+    {
+        foreach ($items as $index => $item) {
+            $model = $models->get($index);
+            $model === null ? $create($item) : $update($model, $item);
+        }
+
+        $blocked = false;
+        foreach ($models->slice(count($items)) as $model) {
+            if ($canDelete !== null && ! $canDelete($model)) {
+                $blocked = true;
+
+                continue;
+            }
+            $model->deleteQuietly();
+        }
+
+        return $blocked;
+    }
+}

app/Actions/Projects/ProjectTemplateOverrideManager.php

@@ -0,0 +1,55 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+
+class ProjectTemplateOverrideManager
+{
+    private static int $suppressionDepth = 0;
+
+    public function mark(Project $project, string $area): void
+    {
+        if (self::$suppressionDepth > 0) {
+            return;
+        }
+
+        $project->loadMissing('projectTemplate');
+
+        if ($project->projectTemplate === null || ! $project->projectTemplate->is_published) {
+            return;
+        }
+
+        $overrides = array_values(array_unique([
+            ...($project->template_overrides ?? []),
+            $area,
+        ]));
+
+        $project->forceFill(['template_overrides' => $overrides])->saveQuietly();
+    }
+
+    /**
+     * @param  list<string>  $areas
+     */
+    public function clear(Project $project, array $areas): void
+    {
+        $remaining = array_values(array_diff($project->template_overrides ?? [], $areas));
+        $project->forceFill(['template_overrides' => $remaining])->saveQuietly();
+    }
+
+    public function withoutRecording(callable $callback): mixed
+    {
+        self::$suppressionDepth++;
+
+        try {
+            return $callback();
+        } finally {
+            self::$suppressionDepth--;
+        }
+    }
+
+    public function isRecording(): bool
+    {
+        return self::$suppressionDepth === 0;
+    }
+}

app/Actions/Projects/RefreshProjectBaseTemplate.php

@@ -0,0 +1,32 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+
+class RefreshProjectBaseTemplate
+{
+    public function __construct(
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
+    ) {}
+
+    public function handle(Project $project, string $area): void
+    {
+        $project->loadMissing('projectTemplate');
+
+        if ($project->projectTemplate === null || $project->projectTemplate->is_published) {
+            return;
+        }
+
+        $snapshot = $this->duplicateProjectConfiguration->normalizeConfiguration(
+            $project->projectTemplate->configuration_snapshot ?? [],
+        );
+
+        $project->projectTemplate->forceFill([
+            'configuration_snapshot' => array_replace(
+                $snapshot,
+                $this->duplicateProjectConfiguration->export($project->fresh(), [$area]),
+            ),
+        ])->saveQuietly();
+    }
+}

app/Actions/Projects/ResolveProjectTemplateState.php

@@ -0,0 +1,136 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+
+class ResolveProjectTemplateState
+{
+    public function __construct(
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
+    ) {}
+
+    /**
+     * @param  list<string>|null  $areas
+     * @return array<string, mixed>|null
+     */
+    public function handle(Project $project, ?array $areas = null): ?array
+    {
+        $project->loadMissing('projectTemplate');
+
+        /** @var ProjectTemplate|null $projectTemplate */
+        $projectTemplate = $project->projectTemplate;
+
+        if ($projectTemplate === null) {
+            return null;
+        }
+
+        $selectedAreas = $areas === null
+            ? DuplicateProjectConfiguration::copyableAreas()
+            : $this->duplicateProjectConfiguration->normalizeCopyAreas($areas);
+
+        $normalizedTemplateConfiguration = $this->duplicateProjectConfiguration->normalizeConfiguration(
+            $projectTemplate->configuration_snapshot ?? [],
+        );
+        $templateConfiguration = collect($normalizedTemplateConfiguration)
+            ->only($selectedAreas)
+            ->all();
+        $currentConfiguration = $this->duplicateProjectConfiguration->export($project, $selectedAreas);
+        $persistedOverrides = $projectTemplate->is_published
+            ? array_values(array_intersect($project->template_overrides ?? [], $selectedAreas))
+            : [];
+
+        $overriddenAreas = [];
+        $inheritedAreas = [];
+
+        foreach ($selectedAreas as $area) {
+            $label = $this->labelForArea($area);
+            $hasTemplateValue = array_key_exists($area, $templateConfiguration);
+
+            if (! $hasTemplateValue) {
+                continue;
+            }
+
+            if (! in_array($area, $persistedOverrides, true)) {
+                $inheritedAreas[] = [
+                    'label' => $label,
+                    'value' => $area,
+                ];
+
+                continue;
+            }
+
+            $overriddenAreas[] = [
+                'label' => $label,
+                'value' => $area,
+            ];
+        }
+
+        $overriddenAreaValues = array_flip(array_column($overriddenAreas, 'value'));
+        $inheritedAreaValues = array_flip(array_column($inheritedAreas, 'value'));
+
+        return [
+            'effectiveConfiguration' => array_replace($templateConfiguration, array_intersect_key($currentConfiguration, $overriddenAreaValues)),
+            'inheritedAreas' => $inheritedAreas,
+            'inheritedConfiguration' => array_intersect_key($templateConfiguration, $inheritedAreaValues),
+            'inheritsFromTemplate' => $projectTemplate->is_published,
+            'overriddenAreas' => $overriddenAreas,
+            'overriddenConfiguration' => array_intersect_key($currentConfiguration, $overriddenAreaValues),
+            'resetRequirements' => $this->resetRequirements($project, $templateConfiguration, $persistedOverrides),
+            'templateConfiguration' => $templateConfiguration,
+            'templateId' => $projectTemplate->id,
+            'templateName' => $projectTemplate->name,
+            'templateSlug' => $projectTemplate->slug,
+        ];
+    }
+
+    /**
+     * @param  array<string, mixed>  $templateConfiguration
+     * @param  list<string>  $persistedOverrides
+     * @return array<string, mixed>
+     */
+    private function resetRequirements(Project $project, array $templateConfiguration, array $persistedOverrides): array
+    {
+        if (! in_array(DuplicateProjectConfiguration::COPY_TICKET_STATUSES, $persistedOverrides, true)) {
+            return [];
+        }
+
+        $templateStatuses = $templateConfiguration[DuplicateProjectConfiguration::COPY_TICKET_STATUSES] ?? [];
+        if (! is_array($templateStatuses)) {
+            return [];
+        }
+
+        $statuses = $project->ticketStatuses()->withCount('tickets')->get()->values();
+        $replacementOptions = $statuses->take(count($templateStatuses))->map(
+            static fn ($status): array => ['id' => $status->id, 'name' => $status->name],
+        )->all();
+        $removedStatuses = $statuses->slice(count($templateStatuses))
+            ->filter(static fn ($status): bool => $status->tickets_count > 0)
+            ->map(static fn ($status): array => [
+                'id' => $status->id,
+                'name' => $status->name,
+                'ticketCount' => $status->tickets_count,
+            ])
+            ->values()
+            ->all();
+
+        return $removedStatuses === [] ? [] : [
+            DuplicateProjectConfiguration::COPY_TICKET_STATUSES => [
+                'removedStatuses' => $removedStatuses,
+                'replacementOptions' => $replacementOptions,
+            ],
+        ];
+    }
+
+    private function labelForArea(string $area): string
+    {
+        foreach (DuplicateProjectConfiguration::copyAreaOptions() as $option) {
+            if ($option['value'] === $area) {
+                return $option['label'];
+            }
+        }
+
+        return $area;
+    }
+}

app/Actions/Projects/UpdateProjectTemplate.php

@@ -0,0 +1,88 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Support\Arr;
+use Illuminate\Support\Facades\DB;
+
+class UpdateProjectTemplate
+{
+    public function __construct(
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
+    ) {}
+
+    /**
+     * @param  array{name: string, copy_areas?: array<int, string>}  $attributes
+     */
+    public function handle(ProjectTemplate $projectTemplate, array $attributes): ProjectTemplate
+    {
+        $projectTemplate->loadMissing('sourceProject');
+
+        $sourceProject = $projectTemplate->sourceProject;
+        abort_if($sourceProject === null, 422, 'This template cannot be edited because the source project is missing.');
+
+        $copyAreas = array_values(Arr::get($attributes, 'copy_areas', []));
+        $normalizedCopyAreas = $this->duplicateProjectConfiguration->normalizeCopyAreas($copyAreas);
+        $previousConfiguration = $this->duplicateProjectConfiguration->normalizeConfiguration(
+            $projectTemplate->configuration_snapshot ?? [],
+        );
+        $nextConfiguration = $this->duplicateProjectConfiguration->export($sourceProject, $normalizedCopyAreas);
+        $affectedAreas = collect(array_unique([...array_keys($previousConfiguration), ...array_keys($nextConfiguration)]))
+            ->filter(fn (string $area): bool => ($previousConfiguration[$area] ?? null) !== ($nextConfiguration[$area] ?? null))
+            ->values()
+            ->all();
+
+        DB::transaction(function () use ($projectTemplate, $attributes, $normalizedCopyAreas, $nextConfiguration, $previousConfiguration, $affectedAreas): void {
+            ProjectTemplate::query()->whereKey($projectTemplate->id)->lockForUpdate()->firstOrFail();
+
+            $projectTemplate->forceFill([
+                'name' => $attributes['name'],
+                'copy_areas' => $normalizedCopyAreas,
+                'configuration_snapshot' => $nextConfiguration,
+            ])->save();
+
+            Project::query()
+                ->where('project_template_id', $projectTemplate->id)
+                ->orderBy('id')
+                ->chunkById(100, function ($linkedProjects) use ($affectedAreas, $nextConfiguration, $previousConfiguration): void {
+                    foreach ($linkedProjects as $linkedProject) {
+                        $linkedProject = Project::query()->whereKey($linkedProject->id)->lockForUpdate()->firstOrFail();
+                        $currentConfiguration = $this->duplicateProjectConfiguration->export($linkedProject, $affectedAreas);
+                        $overrides = $linkedProject->template_overrides ?? [];
+                        $replacementConfiguration = [];
+
+                        foreach ($affectedAreas as $area) {
+                            if (in_array($area, $overrides, true)) {
+                                continue;
+                            }
+
+                            if (! array_key_exists($area, $nextConfiguration)) {
+                                $this->projectTemplateOverrideManager->mark($linkedProject, $area);
+
+                                continue;
+                            }
+
+                            if (! array_key_exists($area, $previousConfiguration)
+                                && array_key_exists($area, $currentConfiguration)
+                                && $currentConfiguration[$area] !== []) {
+                                $this->projectTemplateOverrideManager->mark($linkedProject, $area);
+
+                                continue;
+                            }
+
+                            $replacementConfiguration[$area] = $nextConfiguration[$area];
+                        }
+
+                        if ($replacementConfiguration !== []) {
+                            $this->duplicateProjectConfiguration->apply($linkedProject, $replacementConfiguration);
+                        }
+                    }
+                });
+        });
+
+        return $projectTemplate->fresh(['sourceProject'])->loadCount('linkedProjects');
+    }
+}

app/Actions/Projects/UpdateProjectTemplateLink.php

@@ -0,0 +1,69 @@
+<?php
+
+namespace App\Actions\Projects;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Support\Facades\DB;
+
+class UpdateProjectTemplateLink
+{
+    public function __construct(
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
+    ) {}
+
+    public function switch(Project $project, ProjectTemplate $template): void
+    {
+        DB::transaction(function () use ($project, $template): void {
+            $project = Project::query()->whereKey($project->id)->lockForUpdate()->firstOrFail();
+            $configuration = $this->duplicateProjectConfiguration->normalizeConfiguration(
+                $template->configuration_snapshot ?? [],
+            );
+            $localAreas = array_values(array_diff(
+                DuplicateProjectConfiguration::copyableAreas(),
+                array_keys($configuration),
+            ));
+
+            $project->forceFill([
+                'project_template_id' => $template->id,
+                'template_overrides' => $localAreas,
+            ])->saveQuietly();
+
+            $blockedAreas = $this->duplicateProjectConfiguration->apply($project, $configuration);
+            $this->projectTemplateOverrideManager->clear(
+                $project->fresh(),
+                array_values(array_diff(array_keys($configuration), $blockedAreas)),
+            );
+        });
+    }
+
+    /**
+     * @param  list<string>  $areas
+     * @param  array<int|string, int|string>  $statusReplacements
+     */
+    public function reset(Project $project, array $areas, array $statusReplacements = []): void
+    {
+        $template = $project->projectTemplate;
+
+        if ($template === null) {
+            return;
+        }
+
+        DB::transaction(function () use ($project, $template, $areas, $statusReplacements): void {
+            $project = Project::query()->whereKey($project->id)->lockForUpdate()->firstOrFail();
+            $configuration = collect($this->duplicateProjectConfiguration->normalizeConfiguration(
+                $template->configuration_snapshot ?? [],
+            ))->only($areas)->all();
+            $blockedAreas = $this->duplicateProjectConfiguration->apply(
+                $project,
+                $configuration,
+                $statusReplacements,
+            );
+            $this->projectTemplateOverrideManager->clear(
+                $project->fresh(),
+                array_values(array_diff(array_keys($configuration), $blockedAreas)),
+            );
+        });
+    }
+}

app/Actions/Repositories/BuildProjectRepositorySettingsPayload.php

@@ -4,6 +4,8 @@ namespace App\Actions\Repositories;
 
 use App\Actions\Git\Data\GitRepository;
 use App\Actions\Git\GitProviderManager;
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Actions\Projects\ResolveProjectTemplateState;
 use App\Http\Resources\AvailableGitRepositorySourceResource;
 use App\Http\Resources\ProjectResource;
 use App\Http\Resources\RepositoryConnectionResource;
@@ -18,6 +20,7 @@ class BuildProjectRepositorySettingsPayload
 {
     public function __construct(
         private readonly GitProviderManager $gitProviderManager,
+        private readonly ResolveProjectTemplateState $resolveProjectTemplateState,
     ) {}
 
     /**
@@ -41,6 +44,9 @@ class BuildProjectRepositorySettingsPayload
             'project' => ProjectResource::make($project)->resolve(),
             'repositoryConnections' => RepositoryConnectionResource::collection($repositoryConnections)->resolve(),
             'status' => $status,
+            'templateState' => $this->resolveProjectTemplateState->handle($project, [
+                DuplicateProjectConfiguration::COPY_REPOSITORY_CONNECTIONS,
+            ]),
         ];
     }
 

app/Actions/Tickets/CreateProjectTicket.php

@@ -19,6 +19,7 @@ class CreateProjectTicket
     public function __construct(
         private readonly BuildTicketCreatedPayload $buildTicketCreatedPayload,
         private readonly CreateTicketWorklogEntry $createTicketWorklogEntry,
+        private readonly SyncProjectTicketFieldValues $syncProjectTicketFieldValues,
     ) {}
 
     /**
@@ -29,7 +30,15 @@ class CreateProjectTicket
      *         text: string
      *     }>,
      *     assignee_user_id?: int|null,
+     *     author_user_id?: int|null,
+     *     blocked_comment?: string|null,
      *     description: string|null,
+     *     field_values?: array<int, array{
+     *         ticket_field_definition_id: int,
+     *         value_number?: float|int|string|null,
+     *         value_user_id?: int|string|null
+     *     }>,
+     *     is_blocked?: bool,
      *     parent_ticket_id?: int|null,
      *     story_points?: int|null,
      *     ticket_priority_id: int,
@@ -47,14 +56,17 @@ class CreateProjectTicket
             $nextSequenceNumber = (int) Ticket::query()
                 ->where('project_id', $project->id)
                 ->max('sequence_number') + 1;
-            $ticketStatus = TicketStatus::query()
-                ->where('project_id', $project->id)
-                ->findOrFail(Arr::get($attributes, 'ticket_status_id'));
+            $ticketStatusQuery = TicketStatus::query()->where('project_id', $project->id);
+
+            $ticketStatus = $ticketStatusQuery->findOrFail(Arr::get($attributes, 'ticket_status_id'));
+            $isBlocked = (bool) Arr::get($attributes, 'is_blocked', false);
 
             $ticket = Ticket::query()->create([
                 'assignee_user_id' => Arr::get($attributes, 'assignee_user_id'),
-                'author_user_id' => $actor?->id,
+                'author_user_id' => Arr::get($attributes, 'author_user_id', $actor?->id),
+                'blocked_comment' => $isBlocked ? Arr::get($attributes, 'blocked_comment') : null,
                 'description' => Arr::get($attributes, 'description'),
+                'is_blocked' => $isBlocked,
                 'parent_ticket_id' => Arr::get($attributes, 'parent_ticket_id'),
                 'project_id' => $project->id,
                 'sequence_number' => $nextSequenceNumber,
@@ -68,6 +80,17 @@ class CreateProjectTicket
 
             AcceptanceCriteriaChecklistMapper::syncTicket($ticket, $acceptanceCriteria);
 
+            $fieldValues = Arr::get($attributes, 'field_values', []);
+
+            if ($fieldValues !== []) {
+                $this->syncProjectTicketFieldValues->handle(
+                    $ticket,
+                    $project->ticketFieldDefinitions()->get()->keyBy('id'),
+                    collect(),
+                    $fieldValues,
+                );
+            }
+
             $occurredAt = CarbonImmutable::now();
 
             if ($actor !== null) {

app/Http/Controllers/ProjectController.php

@@ -6,16 +6,23 @@ use App\Actions\Permissions\PermissionService;
 use App\Actions\Projects\BuildProjectBacklogPayload;
 use App\Actions\Projects\CreateProject;
 use App\Actions\Projects\DeleteProject;
+use App\Actions\Projects\DuplicateProjectConfiguration;
 use App\Actions\Projects\ListVisibleProjects;
+use App\Actions\Projects\ResolveProjectTemplateState;
+use App\Actions\Projects\UpdateProjectTemplateLink;
 use App\Enums\Permission;
 use App\Http\Requests\DeleteProjectRequest;
+use App\Http\Requests\ResetProjectTemplateRequest;
 use App\Http\Requests\StoreProjectRequest;
+use App\Http\Requests\SwitchProjectTemplateRequest;
 use App\Http\Requests\SyncProjectPermissionsRequest;
 use App\Http\Resources\PermissionOptionResource;
 use App\Http\Resources\ProjectResource;
+use App\Http\Resources\ProjectTemplateResource;
 use App\Http\Resources\TeamResource;
 use App\Http\Resources\UserResource;
 use App\Models\Project;
+use App\Models\ProjectTemplate;
 use App\Models\Team;
 use App\Models\User;
 use Illuminate\Http\RedirectResponse;
@@ -30,8 +37,11 @@ class ProjectController extends Controller
         private readonly BuildProjectBacklogPayload $buildProjectBacklogPayload,
         private readonly CreateProject $createProject,
         private readonly DeleteProject $deleteProject,
+        private readonly DuplicateProjectConfiguration $duplicateProjectConfiguration,
         private readonly ListVisibleProjects $listVisibleProjects,
         private readonly PermissionService $permissionService,
+        private readonly ResolveProjectTemplateState $resolveProjectTemplateState,
+        private readonly UpdateProjectTemplateLink $updateProjectTemplateLink,
     ) {}
 
     public function index(Request $request): Response
@@ -51,7 +61,23 @@ class ProjectController extends Controller
             403,
         );
 
-        return Inertia::render('projects/Create');
+        $sourceTemplates = ProjectTemplate::query()
+            ->published()
+            ->with('sourceProject')
+            ->orderBy('name')
+            ->get();
+        $selectedTemplateId = $request->integer('template');
+
+        return Inertia::render('projects/Create', [
+            'copyAreaOptions' => DuplicateProjectConfiguration::copyAreaOptions(),
+            'sourceProjects' => ProjectResource::collection(
+                $this->listVisibleProjects->handle($request->user()),
+            )->resolve(),
+            'sourceTemplates' => ProjectTemplateResource::collection($sourceTemplates)->resolve(),
+            'selectedSourceTemplateId' => $sourceTemplates->contains('id', $selectedTemplateId)
+                ? $selectedTemplateId
+                : null,
+        ]);
     }
 
     public function store(StoreProjectRequest $request): RedirectResponse
@@ -73,6 +99,7 @@ class ProjectController extends Controller
         return Inertia::render('projects/Show', [
             'canManageAccess' => $this->permissionService->allows($user, Permission::ProjectAdmin, $project),
             'project' => ProjectResource::make($project)->resolve(),
+            'templateState' => $this->resolveProjectTemplateState->handle($project),
         ]);
     }
 
@@ -95,10 +122,58 @@ class ProjectController extends Controller
     {
         return Inertia::render('projects/settings/General', [
             'project' => ProjectResource::make($project)->resolve(),
+            'sourceTemplates' => ProjectTemplateResource::collection(
+                ProjectTemplate::query()
+                    ->published()
+                    ->with('sourceProject')
+                    ->orderBy('name')
+                    ->get(),
+            )->resolve(),
             'status' => session('status'),
+            'templateState' => $this->resolveProjectTemplateState->handle($project),
         ]);
     }
 
+    public function switchTemplate(SwitchProjectTemplateRequest $request, Project $project): RedirectResponse
+    {
+        $validated = $request->validated();
+        $template = ProjectTemplate::query()
+            ->published()
+            ->findOrFail((int) Arr::get($validated, 'source_template_id'));
+
+        $this->updateProjectTemplateLink->switch($project, $template);
+
+        return to_route('projects.settings.general', $project)
+            ->with('status', "{$project->name} now uses the {$template->name} template.");
+    }
+
+    public function resetTemplate(ResetProjectTemplateRequest $request, Project $project): RedirectResponse
+    {
+        $validated = $request->validated();
+
+        $template = $project->projectTemplate;
+
+        abort_if($template === null, 422, 'This project has no linked template to reset.');
+
+        $configuration = $this->duplicateProjectConfiguration->normalizeConfiguration(
+            $template->configuration_snapshot ?? [],
+        );
+        $areas = array_values(Arr::get($validated, 'areas', array_keys($configuration)));
+        $statusReplacements = Arr::get($validated, 'status_replacements', []);
+
+        $this->updateProjectTemplateLink->reset(
+            $project->load('projectTemplate'),
+            $areas,
+            $statusReplacements,
+        );
+
+        $status = Arr::has($validated, 'areas')
+            ? "Selected settings were reset to the {$template->name} template."
+            : "{$project->name} was reset to the {$template->name} template baseline.";
+
+        return back()->with('status', $status);
+    }
+
     public function access(Request $request, Project $project): Response
     {
         $user = $request->user();

app/Http/Controllers/ProjectTemplateController.php

@@ -0,0 +1,89 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Actions\Projects\CreateProjectTemplate;
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Actions\Projects\UpdateProjectTemplate;
+use App\Http\Requests\StoreProjectTemplateRequest;
+use App\Http\Requests\UpdateProjectTemplateRequest;
+use App\Http\Resources\ProjectResource;
+use App\Http\Resources\ProjectTemplateResource;
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Http\RedirectResponse;
+use Illuminate\Http\Request;
+use Inertia\Inertia;
+use Inertia\Response;
+
+class ProjectTemplateController extends Controller
+{
+    public function __construct(
+        private readonly CreateProjectTemplate $createProjectTemplate,
+        private readonly UpdateProjectTemplate $updateProjectTemplate,
+    ) {}
+
+    public function index(Request $request): Response
+    {
+        return Inertia::render('project-templates/Index', [
+            'status' => session('status'),
+            'templates' => ProjectTemplateResource::collection(
+                ProjectTemplate::query()
+                    ->published()
+                    ->with('sourceProject')
+                    ->withCount('linkedProjects')
+                    ->orderBy('name')
+                    ->get(),
+            )->resolve(),
+        ]);
+    }
+
+    public function edit(ProjectTemplate $projectTemplate): Response
+    {
+        abort_if(! $projectTemplate->is_published, 404);
+
+        $projectTemplate->load('sourceProject')->loadCount('linkedProjects');
+
+        return Inertia::render('project-templates/Edit', [
+            'copyAreaOptions' => DuplicateProjectConfiguration::copyAreaOptions(),
+            'template' => ProjectTemplateResource::make($projectTemplate)->resolve(),
+        ]);
+    }
+
+    public function create(Project $project): Response
+    {
+        return Inertia::render('project-templates/Create', [
+            'copyAreaOptions' => DuplicateProjectConfiguration::copyAreaOptions(),
+            'project' => ProjectResource::make($project)->resolve(),
+        ]);
+    }
+
+    public function store(StoreProjectTemplateRequest $request, Project $project): RedirectResponse
+    {
+        $template = $this->createProjectTemplate->handle($project, $request->validated());
+
+        return to_route('project-templates.index')
+            ->with('status', "Template {$template->name} was created.");
+    }
+
+    public function update(UpdateProjectTemplateRequest $request, ProjectTemplate $projectTemplate): RedirectResponse
+    {
+        abort_if(! $projectTemplate->is_published, 404);
+
+        $template = $this->updateProjectTemplate->handle($projectTemplate, $request->validated());
+
+        return to_route('project-templates.index')
+            ->with('status', "Template {$template->name} was updated.");
+    }
+
+    public function destroy(ProjectTemplate $projectTemplate): RedirectResponse
+    {
+        abort_if(! $projectTemplate->is_published, 404);
+
+        $templateName = $projectTemplate->name;
+        $projectTemplate->delete();
+
+        return to_route('project-templates.index')
+            ->with('status', "Template {$templateName} was deleted.");
+    }
+}

app/Http/Middleware/HandleAppearance.php

@@ -16,7 +16,11 @@ class HandleAppearance
      */
     public function handle(Request $request, Closure $next): Response
     {
-        View::share('appearance', $request->cookie('appearance') ?? 'system');
+        $appearance = $request->cookie('appearance');
+        $appearance = in_array($appearance, ['light', 'dark', 'system'], true) ? $appearance : 'system';
+
+        $request->attributes->set('appearance', $appearance);
+        View::share('appearance', $appearance);
 
         return $next($request);
     }

app/Http/Middleware/HandleInertiaRequests.php

@@ -46,6 +46,11 @@ class HandleInertiaRequests extends Middleware
         return [
             ...parent::share($request),
             'name' => config('app.name'),
+            'appearance' => $request->attributes->get('appearance', 'system'),
+            'localization' => [
+                'locale' => app()->getLocale(),
+                'timeZone' => config('app.timezone'),
+            ],
             'auth' => [
                 'permissions' => [
                     'canManageTeams' => $user !== null && ($this->permissionService->canManageAnyTeam($user) || $this->permissionService->allows($user, Permission::TeamCreate)),

app/Http/Requests/Api/MoveProjectTicketRequest.php

@@ -29,7 +29,9 @@ class MoveProjectTicketRequest extends FormRequest
             'ticket_status_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_statuses', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_statuses', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
         ];
     }

app/Http/Requests/DestroyProjectTicketTypeRequest.php

@@ -34,7 +34,9 @@ class DestroyProjectTicketTypeRequest extends FormRequest
             'replacement_ticket_type_id' => [
                 'nullable',
                 'integer',
-                Rule::exists('ticket_types', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_types', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
         ];
     }

app/Http/Requests/MoveProjectTicketRequest.php

@@ -34,7 +34,9 @@ class MoveProjectTicketRequest extends FormRequest
             'ticket_status_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_statuses', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_statuses', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'redirect_to' => ['required', 'string', Rule::in(['backlog', 'board'])],
         ];

app/Http/Requests/ResetProjectTemplateRequest.php

@@ -0,0 +1,107 @@
+<?php
+
+namespace App\Http\Requests;
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Models\Project;
+use Illuminate\Contracts\Validation\ValidationRule;
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Arr;
+use Illuminate\Validation\Rule;
+use Illuminate\Validation\Validator;
+
+class ResetProjectTemplateRequest extends FormRequest
+{
+    public function authorize(): bool
+    {
+        return true;
+    }
+
+    /**
+     * @return array<string, ValidationRule|array<mixed>|string>
+     */
+    public function rules(): array
+    {
+        /** @var Project $project */
+        $project = $this->route('project');
+
+        return [
+            'areas' => ['sometimes', 'array', 'min:1'],
+            'areas.*' => ['required', 'string', Rule::in(DuplicateProjectConfiguration::copyableAreas())],
+            'confirmation_key' => [
+                'required_without:areas',
+                'string',
+                Rule::in([$project->key]),
+            ],
+            'status_replacements' => ['sometimes', 'array'],
+            'status_replacements.*' => [
+                'required',
+                'integer',
+                Rule::exists('ticket_statuses', 'id')->where('project_id', $project->id),
+            ],
+        ];
+    }
+
+    /** @return array<int, callable(Validator): void> */
+    public function after(): array
+    {
+        return [
+            function (Validator $validator): void {
+                if ($validator->errors()->isNotEmpty()) {
+                    return;
+                }
+
+                /** @var Project $project */
+                $project = $this->route('project');
+                $validated = $validator->validated();
+                $areas = array_values(Arr::get(
+                    $validated,
+                    'areas',
+                    DuplicateProjectConfiguration::copyableAreas(),
+                ));
+
+                if (! in_array(DuplicateProjectConfiguration::COPY_TICKET_STATUSES, $areas, true)) {
+                    return;
+                }
+
+                $project->loadMissing('projectTemplate');
+                $configuration = app(DuplicateProjectConfiguration::class)->normalizeConfiguration(
+                    $project->projectTemplate?->configuration_snapshot ?? [],
+                );
+                $templateStatuses = Arr::get(
+                    $configuration,
+                    DuplicateProjectConfiguration::COPY_TICKET_STATUSES,
+                    [],
+                );
+                $statuses = $project->ticketStatuses()->withCount('tickets')->get()->values();
+                $allowedReplacementIds = $statuses->take(count($templateStatuses))->pluck('id');
+                $replacements = Arr::get($validated, 'status_replacements', []);
+
+                foreach ($statuses->slice(count($templateStatuses)) as $status) {
+                    if ($status->tickets_count === 0) {
+                        continue;
+                    }
+
+                    $replacementId = (int) Arr::get($replacements, (string) $status->id, 0);
+                    if (! $allowedReplacementIds->contains($replacementId)) {
+                        $validator->errors()->add(
+                            "status_replacements.{$status->id}",
+                            "Choose a replacement status for {$status->name}.",
+                        );
+                    }
+                }
+            },
+        ];
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    public function messages(): array
+    {
+        return [
+            'confirmation_key.in' => 'Enter the exact project key to reset this project to its template baseline.',
+            'areas.*.in' => 'Choose a valid template area to reset.',
+        ];
+    }
+}

app/Http/Requests/StoreProjectRequest.php

@@ -2,6 +2,10 @@
 
 namespace App\Http\Requests;
 
+use App\Actions\Permissions\PermissionService;
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Enums\Permission;
+use App\Models\Project;
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Foundation\Http\FormRequest;
 use Illuminate\Support\Arr;
@@ -20,12 +24,21 @@ class StoreProjectRequest extends FormRequest
     protected function prepareForValidation(): void
     {
         $key = Arr::get($this->all(), 'key');
+        $creationMode = Arr::get($this->all(), 'creation_mode', 'scratch');
+        $copyAreas = Arr::get($this->all(), 'copy_areas', []);
 
         if ($key !== null) {
             $this->merge([
                 'key' => strtoupper(trim((string) $key)),
             ]);
         }
+
+        $this->merge([
+            'creation_mode' => is_string($creationMode) ? trim($creationMode) : 'scratch',
+            'copy_areas' => is_array($copyAreas)
+                ? array_values($copyAreas)
+                : ($copyAreas === null || $copyAreas === '' ? [] : [(string) $copyAreas]),
+        ]);
     }
 
     /**
@@ -36,6 +49,7 @@ class StoreProjectRequest extends FormRequest
     public function rules(): array
     {
         return [
+            'creation_mode' => ['required', 'string', Rule::in(['scratch', 'duplicate', 'template'])],
             'key' => [
                 'required',
                 'string',
@@ -44,6 +58,51 @@ class StoreProjectRequest extends FormRequest
                 Rule::unique('projects', 'key'),
             ],
             'name' => ['required', 'string', 'max:255'],
+            'source_project_id' => [
+                Rule::requiredIf(fn (): bool => $this->input('creation_mode') === 'duplicate'),
+                'nullable',
+                'integer',
+                Rule::exists('projects', 'id'),
+                function (string $attribute, mixed $value, \Closure $fail): void {
+                    if ($value === null || $value === '') {
+                        return;
+                    }
+
+                    $project = Project::query()->find($value);
+
+                    if ($project === null) {
+                        return;
+                    }
+
+                    $permissionService = app(PermissionService::class);
+
+                    if (! $permissionService->allows($this->user(), Permission::ProjectRead, $project)) {
+                        $fail('Select a project you can access as the duplication source.');
+                    }
+                },
+            ],
+            'source_template_id' => [
+                Rule::requiredIf(fn (): bool => $this->input('creation_mode') === 'template'),
+                'nullable',
+                'integer',
+                Rule::exists('project_templates', 'id')->where(fn ($query) => $query->where('is_published', true)),
+            ],
+            'copy_areas' => ['nullable', 'array'],
+            'copy_areas.*' => [
+                'string',
+                Rule::in(DuplicateProjectConfiguration::acceptedCopyAreas()),
+            ],
+        ];
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    public function messages(): array
+    {
+        return [
+            'source_project_id.required' => 'Select a source project to duplicate from.',
+            'source_template_id.required' => 'Select a template to create the project from.',
         ];
     }
 }

app/Http/Requests/StoreProjectTemplateRequest.php

@@ -0,0 +1,39 @@
+<?php
+
+namespace App\Http\Requests;
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use Illuminate\Contracts\Validation\ValidationRule;
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Support\Str;
+use Illuminate\Validation\Rule;
+
+class StoreProjectTemplateRequest extends FormRequest
+{
+    public function authorize(): bool
+    {
+        return $this->user()?->can('create-project') ?? false;
+    }
+
+    protected function prepareForValidation(): void
+    {
+        if ($this->filled('slug')) {
+            $this->merge([
+                'slug' => Str::slug((string) $this->input('slug')),
+            ]);
+        }
+    }
+
+    /**
+     * @return array<string, ValidationRule|array<mixed>|string>
+     */
+    public function rules(): array
+    {
+        return [
+            'name' => ['required', 'string', 'max:255'],
+            'slug' => ['required', 'string', 'max:255', 'alpha_dash', Rule::unique('project_templates', 'slug')],
+            'copy_areas' => ['required', 'array', 'min:1'],
+            'copy_areas.*' => ['string', Rule::in(DuplicateProjectConfiguration::acceptedCopyAreas())],
+        ];
+    }
+}

app/Http/Requests/StoreProjectTicketBranchRequest.php

@@ -2,8 +2,10 @@
 
 namespace App\Http\Requests;
 
+use App\Models\Project;
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Validation\Rule;
 
 class StoreProjectTicketBranchRequest extends FormRequest
 {
@@ -22,9 +24,18 @@ class StoreProjectTicketBranchRequest extends FormRequest
      */
     public function rules(): array
     {
+        /** @var Project $project */
+        $project = $this->route('project');
+
         return [
             'branch_name' => ['required', 'string', 'max:255'],
-            'repository_connection_id' => ['required', 'integer', 'exists:repository_connections,id'],
+            'repository_connection_id' => [
+                'required',
+                'integer',
+                Rule::exists('repository_connections', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
+            ],
         ];
     }
 }

app/Http/Requests/StoreProjectTicketRequest.php

@@ -66,17 +66,23 @@ class StoreProjectTicketRequest extends FormRequest
             'ticket_priority_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_priorities', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_priorities', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'ticket_status_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_statuses', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_statuses', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'ticket_type_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_types', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_types', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'story_points' => ['nullable', 'integer', 'min:0'],
             'title' => ['required', 'string', 'max:255'],

app/Http/Requests/StoreTicketLinkRequest.php

@@ -38,7 +38,9 @@ class StoreTicketLinkRequest extends FormRequest
             'ticket_link_type_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_link_types', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_link_types', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
         ];
     }

app/Http/Requests/StoreTicketStatusRequest.php

@@ -31,7 +31,9 @@ class StoreTicketStatusRequest extends FormRequest
             'board_column_id' => [
                 'nullable',
                 'integer',
-                Rule::exists('board_columns', 'id')->where('project_id', $project->id),
+                Rule::exists('board_columns', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'name' => ['required', 'string', 'max:255'],
         ];

app/Http/Requests/SwitchProjectTemplateRequest.php

@@ -0,0 +1,51 @@
+<?php
+
+namespace App\Http\Requests;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Contracts\Validation\ValidationRule;
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Validation\Rule;
+
+class SwitchProjectTemplateRequest extends FormRequest
+{
+    public function authorize(): bool
+    {
+        return true;
+    }
+
+    /**
+     * @return array<string, ValidationRule|array<mixed>|string>
+     */
+    public function rules(): array
+    {
+        /** @var Project $project */
+        $project = $this->route('project');
+
+        return [
+            'confirmation_key' => [
+                'required',
+                'string',
+                Rule::in([$project->key]),
+            ],
+            'source_template_id' => [
+                'required',
+                'integer',
+                Rule::exists(ProjectTemplate::class, 'id')->where('is_published', true),
+                Rule::notIn(array_filter([$project->project_template_id])),
+            ],
+        ];
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    public function messages(): array
+    {
+        return [
+            'confirmation_key.in' => 'Enter the exact project key to confirm the template switch.',
+            'source_template_id.not_in' => 'Choose a different published template to switch this project.',
+        ];
+    }
+}

app/Http/Requests/UpdateProjectTemplateRequest.php

@@ -0,0 +1,47 @@
+<?php
+
+namespace App\Http\Requests;
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Models\ProjectTemplate;
+use Illuminate\Contracts\Validation\ValidationRule;
+use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Validation\Rule;
+
+class UpdateProjectTemplateRequest extends FormRequest
+{
+    public function authorize(): bool
+    {
+        return $this->user()?->can('create-project') ?? false;
+    }
+
+    /**
+     * @return array<string, ValidationRule|array<mixed>|string>
+     */
+    public function rules(): array
+    {
+        /** @var ProjectTemplate|null $projectTemplate */
+        $projectTemplate = $this->route('projectTemplate');
+        $requiresImpactConfirmation = $projectTemplate?->linkedProjects()->exists() ?? false;
+
+        return [
+            'name' => ['required', 'string', 'max:255'],
+            'copy_areas' => ['required', 'array', 'min:1'],
+            'copy_areas.*' => ['string', Rule::in(DuplicateProjectConfiguration::acceptedCopyAreas())],
+            'confirm_linked_projects_update' => [
+                Rule::requiredIf($requiresImpactConfirmation),
+                'accepted',
+            ],
+        ];
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    public function messages(): array
+    {
+        return [
+            'confirm_linked_projects_update.accepted' => 'Acknowledge the linked project warning before saving template changes.',
+        ];
+    }
+}

app/Http/Requests/UpdateProjectTicketRequest.php

@@ -68,7 +68,9 @@ class UpdateProjectTicketRequest extends FormRequest
             'field_values.*.ticket_field_definition_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_field_definitions', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_field_definitions', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'field_values.*.value_number' => ['nullable', 'numeric'],
             'field_values.*.value_user_id' => ['nullable', 'integer', Rule::exists('users', 'id')],
@@ -81,12 +83,16 @@ class UpdateProjectTicketRequest extends FormRequest
             'ticket_priority_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_priorities', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_priorities', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'ticket_type_id' => [
                 'required',
                 'integer',
-                Rule::exists('ticket_types', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_types', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
             'title' => ['required', 'string', 'max:255'],
             'story_points' => ['nullable', 'integer', 'min:0'],

app/Http/Requests/UpdateTicketStatusTransitionsRequest.php

@@ -34,7 +34,9 @@ class UpdateTicketStatusTransitionsRequest extends FormRequest
             'allowed_ticket_status_ids' => ['nullable', 'array'],
             'allowed_ticket_status_ids.*' => [
                 'integer',
-                Rule::exists('ticket_statuses', 'id')->where('project_id', $project->id),
+                Rule::exists('ticket_statuses', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
             ],
         ];
     }

app/Http/Requests/ValidateProjectTicketBranchRequest.php

@@ -2,8 +2,10 @@
 
 namespace App\Http\Requests;
 
+use App\Models\Project;
 use Illuminate\Contracts\Validation\ValidationRule;
 use Illuminate\Foundation\Http\FormRequest;
+use Illuminate\Validation\Rule;
 
 class ValidateProjectTicketBranchRequest extends FormRequest
 {
@@ -22,9 +24,18 @@ class ValidateProjectTicketBranchRequest extends FormRequest
      */
     public function rules(): array
     {
+        /** @var Project $project */
+        $project = $this->route('project');
+
         return [
             'branch_name' => ['required', 'string', 'max:255'],
-            'repository_connection_id' => ['required', 'integer', 'exists:repository_connections,id'],
+            'repository_connection_id' => [
+                'required',
+                'integer',
+                Rule::exists('repository_connections', 'id')->where(
+                    fn ($query) => $query->where('project_id', $project->id),
+                ),
+            ],
         ];
     }
 }

app/Http/Resources/ProjectResource.php

@@ -2,8 +2,10 @@
 
 namespace App\Http\Resources;
 
+use App\Actions\Projects\ResolveProjectTemplateState;
 use Illuminate\Http\Request;
 use Illuminate\Http\Resources\Json\JsonResource;
+use Illuminate\Support\Arr;
 
 class ProjectResource extends JsonResource
 {
@@ -14,10 +16,33 @@ class ProjectResource extends JsonResource
      */
     public function toArray(Request $request): array
     {
+        $this->resource->loadMissing('projectTemplate');
+
+        $templateState = app(ResolveProjectTemplateState::class)->handle($this->resource);
+
         return [
             'id' => $this->id,
             'name' => $this->name,
             'key' => $this->key,
+            'project_template_id' => $this->project_template_id,
+            'project_template' => $this->projectTemplate === null
+                ? null
+                : ProjectTemplateResource::make($this->projectTemplate)->resolve(),
+            'template_state' => $templateState === null
+                ? null
+                : [
+                    'effective_configuration' => Arr::get($templateState, 'effectiveConfiguration', []),
+                    'inherited_areas' => Arr::get($templateState, 'inheritedAreas', []),
+                    'inherited_configuration' => Arr::get($templateState, 'inheritedConfiguration', []),
+                    'inherits_from_template' => Arr::get($templateState, 'inheritsFromTemplate', false),
+                    'overridden_areas' => Arr::get($templateState, 'overriddenAreas', []),
+                    'overridden_configuration' => Arr::get($templateState, 'overriddenConfiguration', []),
+                    'reset_requirements' => Arr::get($templateState, 'resetRequirements', []),
+                    'template_configuration' => Arr::get($templateState, 'templateConfiguration', []),
+                    'template_id' => Arr::get($templateState, 'templateId'),
+                    'template_name' => Arr::get($templateState, 'templateName'),
+                    'template_slug' => Arr::get($templateState, 'templateSlug'),
+                ],
             'show_author' => $this->show_author,
             'show_story_points' => $this->show_story_points,
             'created_at' => $this->created_at?->toISOString(),

app/Http/Resources/ProjectTemplateResource.php

@@ -0,0 +1,58 @@
+<?php
+
+namespace App\Http\Resources;
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Models\ProjectTemplate;
+use Illuminate\Http\Request;
+use Illuminate\Http\Resources\Json\JsonResource;
+use Illuminate\Support\Arr;
+
+class ProjectTemplateResource extends JsonResource
+{
+    /**
+     * Transform the resource into an array.
+     *
+     * @return array<string, mixed>
+     */
+    public function toArray(Request $request): array
+    {
+        if ($this->resource instanceof ProjectTemplate) {
+            $configuration = app(DuplicateProjectConfiguration::class);
+
+            return [
+                'id' => $this->id,
+                'project_id' => $this->project_id,
+                'source_project_id' => $this->source_project_id,
+                'source_project' => $this->relationLoaded('sourceProject') && $this->sourceProject !== null
+                    ? ProjectResource::make($this->sourceProject)->resolve()
+                    : null,
+                'name' => $this->name,
+                'slug' => $this->slug,
+                'is_published' => $this->is_published,
+                'copy_areas' => $configuration->normalizeCopyAreas($this->copy_areas ?? []),
+                'configuration_snapshot' => $configuration->normalizeConfiguration(
+                    $this->configuration_snapshot ?? [],
+                ),
+                'linked_project_count' => $this->whenCounted('linkedProjects'),
+                'created_at' => $this->created_at?->toISOString(),
+                'updated_at' => $this->updated_at?->toISOString(),
+            ];
+        }
+
+        return [
+            'id' => Arr::get($this->resource, 'id'),
+            'project_id' => Arr::get($this->resource, 'project_id'),
+            'source_project_id' => Arr::get($this->resource, 'source_project_id'),
+            'source_project' => Arr::get($this->resource, 'source_project'),
+            'name' => Arr::get($this->resource, 'name'),
+            'slug' => Arr::get($this->resource, 'slug'),
+            'is_published' => Arr::get($this->resource, 'is_published', true),
+            'copy_areas' => Arr::get($this->resource, 'copy_areas', []),
+            'configuration_snapshot' => Arr::get($this->resource, 'configuration_snapshot', []),
+            'linked_project_count' => Arr::get($this->resource, 'linked_project_count'),
+            'created_at' => Arr::get($this->resource, 'created_at'),
+            'updated_at' => Arr::get($this->resource, 'updated_at'),
+        ];
+    }
+}

app/Mcp/Servers/KanbanGitServer.php

@@ -2,9 +2,11 @@
 
 namespace App\Mcp\Servers;
 
+use App\Mcp\Tools\CreateTicket;
 use App\Mcp\Tools\GetTicket;
 use App\Mcp\Tools\ListMyAssignedTickets;
 use App\Mcp\Tools\ListTicketsByStatus;
+use App\Mcp\Tools\ListTicketTypes;
 use App\Mcp\Tools\MoveTicketStatus;
 use App\Mcp\Tools\UpdateTicketAssignee;
 use App\Mcp\Tools\UpdateTicketDescription;
@@ -15,7 +17,7 @@ use Laravel\Mcp\Server\Attributes\Version;
 
 #[Name('KanbanGit MCP')]
 #[Version('0.1.0')]
-#[Instructions('Use these tools to read and update KanbanGit tickets with the authenticated application key owner permissions. Prefer stable IDs when available, especially ticket_id and ticket_status_id.')]
+#[Instructions('Use these tools to read, create, and update KanbanGit tickets with the authenticated application key owner permissions. Prefer stable IDs when available, especially project_id, ticket_id, ticket_type_id, and ticket_status_id. Use list_ticket_types to discover the available ticket types in a project. Use create_ticket with parent_ticket_id to create a child ticket.')]
 class KanbanGitServer extends Server
 {
     protected array $tools = [
@@ -25,6 +27,8 @@ class KanbanGitServer extends Server
         UpdateTicketDescription::class,
         UpdateTicketAssignee::class,
         MoveTicketStatus::class,
+        CreateTicket::class,
+        ListTicketTypes::class,
     ];
 
     protected array $resources = [

app/Mcp/Support/KanbanGitMcp.php

@@ -120,6 +120,24 @@ class KanbanGitMcp
         return $project;
     }
 
+    /**
+     * @throws AuthorizationException
+     */
+    public function projectForWrite(User $user, int $projectId): Project
+    {
+        $project = Project::query()->find($projectId);
+
+        if ($project === null) {
+            throw ValidationException::withMessages([
+                'project_id' => 'Project was not found.',
+            ]);
+        }
+
+        $this->ensureCanWrite($user, $project);
+
+        return $project;
+    }
+
     /**
      * @param  array<string, mixed>  $validated
      * @return Collection<int, TicketStatus>|Response
@@ -189,10 +207,12 @@ class KanbanGitMcp
     public function ticketPayload(Ticket $ticket): array
     {
         $ticket->load([
+            'acceptanceCriteria',
             'assignee',
             'author',
             'fieldValues.ticketFieldDefinition',
             'fieldValues.userValue',
+            'parentTicket',
             'project',
             'ticketPriority',
             'ticketStatus.boardColumn',

app/Mcp/Tools/CreateTicket.php

@@ -0,0 +1,169 @@
+<?php
+
+namespace App\Mcp\Tools;
+
+use App\Actions\Permissions\PermissionService;
+use App\Actions\Tickets\CreateProjectTicket;
+use App\Actions\Tickets\Support\AcceptanceCriteriaChecklistMapper;
+use App\Enums\Permission;
+use App\Mcp\Support\KanbanGitMcp;
+use App\Models\Project;
+use App\Models\Ticket;
+use App\Models\User;
+use Illuminate\Contracts\JsonSchema\JsonSchema;
+use Illuminate\JsonSchema\Types\Type;
+use Illuminate\Support\Arr;
+use Illuminate\Validation\Rule;
+use Illuminate\Validation\ValidationException;
+use Laravel\Mcp\Request;
+use Laravel\Mcp\Response;
+use Laravel\Mcp\ResponseFactory;
+use Laravel\Mcp\Server\Attributes\Description;
+use Laravel\Mcp\Server\Attributes\Name;
+use Laravel\Mcp\Server\Tool;
+use Laravel\Mcp\Server\Tools\Annotations\IsDestructive;
+
+#[Name('create_ticket')]
+#[Description('Create a ticket with all editable ticket fields, including its type, initial status, priority, assignee, author, description, story points, acceptance criteria, blocked state, and custom field values. Set parent_ticket_id to create a child of an existing ticket in the same project whose type allows children. Requires project write permission; overriding the author requires project admin permission. Ticket IDs, keys, sequence numbers, timestamps, and worklog entries are generated automatically.')]
+#[IsDestructive(false)]
+class CreateTicket extends Tool
+{
+    public function __construct(
+        private readonly KanbanGitMcp $kanbanGitMcp,
+        private readonly CreateProjectTicket $createProjectTicket,
+        private readonly PermissionService $permissionService,
+    ) {}
+
+    public function handle(Request $request): Response|ResponseFactory
+    {
+        $projectInput = $request->validate([
+            'project_id' => ['required', 'integer'],
+        ]);
+
+        $user = $this->kanbanGitMcp->user($request);
+        $project = $this->kanbanGitMcp->projectForWrite($user, (int) Arr::get($projectInput, 'project_id'));
+        $validated = $request->validate([
+            'title' => ['required', 'string', 'max:255'],
+            'description' => ['nullable', 'string'],
+            'ticket_type_id' => ['required', 'integer', Rule::exists('ticket_types', 'id')->where('project_id', $project->id)],
+            'ticket_status_id' => ['required', 'integer', Rule::exists('ticket_statuses', 'id')->where('project_id', $project->id)],
+            'ticket_priority_id' => ['required', 'integer', Rule::exists('ticket_priorities', 'id')->where('project_id', $project->id)],
+            'parent_ticket_id' => ['nullable', 'integer', Rule::exists('tickets', 'id')->where('project_id', $project->id)],
+            'assignee_user_id' => ['nullable', 'integer', Rule::exists('users', 'id')],
+            'author_user_id' => ['nullable', 'integer', Rule::exists('users', 'id')],
+            'story_points' => ['nullable', 'integer', 'min:0'],
+            'is_blocked' => ['sometimes', 'boolean'],
+            'blocked_comment' => ['nullable', 'string'],
+            'acceptance_criteria' => ['nullable', 'array', 'list'],
+            'acceptance_criteria.*' => ['array:text,checked,indent'],
+            'acceptance_criteria.*.text' => ['required', 'string'],
+            'acceptance_criteria.*.checked' => ['sometimes', 'boolean'],
+            'acceptance_criteria.*.indent' => ['sometimes', 'integer', 'min:0', 'max:'.AcceptanceCriteriaChecklistMapper::MAX_INDENT_LEVEL],
+            'field_values' => ['sometimes', 'array', 'list'],
+            'field_values.*' => ['array:ticket_field_definition_id,value_number,value_user_id'],
+            'field_values.*.ticket_field_definition_id' => [
+                'required', 'integer', 'distinct',
+                Rule::exists('ticket_field_definitions', 'id')->where('project_id', $project->id),
+            ],
+            'field_values.*.value_number' => ['nullable', 'numeric'],
+            'field_values.*.value_user_id' => ['nullable', 'integer', Rule::exists('users', 'id')],
+        ]);
+
+        $this->validateTicketConstraints($project, $user, $validated);
+
+        $ticket = $this->createProjectTicket->handle($project, $validated, $user);
+
+        return Response::structured([
+            'data' => $this->kanbanGitMcp->ticketPayload($ticket->fresh()),
+            'meta' => [
+                'message' => "{$ticket->ticket_key} was created.",
+            ],
+        ]);
+    }
+
+    /**
+     * @param  array<string, mixed>  $validated
+     */
+    private function validateTicketConstraints(Project $project, User $user, array $validated): void
+    {
+        $errors = [];
+        $parentTicketId = Arr::get($validated, 'parent_ticket_id');
+
+        if ($parentTicketId !== null) {
+            $parentTicket = Ticket::query()
+                ->where('project_id', $project->id)
+                ->with('ticketType')
+                ->find($parentTicketId);
+
+            if (! $parentTicket?->ticketType?->is_parent) {
+                $errors['parent_ticket_id'] = 'Only tickets with a parent-enabled type can be selected as a parent.';
+            }
+        }
+
+        if (Arr::get($validated, 'is_blocked', false) && blank(Arr::get($validated, 'blocked_comment'))) {
+            $errors['blocked_comment'] = 'Blocked tickets require a blocker comment.';
+        }
+
+        if (
+            Arr::exists($validated, 'author_user_id')
+            && (int) Arr::get($validated, 'author_user_id') !== $user->id
+            && ! $this->permissionService->allows($user, Permission::ProjectAdmin, $project)
+        ) {
+            $errors['author_user_id'] = 'Only project admins can change the author.';
+        }
+
+        $fieldValues = Arr::get($validated, 'field_values', []);
+
+        if ($fieldValues !== []) {
+            $fieldDefinitions = $project->ticketFieldDefinitions()->get()->keyBy('id');
+
+            foreach ($fieldValues as $index => $fieldValue) {
+                $fieldDefinition = $fieldDefinitions->get((int) Arr::get($fieldValue, 'ticket_field_definition_id'));
+                $incompatibleValue = $fieldDefinition->field_type === 'user' ? 'value_number' : 'value_user_id';
+
+                if (Arr::get($fieldValue, $incompatibleValue) !== null) {
+                    $errors["field_values.{$index}.{$incompatibleValue}"] = 'The value must match the custom field type.';
+                }
+            }
+        }
+
+        if ($errors !== []) {
+            throw ValidationException::withMessages($errors);
+        }
+    }
+
+    /**
+     * @return array<string, Type>
+     */
+    public function schema(JsonSchema $schema): array
+    {
+        return [
+            'project_id' => $schema->integer()->description('Project ID.')->required(),
+            'title' => $schema->string()->max(255)->description('Ticket title.')->required(),
+            'description' => $schema->string()->nullable()->description('Ticket description.'),
+            'ticket_type_id' => $schema->integer()->description('Ticket type ID belonging to the project. Explicitly selects the type, including types that allow child tickets.')->required(),
+            'ticket_status_id' => $schema->integer()->description('Initial ticket status ID belonging to the project.')->required(),
+            'ticket_priority_id' => $schema->integer()->description('Ticket priority ID belonging to the project.')->required(),
+            'parent_ticket_id' => $schema->integer()->nullable()->description('Existing parent ticket ID in the same project. Its type must allow children. Omit or pass null for a top-level ticket.'),
+            'assignee_user_id' => $schema->integer()->nullable()->description('User ID to assign. Omit or pass null to leave unassigned.'),
+            'author_user_id' => $schema->integer()->nullable()->description('Defaults to the application key owner when omitted. Only project admins may choose another author or pass null for no author.'),
+            'story_points' => $schema->integer()->min(0)->nullable()->description('Non-negative story point estimate.'),
+            'is_blocked' => $schema->boolean()->default(false)->description('Whether the ticket is blocked. Requires a nonblank blocked_comment when true.'),
+            'blocked_comment' => $schema->string()->nullable()->description('Blocker reason. Stored only when is_blocked is true.'),
+            'acceptance_criteria' => $schema->array()->nullable()
+                ->items($schema->object([
+                    'text' => $schema->string()->description('Checklist item text.')->required(),
+                    'checked' => $schema->boolean()->default(false),
+                    'indent' => $schema->integer()->min(0)->max(AcceptanceCriteriaChecklistMapper::MAX_INDENT_LEVEL)->default(0),
+                ])->withoutAdditionalProperties())
+                ->description('Ordered acceptance checklist. Indent 0 is a root item; larger values nest under preceding items.'),
+            'field_values' => $schema->array()
+                ->items($schema->object([
+                    'ticket_field_definition_id' => $schema->integer()->description('Custom field definition ID belonging to the project. Each definition may appear once.')->required(),
+                    'value_number' => $schema->number()->nullable()->description('Value for a numeric field.'),
+                    'value_user_id' => $schema->integer()->nullable()->description('User ID for a user field.'),
+                ])->withoutAdditionalProperties())
+                ->description('Custom field values. Supply the value matching each definition type; omit or pass null for an empty value.'),
+        ];
+    }
+}

app/Mcp/Tools/ListTicketTypes.php

@@ -0,0 +1,56 @@
+<?php
+
+namespace App\Mcp\Tools;
+
+use App\Http\Resources\ProjectResource;
+use App\Http\Resources\TicketTypeResource;
+use App\Mcp\Support\KanbanGitMcp;
+use Illuminate\Contracts\JsonSchema\JsonSchema;
+use Illuminate\JsonSchema\Types\Type;
+use Illuminate\Support\Arr;
+use Laravel\Mcp\Request;
+use Laravel\Mcp\Response;
+use Laravel\Mcp\ResponseFactory;
+use Laravel\Mcp\Server\Attributes\Description;
+use Laravel\Mcp\Server\Attributes\Name;
+use Laravel\Mcp\Server\Tool;
+use Laravel\Mcp\Server\Tools\Annotations\IsReadOnly;
+
+#[Name('list_ticket_types')]
+#[Description('List all ticket types in a visible project in their configured order, including IDs, names, and is_parent. Use a returned ID as ticket_type_id when creating a ticket. Types with is_parent=true allow tickets of that type to have child tickets; set parent_ticket_id on create_ticket to attach a child to an existing parent ticket.')]
+#[IsReadOnly]
+class ListTicketTypes extends Tool
+{
+    public function __construct(
+        private readonly KanbanGitMcp $kanbanGitMcp,
+    ) {}
+
+    public function handle(Request $request): Response|ResponseFactory
+    {
+        $validated = $request->validate([
+            'project_id' => ['required', 'integer'],
+        ]);
+
+        $user = $this->kanbanGitMcp->user($request);
+        $project = $this->kanbanGitMcp->projectForRead($user, (int) Arr::get($validated, 'project_id'));
+
+        return Response::structured([
+            'data' => [
+                'project' => ProjectResource::make($project)->resolve(),
+                'ticket_types' => TicketTypeResource::collection($project->ticketTypes()->get())->resolve(),
+            ],
+        ]);
+    }
+
+    /**
+     * @return array<string, Type>
+     */
+    public function schema(JsonSchema $schema): array
+    {
+        return [
+            'project_id' => $schema->integer()
+                ->description('Project ID. Requires permission to view this project.')
+                ->required(),
+        ];
+    }
+}

app/Models/BoardColumn.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\BoardColumnFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
@@ -10,12 +11,21 @@ use Illuminate\Database\Eloquent\Relations\BelongsTo;
 use Illuminate\Database\Eloquent\Relations\HasMany;
 use Illuminate\Database\Eloquent\Relations\HasManyThrough;
 
-#[Fillable(['name', 'position', 'project_id'])]
+#[Fillable(['name', 'position', 'project_id', 'project_template_id'])]
 class BoardColumn extends Model
 {
     /** @use HasFactory<BoardColumnFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
+    protected static function booted(): void
+    {
+        static::saving(function (self $boardColumn): void {
+            $boardColumn->syncProjectTemplateOwnership();
+        });
+    }
+
     public function project(): BelongsTo
     {
         return $this->belongsTo(Project::class);

app/Models/Concerns/SyncsProjectTemplateOwnership.php

@@ -0,0 +1,41 @@
+<?php
+
+namespace App\Models\Concerns;
+
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Database\Eloquent\Relations\BelongsTo;
+
+trait SyncsProjectTemplateOwnership
+{
+    protected function syncProjectTemplateOwnership(): void
+    {
+        $projectTemplateId = $this->getAttribute('project_template_id');
+        $projectId = $this->getAttribute('project_id');
+
+        if ($projectTemplateId === null && $projectId !== null) {
+            $projectTemplateId = Project::query()
+                ->whereKey($projectId)
+                ->value('project_template_id');
+
+            if ($projectTemplateId !== null) {
+                $this->setAttribute('project_template_id', $projectTemplateId);
+            }
+        }
+
+        if ($projectId === null && $projectTemplateId !== null) {
+            $projectId = ProjectTemplate::query()
+                ->whereKey($projectTemplateId)
+                ->value('project_id');
+
+            if ($projectId !== null) {
+                $this->setAttribute('project_id', $projectId);
+            }
+        }
+    }
+
+    public function projectTemplate(): BelongsTo
+    {
+        return $this->belongsTo(ProjectTemplate::class);
+    }
+}

app/Models/NotificationAction.php

@@ -4,6 +4,7 @@ namespace App\Models;
 
 use App\Enums\NotificationChannel;
 use App\Enums\NotificationEventType;
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\NotificationActionFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Attributes\Hidden;
@@ -23,6 +24,7 @@ use Illuminate\Database\Eloquent\Relations\HasMany;
     'message_template',
     'name',
     'project_id',
+    'project_template_id',
 ])]
 #[Hidden(['delivery_url'])]
 class NotificationAction extends Model
@@ -30,6 +32,8 @@ class NotificationAction extends Model
     /** @use HasFactory<NotificationActionFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
     /**
      * @return array<string, string>
      */
@@ -45,6 +49,13 @@ class NotificationAction extends Model
         ];
     }
 
+    protected static function booted(): void
+    {
+        static::saving(function (self $notificationAction): void {
+            $notificationAction->syncProjectTemplateOwnership();
+        });
+    }
+
     public function scopeEnabled(Builder $query): Builder
     {
         return $query->where('enabled', true);

app/Models/Project.php

@@ -7,11 +7,13 @@ use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Casts\Attribute;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Relations\BelongsTo;
 use Illuminate\Database\Eloquent\Relations\HasMany;
+use Illuminate\Database\Eloquent\Relations\HasOne;
 use Illuminate\Database\Eloquent\Relations\MorphMany;
 use Illuminate\Support\Str;
 
-#[Fillable(['name', 'key', 'show_author', 'show_story_points'])]
+#[Fillable(['name', 'key', 'project_template_id', 'show_author', 'show_story_points', 'template_overrides'])]
 class Project extends Model
 {
     /** @use HasFactory<ProjectFactory> */
@@ -22,6 +24,7 @@ class Project extends Model
         return [
             'show_author' => 'boolean',
             'show_story_points' => 'boolean',
+            'template_overrides' => 'array',
         ];
     }
 
@@ -44,6 +47,17 @@ class Project extends Model
         return $this->morphMany(PermissionAssignment::class, 'scope');
     }
 
+    public function projectTemplate(): BelongsTo
+    {
+        return $this->belongsTo(ProjectTemplate::class, 'project_template_id');
+    }
+
+    public function baseTemplate(): HasOne
+    {
+        return $this->hasOne(ProjectTemplate::class)
+            ->where('is_published', false);
+    }
+
     public function boardColumns(): HasMany
     {
         return $this->hasMany(BoardColumn::class)
@@ -95,6 +109,21 @@ class Project extends Model
             ->orderBy('id');
     }
 
+    /** @return list<string> */
+    public function configurationRelations(): array
+    {
+        return [
+            'boardColumns',
+            'notificationActions',
+            'repositoryConnections',
+            'ticketFieldDefinitions',
+            'ticketLinkTypes',
+            'ticketPriorities',
+            'ticketStatuses',
+            'ticketTypes',
+        ];
+    }
+
     public function tickets(): HasMany
     {
         return $this->hasMany(Ticket::class)

app/Models/ProjectTemplate.php

@@ -0,0 +1,47 @@
+<?php
+
+namespace App\Models;
+
+use Database\Factories\ProjectTemplateFactory;
+use Illuminate\Database\Eloquent\Attributes\Fillable;
+use Illuminate\Database\Eloquent\Builder;
+use Illuminate\Database\Eloquent\Factories\HasFactory;
+use Illuminate\Database\Eloquent\Model;
+use Illuminate\Database\Eloquent\Relations\BelongsTo;
+use Illuminate\Database\Eloquent\Relations\HasMany;
+
+#[Fillable(['project_id', 'source_project_id', 'name', 'slug', 'is_published', 'copy_areas', 'configuration_snapshot'])]
+class ProjectTemplate extends Model
+{
+    /** @use HasFactory<ProjectTemplateFactory> */
+    use HasFactory;
+
+    protected function casts(): array
+    {
+        return [
+            'copy_areas' => 'array',
+            'configuration_snapshot' => 'array',
+            'is_published' => 'boolean',
+        ];
+    }
+
+    public function scopePublished(Builder $query): Builder
+    {
+        return $query->where('is_published', true);
+    }
+
+    public function project(): BelongsTo
+    {
+        return $this->belongsTo(Project::class);
+    }
+
+    public function sourceProject(): BelongsTo
+    {
+        return $this->belongsTo(Project::class, 'source_project_id');
+    }
+
+    public function linkedProjects(): HasMany
+    {
+        return $this->hasMany(Project::class, 'project_template_id');
+    }
+}

app/Models/RepositoryConnection.php

@@ -4,6 +4,7 @@ namespace App\Models;
 
 use App\Actions\Git\Data\GitRepository;
 use App\Actions\Git\GitProviderKey;
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\RepositoryConnectionFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
@@ -14,6 +15,7 @@ use Illuminate\Database\Eloquent\Relations\BelongsTo;
     'base_url',
     'owner_name',
     'project_id',
+    'project_template_id',
     'provider',
     'provider_repository_id',
     'repository_full_name',
@@ -25,6 +27,8 @@ class RepositoryConnection extends Model
     /** @use HasFactory<RepositoryConnectionFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
     /**
      * @return array<string, string>
      */
@@ -35,6 +39,13 @@ class RepositoryConnection extends Model
         ];
     }
 
+    protected static function booted(): void
+    {
+        static::saving(function (self $repositoryConnection): void {
+            $repositoryConnection->syncProjectTemplateOwnership();
+        });
+    }
+
     public function project(): BelongsTo
     {
         return $this->belongsTo(Project::class);

app/Models/TicketFieldDefinition.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\TicketFieldDefinitionFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
@@ -9,7 +10,7 @@ use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
 use Illuminate\Database\Eloquent\Relations\HasMany;
 
-#[Fillable(['field_type', 'label', 'position', 'project_id'])]
+#[Fillable(['field_type', 'label', 'position', 'project_id', 'project_template_id'])]
 class TicketFieldDefinition extends Model
 {
     /**
@@ -23,6 +24,15 @@ class TicketFieldDefinition extends Model
     /** @use HasFactory<TicketFieldDefinitionFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
+    protected static function booted(): void
+    {
+        static::saving(function (self $ticketFieldDefinition): void {
+            $ticketFieldDefinition->syncProjectTemplateOwnership();
+        });
+    }
+
     public function project(): BelongsTo
     {
         return $this->belongsTo(Project::class);

app/Models/TicketLinkType.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\TicketLinkTypeFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
@@ -9,12 +10,21 @@ use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
 use Illuminate\Database\Eloquent\Relations\HasMany;
 
-#[Fillable(['label', 'counterpart_label', 'position', 'project_id'])]
+#[Fillable(['label', 'counterpart_label', 'position', 'project_id', 'project_template_id'])]
 class TicketLinkType extends Model
 {
     /** @use HasFactory<TicketLinkTypeFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
+    protected static function booted(): void
+    {
+        static::saving(function (self $ticketLinkType): void {
+            $ticketLinkType->syncProjectTemplateOwnership();
+        });
+    }
+
     public function counterpartLabel(): string
     {
         return $this->counterpart_label ?: $this->label;

app/Models/TicketPriority.php

@@ -2,20 +2,36 @@
 
 namespace App\Models;
 
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\TicketPriorityFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
+use Illuminate\Database\Eloquent\Relations\HasMany;
 
-#[Fillable(['name', 'position', 'project_id'])]
+#[Fillable(['name', 'position', 'project_id', 'project_template_id'])]
 class TicketPriority extends Model
 {
     /** @use HasFactory<TicketPriorityFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
+    protected static function booted(): void
+    {
+        static::saving(function (self $ticketPriority): void {
+            $ticketPriority->syncProjectTemplateOwnership();
+        });
+    }
+
     public function project(): BelongsTo
     {
         return $this->belongsTo(Project::class);
     }
+
+    public function tickets(): HasMany
+    {
+        return $this->hasMany(Ticket::class);
+    }
 }

app/Models/TicketStatus.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\TicketStatusFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
@@ -11,15 +12,24 @@ use Illuminate\Database\Eloquent\Relations\BelongsToMany;
 use Illuminate\Database\Eloquent\Relations\HasMany;
 use Illuminate\Support\Str;
 
-#[Fillable(['board_column_id', 'name', 'position', 'project_id', 'slug'])]
+#[Fillable(['board_column_id', 'name', 'position', 'project_id', 'project_template_id', 'slug'])]
 class TicketStatus extends Model
 {
     /** @use HasFactory<TicketStatusFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
     protected static function booted(): void
     {
         static::saving(function (self $ticketStatus): void {
+            if ($ticketStatus->project_template_id === null && $ticketStatus->board_column_id !== null) {
+                $ticketStatus->project_template_id = BoardColumn::query()
+                    ->whereKey($ticketStatus->board_column_id)
+                    ->value('project_template_id');
+            }
+
+            $ticketStatus->syncProjectTemplateOwnership();
             $ticketStatus->slug = Str::slug($ticketStatus->name);
         });
     }

app/Models/TicketType.php

@@ -2,6 +2,7 @@
 
 namespace App\Models;
 
+use App\Models\Concerns\SyncsProjectTemplateOwnership;
 use Database\Factories\TicketTypeFactory;
 use Illuminate\Database\Eloquent\Attributes\Fillable;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
@@ -9,12 +10,21 @@ use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
 use Illuminate\Database\Eloquent\Relations\HasMany;
 
-#[Fillable(['name', 'position', 'project_id', 'is_parent'])]
+#[Fillable(['name', 'position', 'project_id', 'project_template_id', 'is_parent'])]
 class TicketType extends Model
 {
     /** @use HasFactory<TicketTypeFactory> */
     use HasFactory;
 
+    use SyncsProjectTemplateOwnership;
+
+    protected static function booted(): void
+    {
+        static::saving(function (self $ticketType): void {
+            $ticketType->syncProjectTemplateOwnership();
+        });
+    }
+
     protected function casts(): array
     {
         return [

app/Observers/ProjectConfigurationObserver.php

@@ -0,0 +1,66 @@
+<?php
+
+namespace App\Observers;
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Actions\Projects\ProjectTemplateOverrideManager;
+use App\Actions\Projects\RefreshProjectBaseTemplate;
+use App\Models\BoardColumn;
+use App\Models\NotificationAction;
+use App\Models\RepositoryConnection;
+use App\Models\TicketFieldDefinition;
+use App\Models\TicketLinkType;
+use App\Models\TicketPriority;
+use App\Models\TicketStatus;
+use App\Models\TicketType;
+use Illuminate\Database\Eloquent\Model;
+
+class ProjectConfigurationObserver
+{
+    public function __construct(
+        private readonly ProjectTemplateOverrideManager $projectTemplateOverrideManager,
+        private readonly RefreshProjectBaseTemplate $refreshProjectBaseTemplate,
+    ) {}
+
+    public function saved(Model $model): void
+    {
+        $this->markOverride($model);
+    }
+
+    public function deleted(Model $model): void
+    {
+        $this->markOverride($model);
+    }
+
+    private function markOverride(Model $model): void
+    {
+        if (! $this->projectTemplateOverrideManager->isRecording()) {
+            return;
+        }
+
+        $project = $model->project()->first();
+
+        if ($project === null) {
+            return;
+        }
+
+        $area = match (true) {
+            $model instanceof BoardColumn => DuplicateProjectConfiguration::COPY_BOARD_COLUMNS,
+            $model instanceof TicketStatus => DuplicateProjectConfiguration::COPY_TICKET_STATUSES,
+            $model instanceof TicketType => DuplicateProjectConfiguration::COPY_TICKET_TYPES,
+            $model instanceof TicketPriority => DuplicateProjectConfiguration::COPY_TICKET_PRIORITIES,
+            $model instanceof TicketFieldDefinition => DuplicateProjectConfiguration::COPY_TICKET_FIELDS,
+            $model instanceof TicketLinkType => DuplicateProjectConfiguration::COPY_TICKET_LINK_TYPES,
+            $model instanceof RepositoryConnection => DuplicateProjectConfiguration::COPY_REPOSITORY_CONNECTIONS,
+            $model instanceof NotificationAction => DuplicateProjectConfiguration::COPY_NOTIFICATION_ACTIONS,
+            default => null,
+        };
+
+        if ($area === null) {
+            return;
+        }
+
+        $this->refreshProjectBaseTemplate->handle($project, $area);
+        $this->projectTemplateOverrideManager->mark($project, $area);
+    }
+}

app/Providers/AppServiceProvider.php

@@ -8,9 +8,18 @@ use App\Actions\Notifications\TicketCreated;
 use App\Actions\Notifications\TicketStatusChanged;
 use App\Actions\Permissions\PermissionService;
 use App\Enums\Permission;
+use App\Models\BoardColumn;
+use App\Models\NotificationAction;
 use App\Models\Project;
+use App\Models\RepositoryConnection;
 use App\Models\Team;
+use App\Models\TicketFieldDefinition;
+use App\Models\TicketLinkType;
+use App\Models\TicketPriority;
+use App\Models\TicketStatus;
+use App\Models\TicketType;
 use App\Models\User;
+use App\Observers\ProjectConfigurationObserver;
 use Carbon\CarbonImmutable;
 use Illuminate\Database\Eloquent\Relations\Relation;
 use Illuminate\Support\Facades\Date;
@@ -36,6 +45,18 @@ class AppServiceProvider extends ServiceProvider
      */
     public function boot(): void
     {
+        foreach ([
+            BoardColumn::class,
+            NotificationAction::class,
+            RepositoryConnection::class,
+            TicketFieldDefinition::class,
+            TicketLinkType::class,
+            TicketPriority::class,
+            TicketStatus::class,
+            TicketType::class,
+        ] as $model) {
+            $model::observe(ProjectConfigurationObserver::class);
+        }
 
         if ($this->app->environment() !== 'local') {
             URL::forceScheme('https');

database/factories/ProjectFactory.php

@@ -23,6 +23,7 @@ class ProjectFactory extends Factory
             'key' => Str::upper(fake()->unique()->lexify('?????')),
             'show_author' => true,
             'show_story_points' => true,
+            'template_overrides' => [],
         ];
     }
 }

database/factories/ProjectTemplateFactory.php

@@ -0,0 +1,36 @@
+<?php
+
+namespace Database\Factories;
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Database\Eloquent\Factories\Factory;
+use Illuminate\Support\Str;
+
+/**
+ * @extends Factory<ProjectTemplate>
+ */
+class ProjectTemplateFactory extends Factory
+{
+    /**
+     * Define the model's default state.
+     *
+     * @return array<string, mixed>
+     */
+    public function definition(): array
+    {
+        return [
+            'source_project_id' => Project::factory(),
+            'name' => Str::title(fake()->unique()->words(3, true)),
+            'slug' => fake()->unique()->slug(),
+            'copy_areas' => [DuplicateProjectConfiguration::COPY_PROJECT_SETTINGS],
+            'configuration_snapshot' => [
+                DuplicateProjectConfiguration::COPY_PROJECT_SETTINGS => [
+                    'show_author' => true,
+                    'show_story_points' => true,
+                ],
+            ],
+        ];
+    }
+}

database/migrations/2026_05_25_011500_create_project_templates_table.php

@@ -0,0 +1,34 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::create('project_templates', function (Blueprint $table): void {
+            $table->id();
+            $table->foreignId('source_project_id')->nullable()->constrained('projects')->nullOnDelete();
+            $table->string('name');
+            $table->string('slug')->unique();
+            $table->json('copy_areas');
+            $table->json('configuration_snapshot');
+            $table->timestamps();
+
+            $table->index(['source_project_id', 'name']);
+        });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::dropIfExists('project_templates');
+    }
+};

database/migrations/2026_05_25_013000_project_templates_as_project_baselines.php

@@ -0,0 +1,54 @@
+<?php
+
+use App\Actions\Projects\CreateProjectBaseTemplate;
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    public function up(): void
+    {
+        Schema::table('project_templates', function (Blueprint $table): void {
+            $table->foreignId('project_id')->nullable()->after('id')->constrained('projects')->nullOnDelete();
+            $table->boolean('is_published')->default(true)->after('slug');
+        });
+
+        Schema::table('projects', function (Blueprint $table): void {
+            $table->foreignId('project_template_id')->nullable()->after('key')->constrained('project_templates')->nullOnDelete();
+        });
+
+        $projects = Project::query()->whereNull('project_template_id')->get();
+        $createProjectBaseTemplate = app(CreateProjectBaseTemplate::class);
+
+        foreach ($projects as $project) {
+            $baseTemplate = $createProjectBaseTemplate->handle($project);
+
+            $project->forceFill([
+                'project_template_id' => $baseTemplate->id,
+            ])->save();
+        }
+
+        ProjectTemplate::query()
+            ->whereNull('project_id')
+            ->update(['is_published' => true]);
+    }
+
+    public function down(): void
+    {
+        Project::query()->update(['project_template_id' => null]);
+
+        ProjectTemplate::query()->where('is_published', false)->delete();
+
+        Schema::table('projects', function (Blueprint $table): void {
+            $table->dropConstrainedForeignId('project_template_id');
+        });
+
+        Schema::table('project_templates', function (Blueprint $table): void {
+            $table->dropConstrainedForeignId('project_id');
+            $table->dropColumn('is_published');
+        });
+    }
+};

database/migrations/2026_06_05_161500_move_project_metadata_to_project_templates.php

@@ -0,0 +1,120 @@
+<?php
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Models\Project;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Facades\Schema;
+use Illuminate\Support\Str;
+
+return new class extends Migration
+{
+    /**
+     * @var list<string>
+     */
+    private array $tables = [
+        'board_columns',
+        'ticket_field_definitions',
+        'ticket_link_types',
+        'ticket_priorities',
+        'ticket_statuses',
+        'ticket_types',
+        'repository_connections',
+        'notification_actions',
+    ];
+
+    public function up(): void
+    {
+        foreach ($this->tables as $table) {
+            Schema::table($table, function (Blueprint $table): void {
+                $table->foreignId('project_template_id')
+                    ->nullable()
+                    ->after('project_id')
+                    ->constrained('project_templates')
+                    ->nullOnDelete();
+            });
+        }
+
+        $projects = DB::table('projects')
+            ->leftJoin('project_templates', 'project_templates.id', '=', 'projects.project_template_id')
+            ->select([
+                'projects.id',
+                'projects.key',
+                'projects.name',
+                'projects.project_template_id',
+                'project_templates.project_id as template_project_id',
+                'project_templates.is_published as template_is_published',
+            ])
+            ->get();
+
+        foreach ($projects as $project) {
+            $projectTemplateId = $project->project_template_id;
+
+            if ($projectTemplateId === null || (
+                ! (bool) $project->template_is_published
+                && (int) ($project->template_project_id ?? 0) !== (int) $project->id
+            )) {
+                $projectTemplateId = DB::table('project_templates')->insertGetId([
+                    'project_id' => $project->id,
+                    'source_project_id' => $project->id,
+                    'name' => $project->name.' base template',
+                    'slug' => Str::lower($project->key).'-base-template',
+                    'is_published' => false,
+                    'copy_areas' => json_encode([
+                        'project_settings',
+                        'board_workflow',
+                        'ticket_types',
+                        'ticket_priorities',
+                        'ticket_fields',
+                        'ticket_link_types',
+                        'repository_connections',
+                        'notification_actions',
+                    ], JSON_THROW_ON_ERROR),
+                    'configuration_snapshot' => json_encode([], JSON_THROW_ON_ERROR),
+                    'created_at' => now(),
+                    'updated_at' => now(),
+                ]);
+
+                DB::table('projects')
+                    ->where('id', $project->id)
+                    ->update([
+                        'project_template_id' => $projectTemplateId,
+                        'updated_at' => now(),
+                    ]);
+            }
+
+            foreach ($this->tables as $table) {
+                DB::table($table)
+                    ->where('project_id', $project->id)
+                    ->update(['project_template_id' => $projectTemplateId]);
+            }
+
+            $projectModel = Project::query()->find($project->id);
+
+            if ($projectModel !== null && ! (bool) $project->template_is_published) {
+                DB::table('project_templates')
+                    ->where('id', $projectTemplateId)
+                    ->update([
+                        'configuration_snapshot' => json_encode(
+                            app(DuplicateProjectConfiguration::class)->export(
+                                $projectModel,
+                                DuplicateProjectConfiguration::copyableAreas(),
+                            ),
+                            JSON_THROW_ON_ERROR,
+                        ),
+                        'updated_at' => now(),
+                    ]);
+            }
+        }
+    }
+
+    public function down(): void
+    {
+        foreach (array_reverse($this->tables) as $table) {
+            Schema::table($table, function (Blueprint $table): void {
+                $table->dropConstrainedForeignId('project_template_id');
+            });
+        }
+    }
+};

database/migrations/2026_09_08_091101_add_template_override_tracking_to_projects_table.php

@@ -0,0 +1,63 @@
+<?php
+
+use App\Actions\Projects\DuplicateProjectConfiguration;
+use App\Models\Project;
+use App\Models\ProjectTemplate;
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration
+{
+    /**
+     * Run the migrations.
+     */
+    public function up(): void
+    {
+        Schema::table('projects', function (Blueprint $table): void {
+            $table->json('template_overrides')->default('[]')->after('project_template_id');
+        });
+
+        $configuration = app(DuplicateProjectConfiguration::class);
+
+        ProjectTemplate::query()->eachById(function (ProjectTemplate $template) use ($configuration): void {
+            $template->forceFill([
+                'copy_areas' => $configuration->normalizeCopyAreas($template->copy_areas ?? []),
+                'configuration_snapshot' => $configuration->normalizeConfiguration(
+                    $template->configuration_snapshot ?? [],
+                ),
+            ])->saveQuietly();
+        });
+
+        Project::query()
+            ->whereHas('projectTemplate', fn ($query) => $query->where('is_published', true))
+            ->with('projectTemplate')
+            ->eachById(function (Project $project) use ($configuration): void {
+                $templateConfiguration = $configuration->normalizeConfiguration(
+                    $project->projectTemplate?->configuration_snapshot ?? [],
+                );
+                $areas = array_values(array_unique([
+                    ...array_keys($templateConfiguration),
+                    ...DuplicateProjectConfiguration::copyableAreas(),
+                ]));
+                $currentConfiguration = $configuration->export($project, $areas);
+                $overrides = collect($areas)
+                    ->filter(fn (string $area): bool => ! array_key_exists($area, $templateConfiguration)
+                        || ($currentConfiguration[$area] ?? null) !== $templateConfiguration[$area])
+                    ->values()
+                    ->all();
+
+                $project->forceFill(['template_overrides' => $overrides])->saveQuietly();
+            });
+    }
+
+    /**
+     * Reverse the migrations.
+     */
+    public function down(): void
+    {
+        Schema::table('projects', function (Blueprint $table): void {
+            $table->dropColumn('template_overrides');
+        });
+    }
+};

package-lock.json

@@ -418,29 +418,43 @@
             }
         },
         "node_modules/@humanfs/core": {
-            "version": "0.19.1",
-            "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
-            "integrity": "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==",
+            "version": "0.19.2",
+            "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.2.tgz",
+            "integrity": "sha512-UhXNm+CFMWcbChXywFwkmhqjs3PRCmcSa/hfBgLIb7oQ5HNb1wS0icWsGtSAUNgefHeI+eBrA8I1fxmbHsGdvA==",
             "dev": true,
             "license": "Apache-2.0",
+            "dependencies": {
+                "@humanfs/types": "^0.15.0"
+            },
             "engines": {
                 "node": ">=18.18.0"
             }
         },
         "node_modules/@humanfs/node": {
-            "version": "0.16.7",
-            "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.7.tgz",
-            "integrity": "sha512-/zUx+yOsIrG4Y43Eh2peDeKCxlRt/gET6aHfaKpuq267qXdYDFViVHfMaLyygZOnl0kGWxFIgsBy8QFuTLUXEQ==",
+            "version": "0.16.8",
+            "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.8.tgz",
+            "integrity": "sha512-gE1eQNZ3R++kTzFUpdGlpmy8kDZD/MLyHqDwqjkVQI0JMdI1D51sy1H958PNXYkM2rAac7e5/CnIKZrHtPh3BQ==",
             "dev": true,
             "license": "Apache-2.0",
             "dependencies": {
-                "@humanfs/core": "^0.19.1",
+                "@humanfs/core": "^0.19.2",
+                "@humanfs/types": "^0.15.0",
                 "@humanwhocodes/retry": "^0.4.0"
             },
             "engines": {
                 "node": ">=18.18.0"
             }
         },
+        "node_modules/@humanfs/types": {
+            "version": "0.15.0",
+            "resolved": "https://registry.npmjs.org/@humanfs/types/-/types-0.15.0.tgz",
+            "integrity": "sha512-ZZ1w0aoQkwuUuC7Yf+7sdeaNfqQiiLcSRbfI08oAxqLtpXQr9AIVX7Ay7HLDuiLYAaFPu8oBYNq/QIi9URHJ3Q==",
+            "dev": true,
+            "license": "Apache-2.0",
+            "engines": {
+                "node": ">=18.18.0"
+            }
+        },
         "node_modules/@humanwhocodes/module-importer": {
             "version": "1.0.1",
             "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
@@ -1303,7 +1317,6 @@
             "integrity": "sha512-F0R/h2+dsy5wJAUe3tAU6oqa2qbWY5TpNfL/RGmo1y38hiyO1w3x2jPtt76wmuaJI4DQnOBu21cNXQ2STIUUWg==",
             "devOptional": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "undici-types": "~6.21.0"
             }
@@ -1320,7 +1333,6 @@
             "integrity": "sha512-eSkwoemjo76bdXl2MYqtxg51HNwUSkWfODUOQ3PaTLZGh9uIWWFZIjyjaJnex7wXDu+TRx+ATsnSxdN9YWfRTQ==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@eslint-community/regexpp": "^4.12.2",
                 "@typescript-eslint/scope-manager": "8.58.1",
@@ -1360,7 +1372,6 @@
             "integrity": "sha512-gGkiNMPqerb2cJSVcruigx9eHBlLG14fSdPdqMoOcBfh+vvn4iCq2C8MzUB89PrxOXk0y3GZ1yIWb9aOzL93bw==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@typescript-eslint/scope-manager": "8.58.1",
                 "@typescript-eslint/types": "8.58.1",
@@ -2111,7 +2122,6 @@
             "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "bin": {
                 "acorn": "bin/acorn"
             },
@@ -3020,7 +3030,6 @@
             "integrity": "sha512-XoMjdBOwe/esVgEvLmNsD3IRHkm7fbKIUGvrleloJXUZgDHig2IPWNniv+GwjyJXzuNqVjlr5+4yVUZjycJwfQ==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@eslint-community/eslint-utils": "^4.8.0",
                 "@eslint-community/regexpp": "^4.12.1",
@@ -3081,7 +3090,6 @@
             "integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "bin": {
                 "eslint-config-prettier": "bin/cli.js"
             },
@@ -3208,7 +3216,6 @@
             "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@rtsao/scc": "^1.1.0",
                 "array-includes": "^3.1.9",
@@ -3351,7 +3358,6 @@
             "integrity": "sha512-174lJKuNsuDIlLpjeXc5E2Tss8P44uIimAfGD0b90k0NoirJqpG7stLuU9Vp/9ioTOrQdWVREc4mRd1BD+CvGw==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@eslint-community/eslint-utils": "^4.4.0",
                 "globals": "^13.24.0",
@@ -4597,9 +4603,9 @@
             }
         },
         "node_modules/js-yaml": {
-            "version": "4.3.1",
-            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.3.1.tgz",
-            "integrity": "sha512-CY6crGq313MX8GkwvB7tzgp99vjQxY1++5y10/BKN/GUfHqWaOGQMNZkBvqSzsZKWk/ijwHlWzzkLulsGHhjWQ==",
+            "version": "4.3.2",
+            "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.3.2.tgz",
+            "integrity": "sha512-SFNOvSJ+Dgf/9An904Yx+CgSlIPCkIpao4qo51lpee25TIRejdH3rhR4EZMGoNx3/TP3O+wzWuiTFl4sqbltzA==",
             "dev": true,
             "funding": [
                 {
@@ -5454,9 +5460,9 @@
             }
         },
         "node_modules/postcss-selector-parser": {
-            "version": "6.1.2",
-            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
-            "integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
+            "version": "6.1.4",
+            "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.4.tgz",
+            "integrity": "sha512-bIoJLOmjCO1S9XdY/DcnR5hJxvrDir1PbGChrzXG3vw0/FOliy/fA3dmdhQ441kah4gKv+TwckGzex6wNS5cnQ==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
@@ -5483,7 +5489,6 @@
             "integrity": "sha512-8c3mgTe0ASwWAJK+78dpviD+A8EqhndQPUBpNUIPt6+xWlIigCwfN01lWr9MAede4uqXGTEKeQWTvzb3vjia0Q==",
             "dev": true,
             "license": "MIT",
-            "peer": true,
             "bin": {
                 "prettier": "bin/prettier.cjs"
             },
@@ -5614,9 +5619,9 @@
             }
         },
         "node_modules/qs": {
-            "version": "6.15.3",
-            "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.3.tgz",
-            "integrity": "sha512-O9gl3zCl5h5blw1KGUzQKhA5oUXSl8rwUIM5o0S3nCXMliSvy5Dzx7/DJcI+SwgICv+IneSZwhBh1oSyEHA71A==",
+            "version": "6.16.0",
+            "resolved": "https://registry.npmjs.org/qs/-/qs-6.16.0.tgz",
+            "integrity": "sha512-h6fhOIaRrID2CbEY2fqs+7t+UXZo+MLAnU5gRIq85uFtdiUPCdsApMlHhXogKVM4HM2DVbIjGNTTYH2OcmP1vA==",
             "license": "BSD-3-Clause",
             "dependencies": {
                 "es-define-property": "^1.0.1",
@@ -6525,7 +6530,6 @@
             "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
             "devOptional": true,
             "license": "Apache-2.0",
-            "peer": true,
             "bin": {
                 "tsc": "bin/tsc",
                 "tsserver": "bin/tsserver"
@@ -6591,7 +6595,6 @@
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "napi-postinstall": "^0.3.0"
             },
@@ -6642,7 +6645,6 @@
             "resolved": "https://registry.npmjs.org/vite/-/vite-8.2.2.tgz",
             "integrity": "sha512-cFKLV/PRgAUlIRm5WjMjJ86jrftzpqcgH+Us+DS8mI3CDNiH30Whrz8uHL3+MOLPAgqbMBAqWdAHAphOAM+z/Q==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "lightningcss": "^1.33.0",
                 "picomatch": "^4.0.5",
@@ -6998,7 +7000,6 @@
             "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.30.tgz",
             "integrity": "sha512-hTHLc6VNZyzzEH/l7PFGjpcTvUgiaPK5mdLkbjrTeWSRcEfxFrv56g/XckIYlE9ckuobsdwqd5mk2g1sBkMewg==",
             "license": "MIT",
-            "peer": true,
             "dependencies": {
                 "@vue/compiler-dom": "3.5.30",
                 "@vue/compiler-sfc": "3.5.30",

public/fonts/inter/LICENSE.txt

@@ -0,0 +1,92 @@
+Copyright (c) 2016 The Inter Project Authors (https://github.com/rsms/inter)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION AND CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

resources/css/app.css

@@ -1,56 +1,98 @@
 @import 'tailwindcss';
-
 @import 'tw-animate-css';
+@import './theme.css';
 
 @source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
 @source '../../storage/framework/views/*.php';
+@source not '../../bootstrap/ssr';
 
-@custom-variant dark (&:is(.dark *));
+@custom-variant dark (&:where(.dark, .dark *));
+
+@font-face {
+    font-family: Inter;
+    font-style: normal;
+    font-weight: 100 900;
+    font-display: swap;
+    src: url('/fonts/inter/InterVariable.woff2') format('woff2');
+}
+
+@font-face {
+    font-family: Inter;
+    font-style: italic;
+    font-weight: 100 900;
+    font-display: swap;
+    src: url('/fonts/inter/InterVariable-Italic.woff2') format('woff2');
+}
 
 @theme inline {
-    --font-sans:
-        Instrument Sans, ui-sans-serif, system-ui, sans-serif,
-        'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
-        'Noto Color Emoji';
+    --font-sans: Inter, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
 
-    --radius-lg: var(--radius);
-    --radius-md: calc(var(--radius) - 2px);
-    --radius-sm: calc(var(--radius) - 4px);
+    --radius-sm: 0.125rem;
+    --radius-md: var(--radius);
+    --radius-lg: 0.5rem;
+    --radius-xl: 0.75rem;
+
+    --spacing-page: 1.5rem;
+    --spacing-column: 1rem;
+    --spacing-card: 0.75rem;
+    --spacing-stack: 0.5rem;
+    --spacing-control: 2.75rem;
+
+    --text-headline: 1.5rem;
+    --text-headline--line-height: 2rem;
+    --text-headline--font-weight: 600;
+    --text-headline--letter-spacing: -0.02em;
+    --text-headline-mobile: 1.25rem;
+    --text-headline-mobile--line-height: 1.75rem;
+    --text-headline-mobile--font-weight: 600;
+    --text-headline-mobile--letter-spacing: -0.02em;
+    --text-title: 1.125rem;
+    --text-title--line-height: 1.5rem;
+    --text-title--font-weight: 600;
+    --text-title--letter-spacing: -0.01em;
+    --text-body: 0.875rem;
+    --text-body--line-height: 1.25rem;
+    --text-caption: 0.8125rem;
+    --text-caption--line-height: 1.125rem;
+    --text-label: 0.6875rem;
+    --text-label--line-height: 1rem;
+    --text-label--font-weight: 700;
+    --text-label--letter-spacing: 0.05em;
+
+    --shadow-card-hover: 0 4px 12px rgb(0 0 0 / 0.08);
 
     --color-background: var(--background);
     --color-foreground: var(--foreground);
-
     --color-card: var(--card);
     --color-card-foreground: var(--card-foreground);
-
     --color-popover: var(--popover);
     --color-popover-foreground: var(--popover-foreground);
-
     --color-primary: var(--primary);
     --color-primary-foreground: var(--primary-foreground);
-
     --color-secondary: var(--secondary);
     --color-secondary-foreground: var(--secondary-foreground);
-
     --color-muted: var(--muted);
     --color-muted-foreground: var(--muted-foreground);
-
     --color-accent: var(--accent);
     --color-accent-foreground: var(--accent-foreground);
-
     --color-destructive: var(--destructive);
     --color-destructive-foreground: var(--destructive-foreground);
-
     --color-border: var(--border);
     --color-input: var(--input);
     --color-ring: var(--ring);
-
+    --color-brand: var(--brand);
+    --color-brand-foreground: var(--brand-foreground);
+    --color-success: var(--success);
+    --color-success-foreground: var(--success-foreground);
+    --color-warning: var(--warning);
+    --color-warning-foreground: var(--warning-foreground);
+    --color-info: var(--info);
+    --color-info-foreground: var(--info-foreground);
     --color-chart-1: var(--chart-1);
     --color-chart-2: var(--chart-2);
     --color-chart-3: var(--chart-3);
     --color-chart-4: var(--chart-4);
     --color-chart-5: var(--chart-5);
-
     --color-sidebar: var(--sidebar-background);
     --color-sidebar-foreground: var(--sidebar-foreground);
     --color-sidebar-primary: var(--sidebar-primary);
@@ -61,112 +103,35 @@
     --color-sidebar-ring: var(--sidebar-ring);
 }
 
-/*
-  The default border color has changed to `currentColor` in Tailwind CSS v4,
-  so we've added these compatibility styles to make sure everything still
-  looks the same as it did with Tailwind CSS v3.
-
-  If we ever want to remove these styles, we need to add an explicit border
-  color utility to any element that depends on these defaults.
-*/
-@layer base {
-    *,
-    ::after,
-    ::before,
-    ::backdrop,
-    ::file-selector-button {
-        border-color: var(--color-gray-200, currentColor);
-    }
-}
-
-@layer utilities {
-    body,
-    html {
-        --font-sans:
-            'Instrument Sans', ui-sans-serif, system-ui, sans-serif,
-            'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
-            'Noto Color Emoji';
-    }
-}
-
-:root {
-    --background: hsl(0 0% 100%);
-    --foreground: hsl(0 0% 3.9%);
-    --card: hsl(0 0% 100%);
-    --card-foreground: hsl(0 0% 3.9%);
-    --popover: hsl(0 0% 100%);
-    --popover-foreground: hsl(0 0% 3.9%);
-    --primary: hsl(0 0% 9%);
-    --primary-foreground: hsl(0 0% 98%);
-    --secondary: hsl(0 0% 92.1%);
-    --secondary-foreground: hsl(0 0% 9%);
-    --muted: hsl(0 0% 96.1%);
-    --muted-foreground: hsl(0 0% 45.1%);
-    --accent: hsl(0 0% 96.1%);
-    --accent-foreground: hsl(0 0% 9%);
-    --destructive: hsl(0 84.2% 60.2%);
-    --destructive-foreground: hsl(0 0% 98%);
-    --border: hsl(0 0% 92.8%);
-    --input: hsl(0 0% 89.8%);
-    --ring: hsl(0 0% 3.9%);
-    --chart-1: hsl(12 76% 61%);
-    --chart-2: hsl(173 58% 39%);
-    --chart-3: hsl(197 37% 24%);
-    --chart-4: hsl(43 74% 66%);
-    --chart-5: hsl(27 87% 67%);
-    --radius: 0.5rem;
-    --sidebar-background: hsl(0 0% 98%);
-    --sidebar-foreground: hsl(240 5.3% 26.1%);
-    --sidebar-primary: hsl(0 0% 10%);
-    --sidebar-primary-foreground: hsl(0 0% 98%);
-    --sidebar-accent: hsl(0 0% 94%);
-    --sidebar-accent-foreground: hsl(0 0% 30%);
-    --sidebar-border: hsl(0 0% 91%);
-    --sidebar-ring: hsl(217.2 91.2% 59.8%);
-    --sidebar: hsl(0 0% 98%);
-}
-
-.dark {
-    --background: hsl(0 0% 3.9%);
-    --foreground: hsl(0 0% 98%);
-    --card: hsl(0 0% 3.9%);
-    --card-foreground: hsl(0 0% 98%);
-    --popover: hsl(0 0% 3.9%);
-    --popover-foreground: hsl(0 0% 98%);
-    --primary: hsl(0 0% 98%);
-    --primary-foreground: hsl(0 0% 9%);
-    --secondary: hsl(0 0% 14.9%);
-    --secondary-foreground: hsl(0 0% 98%);
-    --muted: hsl(0 0% 16.08%);
-    --muted-foreground: hsl(0 0% 63.9%);
-    --accent: hsl(0 0% 14.9%);
-    --accent-foreground: hsl(0 0% 98%);
-    --destructive: hsl(0 84% 60%);
-    --destructive-foreground: hsl(0 0% 98%);
-    --border: hsl(0 0% 14.9%);
-    --input: hsl(0 0% 14.9%);
-    --ring: hsl(0 0% 83.1%);
-    --chart-1: hsl(220 70% 50%);
-    --chart-2: hsl(160 60% 45%);
-    --chart-3: hsl(30 80% 55%);
-    --chart-4: hsl(280 65% 60%);
-    --chart-5: hsl(340 75% 55%);
-    --sidebar-background: hsl(0 0% 7%);
-    --sidebar-foreground: hsl(0 0% 95.9%);
-    --sidebar-primary: hsl(360, 100%, 100%);
-    --sidebar-primary-foreground: hsl(0 0% 100%);
-    --sidebar-accent: hsl(0 0% 15.9%);
-    --sidebar-accent-foreground: hsl(240 4.8% 95.9%);
-    --sidebar-border: hsl(0 0% 15.9%);
-    --sidebar-ring: hsl(217.2 91.2% 59.8%);
-    --sidebar: hsl(240 5.9% 10%);
-}
-
 @layer base {
     * {
-        @apply border-border outline-ring/50;
+        @apply border-border;
     }
+
     body {
-        @apply bg-background text-foreground;
+        @apply bg-background font-sans text-body text-foreground antialiased;
+        font-optical-sizing: auto;
+    }
+
+    :focus-visible {
+        outline: 2px solid var(--ring);
+        outline-offset: 3px;
+    }
+
+    ::selection {
+        background: var(--brand);
+        color: var(--brand-foreground);
+    }
+}
+
+/* Preserve completion events while removing visible nonessential motion. */
+@media (prefers-reduced-motion: reduce) {
+    *,
+    *::before,
+    *::after {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+        scroll-behavior: auto !important;
     }
 }

resources/css/theme.css

@@ -0,0 +1,96 @@
+/* Fluid Emerald / Kinetic Kanban: shared by the first paint and the app bundle. */
+:root {
+    color-scheme: light;
+    --radius: 0.25rem;
+    --background: #f7f9fb;
+    --foreground: #191c1e;
+    --card: #ffffff;
+    --card-foreground: #191c1e;
+    --popover: #ffffff;
+    --popover-foreground: #191c1e;
+    --primary: #006e2f;
+    --primary-foreground: #ffffff;
+    --secondary: #d0e1fb;
+    --secondary-foreground: #38485d;
+    --muted: #f2f4f6;
+    --muted-foreground: #505f76;
+    --accent: #dcfce7;
+    --accent-foreground: #005321;
+    --destructive: #ba1a1a;
+    --destructive-foreground: #ffffff;
+    --border: #e2e8f0;
+    --input: #6d7b6c;
+    --ring: #006e2f;
+    --brand: #22c55e;
+    --brand-foreground: #002109;
+    --success: #dcfce7;
+    --success-foreground: #005321;
+    --warning: #fef3c7;
+    --warning-foreground: #78350f;
+    --info: #dbeafe;
+    --info-foreground: #1e40af;
+    --chart-1: #006e2f;
+    --chart-2: #505f76;
+    --chart-3: #9e4036;
+    --chart-4: #92400e;
+    --chart-5: #1d4ed8;
+    --sidebar-background: #f2f4f6;
+    --sidebar-foreground: #191c1e;
+    --sidebar-primary: #006e2f;
+    --sidebar-primary-foreground: #ffffff;
+    --sidebar-accent: #dcfce7;
+    --sidebar-accent-foreground: #005321;
+    --sidebar-border: #e2e8f0;
+    --sidebar-ring: #006e2f;
+    --sidebar: #f2f4f6;
+}
+
+.dark {
+    color-scheme: dark;
+    --background: #0f172a;
+    --foreground: #f1f5f9;
+    --card: #1e293b;
+    --card-foreground: #f1f5f9;
+    --popover: #1e293b;
+    --popover-foreground: #f1f5f9;
+    --primary: #4ae176;
+    --primary-foreground: #002109;
+    --secondary: #334155;
+    --secondary-foreground: #e2e8f0;
+    --muted: #1e293b;
+    --muted-foreground: #b7c8e1;
+    --accent: #173b2b;
+    --accent-foreground: #6bff8f;
+    --destructive: #fca5a5;
+    --destructive-foreground: #450a0a;
+    --border: #334155;
+    --input: #8293aa;
+    --ring: #4ae176;
+    --brand: #22c55e;
+    --brand-foreground: #002109;
+    --success: #173b2b;
+    --success-foreground: #6bff8f;
+    --warning: #422006;
+    --warning-foreground: #fde68a;
+    --info: #172554;
+    --info-foreground: #bfdbfe;
+    --chart-1: #4ae176;
+    --chart-2: #b7c8e1;
+    --chart-3: #ffb4a9;
+    --chart-4: #fbbf24;
+    --chart-5: #60a5fa;
+    --sidebar-background: #111c30;
+    --sidebar-foreground: #f1f5f9;
+    --sidebar-primary: #4ae176;
+    --sidebar-primary-foreground: #002109;
+    --sidebar-accent: #173b2b;
+    --sidebar-accent-foreground: #6bff8f;
+    --sidebar-border: #334155;
+    --sidebar-ring: #4ae176;
+    --sidebar: #111c30;
+}
+
+html {
+    background-color: var(--background);
+    color: var(--foreground);
+}

resources/js/app.ts

@@ -3,7 +3,8 @@ import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
 import type { DefineComponent } from 'vue';
 import { createApp, h } from 'vue';
 import '../css/app.css';
-import { initializeTheme } from '@/composables/useAppearance';
+import { createAppearance } from '@/composables/useAppearance';
+import { createLocalization } from '@/lib/localization';
 
 const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
 
@@ -17,12 +18,11 @@ createInertiaApp({
     setup({ el, App, props, plugin }) {
         createApp({ render: () => h(App, props) })
             .use(plugin)
+            .use(createLocalization(props.initialPage.props.localization))
+            .use(createAppearance(props.initialPage.props.appearance))
             .mount(el);
     },
     progress: {
-        color: '#4B5563',
+        color: 'var(--primary)',
     },
 });
-
-// This will set light / dark mode on page load...
-initializeTheme();

resources/js/components/AlertError.vue

@@ -2,15 +2,15 @@
 import { AlertCircle } from 'lucide-vue-next';
 import { computed } from 'vue';
 import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert';
+import { useLocalization } from '@/composables/useLocalization';
 
 type Props = {
     errors: string[];
     title?: string;
 };
 
-const props = withDefaults(defineProps<Props>(), {
-    title: 'Something went wrong.',
-});
+const props = defineProps<Props>();
+const { t } = useLocalization();
 
 const uniqueErrors = computed(() => Array.from(new Set(props.errors)));
 </script>
@@ -18,7 +18,7 @@ const uniqueErrors = computed(() => Array.from(new Set(props.errors)));
 <template>
     <Alert variant="destructive">
         <AlertCircle class="size-4" />
-        <AlertTitle>{{ title }}</AlertTitle>
+        <AlertTitle>{{ title ?? t('common.error') }}</AlertTitle>
         <AlertDescription>
             <ul class="list-inside list-disc text-sm">
                 <li v-for="(error, index) in uniqueErrors" :key="index">

resources/js/components/AppSidebar.vue

@@ -5,6 +5,7 @@ import {
     Folder,
     FolderGit2,
     LayoutGrid,
+    Layers3,
     Shield,
     Users,
 } from 'lucide-vue-next';
@@ -24,6 +25,7 @@ import {
 } from '@/components/ui/sidebar';
 import { dashboard } from '@/routes';
 import { index as adminUsers } from '@/routes/admin/users';
+import { index as projectTemplatesIndex } from '@/routes/project-templates';
 import { index as projectsIndex } from '@/routes/projects';
 import { index as teamsIndex } from '@/routes/teams';
 import type { NavItem } from '@/types';
@@ -44,6 +46,14 @@ const mainNavItems = computed<NavItem[]>(() => {
         },
     ];
 
+    if (page.props.auth.permissions.projectCreate) {
+        items.push({
+            title: 'Project templates',
+            href: projectTemplatesIndex(),
+            icon: Layers3,
+        });
+    }
+
     if (page.props.auth.permissions.globalAdmin) {
         items.push({
             title: 'Users',

resources/js/components/AppearanceTabs.vue

@@ -1,33 +1,39 @@
 <script setup lang="ts">
 import { Monitor, Moon, Sun } from 'lucide-vue-next';
 import { useAppearance } from '@/composables/useAppearance';
+import { useLocalization } from '@/composables/useLocalization';
 
 const { appearance, updateAppearance } = useAppearance();
+const { t } = useLocalization();
 
 const tabs = [
-    { value: 'light', Icon: Sun, label: 'Light' },
-    { value: 'dark', Icon: Moon, label: 'Dark' },
-    { value: 'system', Icon: Monitor, label: 'System' },
+    { value: 'light', Icon: Sun, label: 'appearance.light' },
+    { value: 'dark', Icon: Moon, label: 'appearance.dark' },
+    { value: 'system', Icon: Monitor, label: 'appearance.system' },
 ] as const;
 </script>
 
 <template>
     <div
-        class="inline-flex gap-1 rounded-lg bg-neutral-100 p-1 dark:bg-neutral-800"
+        role="group"
+        :aria-label="t('appearance.label')"
+        class="border-border bg-muted inline-flex max-w-full gap-1 rounded-lg border p-1"
     >
         <button
             v-for="{ value, Icon, label } in tabs"
             :key="value"
+            type="button"
+            :aria-pressed="appearance === value"
             @click="updateAppearance(value)"
             :class="[
-                'flex items-center rounded-md px-3.5 py-1.5 transition-colors',
+                'min-h-control text-body focus-visible:outline-ring flex min-w-0 items-center justify-center gap-1.5 rounded-md px-3 font-medium transition-colors focus-visible:outline-2 focus-visible:outline-offset-2',
                 appearance === value
-                    ? 'shadow-xs bg-white dark:bg-neutral-700 dark:text-neutral-100'
-                    : 'text-neutral-500 hover:bg-neutral-200/60 hover:text-black dark:text-neutral-400 dark:hover:bg-neutral-700/60',
+                    ? 'bg-primary text-primary-foreground'
+                    : 'text-muted-foreground hover:bg-accent hover:text-accent-foreground',
             ]"
         >
-            <component :is="Icon" class="-ml-1 h-4 w-4" />
-            <span class="ml-1.5 text-sm">{{ label }}</span>
+            <component :is="Icon" class="size-4 shrink-0" aria-hidden="true" />
+            <span>{{ t(label) }}</span>
         </button>
     </div>
 </template>

resources/js/components/projects/TemplateInheritancePanel.vue

@@ -0,0 +1,177 @@
+<script setup lang="ts">
+import { useForm } from '@inertiajs/vue3';
+import ProjectController from '@/actions/App/Http/Controllers/ProjectController';
+import InputError from '@/components/InputError.vue';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+    Card,
+    CardContent,
+    CardDescription,
+    CardHeader,
+    CardTitle,
+} from '@/components/ui/card';
+import { Label } from '@/components/ui/label';
+import type { ProjectTemplateState, ProjectTemplateStateArea } from '@/types';
+import { computed } from 'vue';
+
+const props = defineProps<{
+    areas: string[];
+    projectId: number;
+    templateState?: ProjectTemplateState | null;
+}>();
+
+const form = useForm<{
+    areas: string[];
+    status_replacements: Record<string, number | undefined>;
+}>({
+    areas: [],
+    status_replacements: {},
+});
+
+const activeArea = computed(() => form.areas[0]);
+
+const inheritedAreas = computed(
+    () =>
+        props.templateState?.inheritedAreas.filter((area) =>
+            props.areas.includes(area.value),
+        ) ?? [],
+);
+
+const overriddenAreas = computed(
+    () =>
+        props.templateState?.overriddenAreas.filter((area) =>
+            props.areas.includes(area.value),
+        ) ?? [],
+);
+
+const statusRequirement = computed(
+    () => props.templateState?.resetRequirements?.ticket_statuses,
+);
+
+const canReset = (area: ProjectTemplateStateArea): boolean => {
+    if (area.value !== 'ticket_statuses') {
+        return true;
+    }
+
+    return (
+        statusRequirement.value?.removedStatuses.every(
+            (status) =>
+                form.status_replacements[String(status.id)] !== undefined,
+        ) ?? true
+    );
+};
+
+const resetArea = (area: ProjectTemplateStateArea): void => {
+    if (!canReset(area)) {
+        return;
+    }
+
+    form.areas = [area.value];
+    form.post(ProjectController.resetTemplate.url(props.projectId), {
+        preserveScroll: true,
+        onSuccess: () => form.reset(),
+    });
+};
+</script>
+
+<template>
+    <Card
+        v-if="
+            templateState?.inheritsFromTemplate &&
+            (inheritedAreas.length > 0 || overriddenAreas.length > 0)
+        "
+    >
+        <CardHeader>
+            <CardTitle>
+                Template inheritance: {{ templateState.templateName }}
+            </CardTitle>
+            <CardDescription>
+                Every setting area inherits independently. Local changes stay
+                unchanged when the template is updated until that area is reset.
+            </CardDescription>
+        </CardHeader>
+        <CardContent class="space-y-4">
+            <div class="flex flex-wrap gap-2">
+                <Badge
+                    v-for="area in inheritedAreas"
+                    :key="`inherited-${area.value}`"
+                    variant="outline"
+                >
+                    {{ area.label }} · inherited
+                </Badge>
+            </div>
+
+            <div
+                v-for="area in overriddenAreas"
+                :key="`overridden-${area.value}`"
+                class="space-y-3 rounded-lg border p-4"
+            >
+                <div class="flex flex-wrap items-center justify-between gap-3">
+                    <Badge>{{ area.label }} · template overridden</Badge>
+                    <Button
+                        type="button"
+                        size="sm"
+                        variant="outline"
+                        :disabled="form.processing || !canReset(area)"
+                        @click="resetArea(area)"
+                    >
+                        {{
+                            activeArea === area.value && form.processing
+                                ? 'Resetting…'
+                                : 'Reset to template'
+                        }}
+                    </Button>
+                </div>
+
+                <div
+                    v-if="area.value === 'ticket_statuses' && statusRequirement"
+                    class="space-y-3"
+                >
+                    <p class="text-muted-foreground text-sm">
+                        Choose where tickets in local statuses should move
+                        before those statuses are removed.
+                    </p>
+                    <div
+                        v-for="status in statusRequirement.removedStatuses"
+                        :key="status.id"
+                        class="grid gap-2 sm:grid-cols-2 sm:items-center"
+                    >
+                        <Label :for="`replacement-${status.id}`">
+                            {{ status.name }} ({{ status.ticketCount }} tickets)
+                        </Label>
+                        <div class="grid gap-1">
+                            <select
+                                :id="`replacement-${status.id}`"
+                                v-model="
+                                    form.status_replacements[String(status.id)]
+                                "
+                                class="border-input bg-background shadow-xs focus-visible:border-ring focus-visible:ring-ring/50 rounded-md border px-3 py-2 text-sm outline-none focus-visible:ring-[3px]"
+                            >
+                                <option :value="undefined" disabled>
+                                    Select replacement status
+                                </option>
+                                <option
+                                    v-for="option in statusRequirement.replacementOptions"
+                                    :key="option.id"
+                                    :value="option.id"
+                                >
+                                    {{ option.name }}
+                                </option>
+                            </select>
+                            <InputError
+                                :message="
+                                    form.errors[
+                                        `status_replacements.${status.id}`
+                                    ]
+                                "
+                            />
+                        </div>
+                    </div>
+                </div>
+
+                <InputError :message="form.errors.areas" />
+            </div>
+        </CardContent>
+    </Card>
+</template>

resources/js/components/ui/avatar/Avatar.vue

@@ -1,18 +1,35 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from "vue"
-import { AvatarRoot } from "reka-ui"
-import { cn } from "@/lib/utils"
+import type { AvatarRootProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import type { AvatarVariants } from ".";
+import { reactiveOmit } from "@vueuse/core";
+import { AvatarRoot, useForwardProps } from "reka-ui";
+import { cn } from "@/lib/utils";
+import { avatarVariants } from ".";
 
-const props = defineProps<{
-  class?: HTMLAttributes["class"]
-}>()
+const props = withDefaults(
+    defineProps<
+        AvatarRootProps & {
+            class?: HTMLAttributes["class"];
+            size?: AvatarVariants["size"];
+            shape?: AvatarVariants["shape"];
+        }
+    >(),
+    { size: "default", shape: "circle" },
+);
+
+const delegatedProps = reactiveOmit(props, "class", "size", "shape");
+const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <AvatarRoot
-    data-slot="avatar"
-    :class="cn('relative flex size-8 shrink-0 overflow-hidden rounded-full', props.class)"
-  >
-    <slot />
-  </AvatarRoot>
+    <AvatarRoot
+        data-slot="avatar"
+        :data-size="size"
+        :data-shape="shape"
+        v-bind="forwardedProps"
+        :class="cn(avatarVariants({ size, shape }), props.class)"
+    >
+        <slot />
+    </AvatarRoot>
 </template>

resources/js/components/ui/avatar/AvatarFallback.vue

@@ -1,21 +1,28 @@
 <script setup lang="ts">
-import type { AvatarFallbackProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { AvatarFallback } from "reka-ui"
-import { cn } from "@/lib/utils"
+import type { AvatarFallbackProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import { reactiveOmit } from "@vueuse/core";
+import { AvatarFallback } from "reka-ui";
+import { cn } from "@/lib/utils";
 
-const props = defineProps<AvatarFallbackProps & { class?: HTMLAttributes["class"] }>()
+const props = defineProps<
+    AvatarFallbackProps & { class?: HTMLAttributes["class"] }
+>();
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, "class");
 </script>
 
 <template>
-  <AvatarFallback
-    data-slot="avatar-fallback"
-    v-bind="delegatedProps"
-    :class="cn('bg-muted flex size-full items-center justify-center rounded-full', props.class)"
-  >
-    <slot />
-  </AvatarFallback>
+    <AvatarFallback
+        data-slot="avatar-fallback"
+        v-bind="delegatedProps"
+        :class="
+            cn(
+                'bg-accent text-accent-foreground flex size-full items-center justify-center font-semibold',
+                props.class,
+            )
+        "
+    >
+        <slot />
+    </AvatarFallback>
 </template>

resources/js/components/ui/avatar/UserAvatar.vue

@@ -1,41 +1,39 @@
 <script setup lang="ts">
-import { getInitials } from "@/composables/useInitials";
-import {
-    Avatar,
-    AvatarFallback,
-    AvatarImage,
-} from "@/components/ui/avatar/index";
+import type { AvatarVariants } from "@/components/ui/avatar";
+import type { UserModel } from "@/types/models/user-model";
 import { usePage } from "@inertiajs/vue3";
-import { computed, PropType } from "vue";
-import { UserModel } from "@/types/models/user-model";
+import { computed } from "vue";
+import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
+import { getInitials } from "@/composables/useInitials";
 
-const props = defineProps({
-    user: {
-        type: Object as PropType<UserModel>,
+const props = withDefaults(
+    defineProps<{
+        user?: UserModel;
+        rounded?: boolean;
+        size?: AvatarVariants["size"];
+        label?: string;
+    }>(),
+    {
+        rounded: true,
+        size: "default",
     },
-    rounded: {
-        type: Boolean,
-        default: false,
-    },
-})
+);
 
 const page = usePage();
-const auth = computed(() => page.props.auth);
-
-const user = computed(() => props.user ?? auth.value.user)
+const user = computed(() => props.user ?? page.props.auth.user);
+const accessibleLabel = computed(() => props.label ?? user.value.name);
+const initials = computed(() => getInitials(user.value.name));
 </script>
 
 <template>
-    <Avatar class="size-8 overflow-hidden" :class="rounded ? 'rounded-full' : 'rounded-lg'">
+    <Avatar :size="size" :shape="rounded ? 'circle' : 'rounded'">
         <AvatarImage
             v-if="user.avatar"
             :src="user.avatar"
-            :alt="user.name"
+            :alt="accessibleLabel"
         />
-        <AvatarFallback
-            class="rounded-lg bg-neutral-200 font-semibold text-black dark:bg-neutral-700 dark:text-white"
-        >
-            {{ getInitials(auth.user?.name) }}
+        <AvatarFallback :aria-label="accessibleLabel">
+            {{ initials }}
         </AvatarFallback>
     </Avatar>
 </template>

resources/js/components/ui/avatar/index.ts

@@ -1,3 +1,31 @@
-export { default as Avatar } from "./Avatar.vue"
-export { default as AvatarFallback } from "./AvatarFallback.vue"
-export { default as AvatarImage } from "./AvatarImage.vue"
+import type { VariantProps } from "class-variance-authority";
+import { cva } from "class-variance-authority";
+
+export { default as Avatar } from "./Avatar.vue";
+export { default as AvatarFallback } from "./AvatarFallback.vue";
+export { default as AvatarImage } from "./AvatarImage.vue";
+export { default as UserAvatar } from "./UserAvatar.vue";
+
+export const avatarVariants = cva(
+    "border-border bg-muted relative flex shrink-0 overflow-hidden border",
+    {
+        variants: {
+            size: {
+                sm: "size-6 text-label",
+                default: "size-8 text-caption",
+                lg: "size-10 text-body",
+                xl: "size-16 text-title",
+            },
+            shape: {
+                circle: "rounded-full",
+                rounded: "rounded-lg",
+                square: "rounded-sm",
+            },
+        },
+        defaultVariants: {
+            size: "default",
+            shape: "circle",
+        },
+    },
+);
+export type AvatarVariants = VariantProps<typeof avatarVariants>;

resources/js/components/ui/badge/Badge.vue

@@ -1,26 +1,28 @@
 <script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import type { BadgeVariants } from "."
-import { reactiveOmit } from "@vueuse/core"
-import { Primitive } from "reka-ui"
-import { cn } from "@/lib/utils"
-import { badgeVariants } from "."
+import type { PrimitiveProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import type { BadgeVariants } from ".";
+import { reactiveOmit } from "@vueuse/core";
+import { Primitive } from "reka-ui";
+import { cn } from "@/lib/utils";
+import { badgeVariants } from ".";
 
-const props = defineProps<PrimitiveProps & {
-  variant?: BadgeVariants["variant"]
-  class?: HTMLAttributes["class"]
-}>()
+const props = defineProps<
+    PrimitiveProps & {
+        variant?: BadgeVariants["variant"];
+        class?: HTMLAttributes["class"];
+    }
+>();
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, "class", "variant");
 </script>
 
 <template>
-  <Primitive
-    data-slot="badge"
-    :class="cn(badgeVariants({ variant }), props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </Primitive>
+    <Primitive
+        data-slot="badge"
+        :class="cn(badgeVariants({ variant }), props.class)"
+        v-bind="delegatedProps"
+    >
+        <slot />
+    </Primitive>
 </template>

resources/js/components/ui/badge/index.ts

@@ -1,26 +1,31 @@
-import type { VariantProps } from "class-variance-authority"
-import { cva } from "class-variance-authority"
+import type { VariantProps } from "class-variance-authority";
+import { cva } from "class-variance-authority";
 
-export { default as Badge } from "./Badge.vue"
+export { default as Badge } from "./Badge.vue";
 
 export const badgeVariants = cva(
-  "inline-flex items-center justify-center rounded-full border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
-  {
-    variants: {
-      variant: {
-        default:
-          "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
-        secondary:
-          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
-        destructive:
-         "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline:
-          "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-      },
+    "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border px-2.5 py-1 text-label whitespace-nowrap transition-[background-color,border-color,color,box-shadow] outline-none [&>svg]:pointer-events-none [&>svg]:size-3 [&>svg]:shrink-0 focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35 focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+    {
+        variants: {
+            variant: {
+                default:
+                    "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+                secondary:
+                    "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/80",
+                destructive:
+                    "border-transparent bg-destructive text-destructive-foreground [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/35",
+                outline:
+                    "border-border bg-card text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+                success:
+                    "border-transparent bg-success text-success-foreground [a&]:hover:brightness-95",
+                warning:
+                    "border-transparent bg-warning text-warning-foreground [a&]:hover:brightness-95",
+                info: "border-transparent bg-info text-info-foreground [a&]:hover:brightness-95",
+            },
+        },
+        defaultVariants: {
+            variant: "default",
+        },
     },
-    defaultVariants: {
-      variant: "default",
-    },
-  },
-)
-export type BadgeVariants = VariantProps<typeof badgeVariants>
+);
+export type BadgeVariants = VariantProps<typeof badgeVariants>;

resources/js/components/ui/button/Button.vue

@@ -1,29 +1,47 @@
 <script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import type { ButtonVariants } from "."
-import { Primitive } from "reka-ui"
-import { cn } from "@/lib/utils"
-import { buttonVariants } from "."
+import type { PrimitiveProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import type { ButtonVariants } from ".";
+import { Primitive } from "reka-ui";
+import { computed } from "vue";
+import { Spinner } from "@/components/ui/spinner";
+import { cn } from "@/lib/utils";
+import { buttonVariants } from ".";
 
 interface Props extends PrimitiveProps {
-  variant?: ButtonVariants["variant"]
-  size?: ButtonVariants["size"]
-  class?: HTMLAttributes["class"]
+    variant?: ButtonVariants["variant"];
+    size?: ButtonVariants["size"];
+    class?: HTMLAttributes["class"];
+    disabled?: boolean;
+    loading?: boolean;
+    loadingLabel?: string;
 }
 
 const props = withDefaults(defineProps<Props>(), {
-  as: "button",
-})
+    as: "button",
+    disabled: false,
+    loading: false,
+});
+
+const isDisabled = computed(() => props.disabled || props.loading);
 </script>
 
 <template>
-  <Primitive
-    data-slot="button"
-    :as="as"
-    :as-child="asChild"
-    :class="cn(buttonVariants({ variant, size }), props.class)"
-  >
-    <slot />
-  </Primitive>
+    <Primitive
+        data-slot="button"
+        :data-loading="loading ? '' : undefined"
+        :as="as"
+        :as-child="asChild"
+        :disabled="isDisabled"
+        :aria-disabled="isDisabled ? 'true' : undefined"
+        :aria-busy="loading ? 'true' : undefined"
+        :class="cn(buttonVariants({ variant, size }), props.class)"
+    >
+        <Spinner
+            v-if="loading"
+            data-slot="button-spinner"
+            :label="loadingLabel"
+        />
+        <slot />
+    </Primitive>
 </template>

resources/js/components/ui/button/index.ts

@@ -1,38 +1,37 @@
-import type { VariantProps } from "class-variance-authority"
-import { cva } from "class-variance-authority"
+import type { VariantProps } from "class-variance-authority";
+import { cva } from "class-variance-authority";
 
-export { default as Button } from "./Button.vue"
+export { default as Button } from "./Button.vue";
 
 export const buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-  {
-    variants: {
-      variant: {
-        default:
-          "bg-primary text-primary-foreground hover:bg-primary/90",
-        destructive:
-          "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline:
-          "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-        secondary:
-          "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-        ghost:
-          "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-        link: "text-primary underline-offset-4 hover:underline",
-      },
-      size: {
-        "default": "h-9 px-4 py-2 has-[>svg]:px-3",
-        "sm": "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-        "lg": "h-10 rounded-md px-6 has-[>svg]:px-4",
-        "icon": "size-9",
-        "icon-sm": "size-8",
-        "icon-lg": "size-10",
-      },
+    "inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-body font-semibold transition-[background-color,border-color,color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[loading]:cursor-wait data-[loading]:opacity-80 focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35 focus-visible:ring-offset-2 focus-visible:ring-offset-background [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+    {
+        variants: {
+            variant: {
+                default:
+                    "border border-transparent bg-brand text-brand-foreground shadow-xs hover:brightness-95",
+                destructive:
+                    "border border-transparent bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/35",
+                outline:
+                    "border border-input bg-card text-foreground shadow-xs hover:border-primary/45 hover:bg-accent hover:text-accent-foreground",
+                secondary:
+                    "border border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+                ghost: "border border-transparent hover:bg-accent hover:text-accent-foreground",
+                link: "min-h-0 border-0 px-0 text-primary underline-offset-4 shadow-none hover:underline",
+            },
+            size: {
+                default: "min-h-control px-4 py-2 has-[>svg]:px-3",
+                sm: "min-h-9 gap-1.5 px-3 py-1.5 has-[>svg]:px-2.5",
+                lg: "min-h-12 px-6 py-3 has-[>svg]:px-4",
+                icon: "size-control",
+                "icon-sm": "size-9",
+                "icon-lg": "size-12",
+            },
+        },
+        defaultVariants: {
+            variant: "default",
+            size: "default",
+        },
     },
-    defaultVariants: {
-      variant: "default",
-      size: "default",
-    },
-  },
-)
-export type ButtonVariants = VariantProps<typeof buttonVariants>
+);
+export type ButtonVariants = VariantProps<typeof buttonVariants>;

resources/js/components/ui/checkbox/Checkbox.vue

@@ -1,35 +1,48 @@
 <script setup lang="ts">
-import type { CheckboxRootEmits, CheckboxRootProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { Check } from "lucide-vue-next"
-import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from "reka-ui"
-import { cn } from "@/lib/utils"
+import type { CheckboxRootEmits, CheckboxRootProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import { reactiveOmit } from "@vueuse/core";
+import { Check } from "lucide-vue-next";
+import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from "reka-ui";
+import { cn } from "@/lib/utils";
 
-const props = defineProps<CheckboxRootProps & { class?: HTMLAttributes["class"] }>()
-const emits = defineEmits<CheckboxRootEmits>()
+const props = withDefaults(
+    defineProps<
+        CheckboxRootProps & {
+            class?: HTMLAttributes["class"];
+            invalid?: boolean;
+        }
+    >(),
+    { invalid: false },
+);
+const emits = defineEmits<CheckboxRootEmits>();
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, "class", "invalid");
 
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
-  <CheckboxRoot
-    v-slot="slotProps"
-    data-slot="checkbox"
-    v-bind="forwarded"
-    :class="
-      cn('peer border-input data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
-         props.class)"
-  >
-    <CheckboxIndicator
-      data-slot="checkbox-indicator"
-      class="grid place-content-center text-current transition-none"
+    <CheckboxRoot
+        v-slot="slotProps"
+        data-slot="checkbox"
+        :data-invalid="invalid ? '' : undefined"
+        :aria-invalid="invalid ? 'true' : undefined"
+        v-bind="forwarded"
+        :class="
+            cn(
+                'peer border-input bg-card size-5 shrink-0 rounded-md border shadow-xs transition-[background-color,border-color,box-shadow] outline-none hover:border-primary/55 data-[state=checked]:border-brand data-[state=checked]:bg-brand data-[state=checked]:text-brand-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35 disabled:cursor-not-allowed disabled:bg-muted disabled:opacity-60 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/25',
+                props.class,
+            )
+        "
     >
-      <slot v-bind="slotProps">
-        <Check class="size-3.5" />
-      </slot>
-    </CheckboxIndicator>
-  </CheckboxRoot>
+        <CheckboxIndicator
+            data-slot="checkbox-indicator"
+            class="grid place-content-center text-current transition-none"
+        >
+            <slot v-bind="slotProps">
+                <Check class="size-4" stroke-width="2.5" />
+            </slot>
+        </CheckboxIndicator>
+    </CheckboxRoot>
 </template>

resources/js/components/ui/input/Input.vue

@@ -1,33 +1,38 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from "vue"
-import { useVModel } from "@vueuse/core"
-import { cn } from "@/lib/utils"
+import type { HTMLAttributes } from "vue";
+import { useVModel } from "@vueuse/core";
+import { cn } from "@/lib/utils";
 
 const props = defineProps<{
-  defaultValue?: string | number
-  modelValue?: string | number | null
-  class?: HTMLAttributes["class"]
-}>()
+    defaultValue?: string | number;
+    modelValue?: string | number | null;
+    class?: HTMLAttributes["class"];
+    invalid?: boolean;
+}>();
 
 const emits = defineEmits<{
-  (e: "update:modelValue", payload: string | number): void
-}>()
+    (e: "update:modelValue", payload: string | number): void;
+}>();
 
 const modelValue = useVModel(props, "modelValue", emits, {
-  passive: true,
-  defaultValue: props.defaultValue,
-})
+    passive: true,
+    defaultValue: props.defaultValue,
+});
 </script>
 
 <template>
-  <input
-    v-model="modelValue"
-    data-slot="input"
-    :class="cn(
-      'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
-      'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
-      'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
-      props.class,
-    )"
-  >
+    <input
+        v-model="modelValue"
+        data-slot="input"
+        :data-invalid="invalid ? '' : undefined"
+        :aria-invalid="invalid ? 'true' : undefined"
+        :class="
+            cn(
+                'border-input bg-card placeholder:text-muted-foreground selection:bg-brand selection:text-brand-foreground min-h-control w-full min-w-0 rounded-md border px-3 py-2 text-base shadow-xs transition-[border-color,box-shadow] outline-none file:mr-3 file:inline-flex file:min-h-8 file:border-0 file:bg-transparent file:text-body file:font-semibold disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-muted disabled:opacity-60 md:text-body',
+                'hover:border-primary/45 focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35',
+                'aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/25',
+                props.class,
+            )
+        "
+    />
 </template>

resources/js/components/ui/select/SelectContent.vue

@@ -1,51 +1,60 @@
 <script setup lang="ts">
-import type { SelectContentEmits, SelectContentProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
+import type { SelectContentEmits, SelectContentProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import { reactiveOmit } from "@vueuse/core";
 import {
-  SelectContent,
-  SelectPortal,
-  SelectViewport,
-  useForwardPropsEmits,
-} from "reka-ui"
-import { cn } from "@/lib/utils"
-import { SelectScrollDownButton, SelectScrollUpButton } from "."
+    SelectContent,
+    SelectPortal,
+    SelectViewport,
+    useForwardPropsEmits,
+} from "reka-ui";
+import { cn } from "@/lib/utils";
+import { SelectScrollDownButton, SelectScrollUpButton } from ".";
 
 defineOptions({
-  inheritAttrs: false,
-})
+    inheritAttrs: false,
+});
 
 const props = withDefaults(
-  defineProps<SelectContentProps & { class?: HTMLAttributes["class"] }>(),
-  {
-    position: "popper",
-  },
-)
-const emits = defineEmits<SelectContentEmits>()
+    defineProps<SelectContentProps & { class?: HTMLAttributes["class"] }>(),
+    {
+        position: "popper",
+    },
+);
+const emits = defineEmits<SelectContentEmits>();
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, "class");
 
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
+const forwarded = useForwardPropsEmits(delegatedProps, emits);
 </script>
 
 <template>
-  <SelectPortal>
-    <SelectContent
-      data-slot="select-content"
-      v-bind="{ ...$attrs, ...forwarded }"
-      :class="cn(
-        'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--reka-select-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border shadow-md',
-        position === 'popper'
-          && 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
-        props.class,
-      )
-      "
-    >
-      <SelectScrollUpButton />
-      <SelectViewport :class="cn('p-1', position === 'popper' && 'h-[var(--reka-select-trigger-height)] w-full min-w-[var(--reka-select-trigger-width)] scroll-my-1')">
-        <slot />
-      </SelectViewport>
-      <SelectScrollDownButton />
-    </SelectContent>
-  </SelectPortal>
+    <SelectPortal>
+        <SelectContent
+            data-slot="select-content"
+            v-bind="{ ...$attrs, ...forwarded }"
+            :class="
+                cn(
+                    'bg-popover text-popover-foreground border-border data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--reka-select-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded-md border shadow-lg',
+                    position === 'popper' &&
+                        'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
+                    props.class,
+                )
+            "
+        >
+            <SelectScrollUpButton />
+            <SelectViewport
+                :class="
+                    cn(
+                        'p-1',
+                        position === 'popper' &&
+                            'h-[var(--reka-select-trigger-height)] w-full min-w-[var(--reka-select-trigger-width)] scroll-my-1',
+                    )
+                "
+            >
+                <slot />
+            </SelectViewport>
+            <SelectScrollDownButton />
+        </SelectContent>
+    </SelectPortal>
 </template>

resources/js/components/ui/select/SelectItem.vue

@@ -1,44 +1,48 @@
 <script setup lang="ts">
-import type { SelectItemProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { Check } from "lucide-vue-next"
+import type { SelectItemProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import { reactiveOmit } from "@vueuse/core";
+import { Check } from "lucide-vue-next";
 import {
-  SelectItem,
-  SelectItemIndicator,
-  SelectItemText,
-  useForwardProps,
-} from "reka-ui"
-import { cn } from "@/lib/utils"
+    SelectItem,
+    SelectItemIndicator,
+    SelectItemText,
+    useForwardProps,
+} from "reka-ui";
+import { cn } from "@/lib/utils";
 
-const props = defineProps<SelectItemProps & { class?: HTMLAttributes["class"] }>()
+const props = defineProps<
+    SelectItemProps & { class?: HTMLAttributes["class"] }
+>();
 
-const delegatedProps = reactiveOmit(props, "class")
+const delegatedProps = reactiveOmit(props, "class");
 
-const forwardedProps = useForwardProps(delegatedProps)
+const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <SelectItem
-    data-slot="select-item"
-    v-bind="forwardedProps"
-    :class="
-      cn(
-        'focus:bg-accent focus:text-accent-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',
-        props.class,
-      )
-    "
-  >
-    <span class="absolute right-2 flex size-3.5 items-center justify-center">
-      <SelectItemIndicator>
-        <slot name="indicator-icon">
-          <Check class="size-4" />
-        </slot>
-      </SelectItemIndicator>
-    </span>
+    <SelectItem
+        data-slot="select-item"
+        v-bind="forwardedProps"
+        :class="
+            cn(
+                'data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground relative flex min-h-9 w-full cursor-default items-center gap-2 rounded-sm py-2 pr-8 pl-2 text-body outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2',
+                props.class,
+            )
+        "
+    >
+        <span
+            class="absolute right-2 flex size-3.5 items-center justify-center"
+        >
+            <SelectItemIndicator>
+                <slot name="indicator-icon">
+                    <Check class="size-4" />
+                </slot>
+            </SelectItemIndicator>
+        </span>
 
-    <SelectItemText>
-      <slot />
-    </SelectItemText>
-  </SelectItem>
+        <SelectItemText>
+            <slot />
+        </SelectItemText>
+    </SelectItem>
 </template>

resources/js/components/ui/select/SelectTrigger.vue

@@ -1,33 +1,45 @@
 <script setup lang="ts">
-import type { SelectTriggerProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { ChevronDown } from "lucide-vue-next"
-import { SelectIcon, SelectTrigger, useForwardProps } from "reka-ui"
-import { cn } from "@/lib/utils"
+import type { SelectTriggerProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
+import { reactiveOmit } from "@vueuse/core";
+import { ChevronDown } from "lucide-vue-next";
+import { SelectIcon, SelectTrigger, useForwardProps } from "reka-ui";
+import { cn } from "@/lib/utils";
 
 const props = withDefaults(
-  defineProps<SelectTriggerProps & { class?: HTMLAttributes["class"], size?: "sm" | "default" }>(),
-  { size: "default" },
-)
+    defineProps<
+        SelectTriggerProps & {
+            class?: HTMLAttributes["class"];
+            size?: "sm" | "default";
+            invalid?: boolean;
+        }
+    >(),
+    { size: "default", invalid: false },
+);
 
-const delegatedProps = reactiveOmit(props, "class", "size")
-const forwardedProps = useForwardProps(delegatedProps)
+const delegatedProps = reactiveOmit(props, "class", "size", "invalid");
+const forwardedProps = useForwardProps(delegatedProps);
 </script>
 
 <template>
-  <SelectTrigger
-    data-slot="select-trigger"
-    :data-size="size"
-    v-bind="forwardedProps"
-    :class="cn(
-      'border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*=\'text-\'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4',
-      props.class,
-    )"
-  >
-    <slot />
-    <SelectIcon as-child>
-      <ChevronDown class="size-4 opacity-50" />
-    </SelectIcon>
-  </SelectTrigger>
+    <SelectTrigger
+        data-slot="select-trigger"
+        :data-size="size"
+        :data-invalid="invalid ? '' : undefined"
+        :aria-invalid="invalid ? 'true' : undefined"
+        v-bind="forwardedProps"
+        :class="
+            cn(
+                'group/select-trigger border-input bg-card data-[placeholder]:text-muted-foreground flex w-fit items-center justify-between gap-2 rounded-md border px-3 py-2 text-body whitespace-nowrap shadow-xs transition-[border-color,box-shadow] outline-none hover:border-primary/45 focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/35 disabled:cursor-not-allowed disabled:bg-muted disabled:opacity-60 data-[state=open]:border-primary data-[size=default]:min-h-control data-[size=sm]:min-h-9 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/25 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*=\'size-\'])]:size-4 [&_svg:not([class*=\'text-\'])]:text-muted-foreground',
+                props.class,
+            )
+        "
+    >
+        <slot />
+        <SelectIcon as-child>
+            <ChevronDown
+                class="size-4 transition-transform duration-150 group-data-[state=open]/select-trigger:rotate-180"
+            />
+        </SelectIcon>
+    </SelectTrigger>
 </template>

resources/js/components/ui/spinner/Spinner.vue

@@ -1,17 +1,23 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from "vue"
-import { Loader2Icon } from "lucide-vue-next"
-import { cn } from "@/lib/utils"
+import type { HTMLAttributes } from "vue";
+import { Loader2Icon } from "lucide-vue-next";
+import { computed } from "vue";
+import { useLocalization } from "@/composables/useLocalization";
+import { cn } from "@/lib/utils";
 
 const props = defineProps<{
-  class?: HTMLAttributes["class"]
-}>()
+    class?: HTMLAttributes["class"];
+    label?: string;
+}>();
+
+const { t } = useLocalization();
+const accessibleLabel = computed(() => props.label ?? t("common.loading"));
 </script>
 
 <template>
-  <Loader2Icon
-    role="status"
-    aria-label="Loading"
-    :class="cn('size-4 animate-spin', props.class)"
-  />
+    <Loader2Icon
+        role="status"
+        :aria-label="accessibleLabel"
+        :class="cn('size-4 animate-spin', props.class)"
+    />
 </template>

resources/js/composables/useAppearance.ts

@@ -1,124 +1,107 @@
-import type { ComputedRef, Ref } from 'vue';
-import { computed, onMounted, ref } from 'vue';
+import type { App, ComputedRef, InjectionKey, Ref } from 'vue';
+import { computed, inject, readonly, ref } from 'vue';
 import type { Appearance, ResolvedAppearance } from '@/types';
 
 export type { Appearance, ResolvedAppearance };
 
 export type UseAppearanceReturn = {
-    appearance: Ref<Appearance>;
+    appearance: Readonly<Ref<Appearance>>;
     resolvedAppearance: ComputedRef<ResolvedAppearance>;
     updateAppearance: (value: Appearance) => void;
 };
 
-export function updateTheme(value: Appearance): void {
-    if (typeof window === 'undefined') {
-        return;
-    }
+const appearanceKey: InjectionKey<UseAppearanceReturn> = Symbol('appearance');
 
-    if (value === 'system') {
-        const mediaQueryList = window.matchMedia(
-            '(prefers-color-scheme: dark)',
-        );
-        const systemTheme = mediaQueryList.matches ? 'dark' : 'light';
+export function normalizeAppearance(value: unknown): Appearance {
+    return value === 'light' || value === 'dark' ? value : 'system';
+}
 
+/** Each Vue app owns its state, including each server-rendered request. */
+export function createAppearance(initialAppearance: Appearance = 'system') {
+    const appearance = ref<Appearance>(normalizeAppearance(initialAppearance));
+    const systemDark = ref(false);
+    const resolvedAppearance = computed<ResolvedAppearance>(() =>
+        appearance.value === 'system'
+            ? systemDark.value
+                ? 'dark'
+                : 'light'
+            : appearance.value,
+    );
+
+    function applyTheme(): void {
         document.documentElement.classList.toggle(
             'dark',
-            systemTheme === 'dark',
+            resolvedAppearance.value === 'dark',
         );
-    } else {
-        document.documentElement.classList.toggle('dark', value === 'dark');
-    }
-}
-
-const setCookie = (name: string, value: string, days = 365) => {
-    if (typeof document === 'undefined') {
-        return;
+        document.documentElement.style.colorScheme = resolvedAppearance.value;
+        document.documentElement.dataset.appearance = appearance.value;
     }
 
-    const maxAge = days * 24 * 60 * 60;
-
-    document.cookie = `${name}=${value};path=/;max-age=${maxAge};SameSite=Lax`;
-};
-
-const mediaQuery = () => {
-    if (typeof window === 'undefined') {
-        return null;
-    }
-
-    return window.matchMedia('(prefers-color-scheme: dark)');
-};
-
-const getStoredAppearance = () => {
-    if (typeof window === 'undefined') {
-        return null;
-    }
-
-    return localStorage.getItem('appearance') as Appearance | null;
-};
-
-const prefersDark = (): boolean => {
-    if (typeof window === 'undefined') {
-        return false;
-    }
-
-    return window.matchMedia('(prefers-color-scheme: dark)').matches;
-};
-
-const handleSystemThemeChange = () => {
-    const currentAppearance = getStoredAppearance();
-
-    updateTheme(currentAppearance || 'system');
-};
-
-export function initializeTheme(): void {
-    if (typeof window === 'undefined') {
-        return;
-    }
-
-    // Initialize theme from saved preference or default to system...
-    const savedAppearance = getStoredAppearance();
-    updateTheme(savedAppearance || 'system');
-
-    // Set up system theme change listener...
-    mediaQuery()?.addEventListener('change', handleSystemThemeChange);
-}
-
-const appearance = ref<Appearance>('system');
-
-export function useAppearance(): UseAppearanceReturn {
-    onMounted(() => {
-        const savedAppearance = localStorage.getItem(
-            'appearance',
-        ) as Appearance | null;
-
-        if (savedAppearance) {
-            appearance.value = savedAppearance;
-        }
-    });
-
-    const resolvedAppearance = computed<ResolvedAppearance>(() => {
-        if (appearance.value === 'system') {
-            return prefersDark() ? 'dark' : 'light';
+    function updateAppearance(value: Appearance): void {
+        appearance.value = normalizeAppearance(value);
+        if (typeof window === 'undefined') {
+            return;
         }
 
-        return appearance.value;
-    });
+        applyTheme();
+        try {
+            window.localStorage.setItem('appearance', appearance.value);
+        } catch {
+            // Private or embedded browsers may deny storage; the current theme still works.
+        }
+        document.cookie = `appearance=${appearance.value};path=/;max-age=31536000;SameSite=Lax`;
+    }
 
-    function updateAppearance(value: Appearance) {
-        appearance.value = value;
+    function handleSystemChange(event: MediaQueryListEvent): void {
+        systemDark.value = event.matches;
+        applyTheme();
+    }
 
-        // Store in localStorage for client-side persistence...
-        localStorage.setItem('appearance', value);
-
-        // Store in cookie for SSR...
-        setCookie('appearance', value);
-
-        updateTheme(value);
+    function handleStorageChange(event: StorageEvent): void {
+        if (event.key === 'appearance' || event.key === null) {
+            updateAppearance(normalizeAppearance(event.newValue));
+        }
     }
 
     return {
-        appearance,
+        appearance: readonly(appearance),
         resolvedAppearance,
         updateAppearance,
+        install(app: App): void {
+            app.provide(appearanceKey, {
+                appearance: readonly(appearance),
+                resolvedAppearance,
+                updateAppearance,
+            });
+            if (typeof window === 'undefined') {
+                return;
+            }
+
+            // The blocking head script already reconciled local storage and the SSR cookie.
+            appearance.value = normalizeAppearance(
+                document.documentElement.dataset.appearance ??
+                    initialAppearance,
+            );
+            const media = window.matchMedia('(prefers-color-scheme: dark)');
+            systemDark.value = media.matches;
+            applyTheme();
+            media.addEventListener('change', handleSystemChange);
+            window.addEventListener('storage', handleStorageChange);
+
+            app.onUnmount(() => {
+                media.removeEventListener('change', handleSystemChange);
+                window.removeEventListener('storage', handleStorageChange);
+            });
+        },
     };
 }
+
+export function useAppearance(): UseAppearanceReturn {
+    const appearance = inject(appearanceKey);
+    if (!appearance) {
+        throw new Error(
+            'The appearance plugin must be installed before useAppearance().',
+        );
+    }
+    return appearance;
+}

resources/js/composables/useLocalization.ts

@@ -0,0 +1,12 @@
+import { inject } from 'vue';
+import { localizationKey } from '@/lib/localization';
+
+export function useLocalization() {
+    const localization = inject(localizationKey);
+    if (!localization) {
+        throw new Error(
+            'The localization plugin must be installed before useLocalization().',
+        );
+    }
+    return localization;
+}

resources/js/lib/acceptance-criteria.ts

@@ -121,9 +121,7 @@ const parseChecklistLine = (
         return null;
     }
 
-    const indentLevel = clampIndent(
-        Math.floor(match.groups.indent.length / 2),
-    );
+    const indentLevel = clampIndent(Math.floor(match.groups.indent.length / 2));
     let content = match.groups.content.trim();
     let checked = false;
 

resources/js/lib/localization.ts

@@ -0,0 +1,159 @@
+import { readonly, ref } from 'vue';
+import type { App, InjectionKey } from 'vue';
+import { en } from '@/locales/en';
+import type {
+    LocalizationSettings,
+    TranslationCatalog,
+    TranslationKey,
+    TranslationParameters,
+} from '@/types/localization';
+
+const defaultLocale = 'en';
+const catalogs: Record<string, TranslationCatalog> = { en };
+
+function placeholders(message: string): string[] {
+    return [
+        ...new Set(
+            [...message.matchAll(/\{(\w+)\}/g)].map((match) => match[1]),
+        ),
+    ].sort();
+}
+
+/** Validate every catalog, including messages that no component has rendered yet. */
+export function validateCatalog(catalog: TranslationCatalog): void {
+    for (const key of Object.keys(en) as TranslationKey[]) {
+        const message = Object.hasOwn(catalog, key) ? catalog[key] : undefined;
+        const source = en[key];
+
+        if (message === undefined || typeof message !== typeof source) {
+            throw new Error(`Missing or invalid translation: ${key}`);
+        }
+
+        const expected = placeholders(
+            typeof source === 'string' ? source : source.other,
+        );
+        const forms =
+            typeof message === 'string'
+                ? [message]
+                : Object.values(message ?? {});
+
+        if (
+            typeof message !== 'string' &&
+            (!message || typeof message.other !== 'string')
+        ) {
+            throw new Error(`Missing plural fallback: ${key}`);
+        }
+
+        for (const form of forms) {
+            if (
+                typeof form !== 'string' ||
+                form.trim() === '' ||
+                JSON.stringify(placeholders(form)) !== JSON.stringify(expected)
+            ) {
+                throw new Error(`Invalid translation placeholders: ${key}`);
+            }
+        }
+    }
+}
+
+export function createLocalization(
+    settings: Partial<LocalizationSettings> = {},
+    availableCatalogs: Record<string, TranslationCatalog> = catalogs,
+) {
+    const messages: Record<string, TranslationCatalog> = {
+        ...availableCatalogs,
+        en,
+    };
+    for (const catalog of Object.values(messages)) {
+        validateCatalog(catalog);
+    }
+
+    function resolveLocale(requested: string): string {
+        try {
+            const [canonical] = Intl.getCanonicalLocales(
+                requested.replaceAll('_', '-'),
+            );
+            if (Object.hasOwn(messages, canonical)) {
+                return canonical;
+            }
+            const language = canonical.split('-')[0];
+            return Object.hasOwn(messages, language) ? language : defaultLocale;
+        } catch {
+            return defaultLocale;
+        }
+    }
+
+    const locale = ref(resolveLocale(settings.locale ?? defaultLocale));
+    const timeZone = settings.timeZone ?? 'UTC';
+
+    function number(
+        value: number,
+        options: Intl.NumberFormatOptions = {},
+    ): string {
+        return new Intl.NumberFormat(locale.value, options).format(value);
+    }
+
+    function date(
+        value: Date | number,
+        options: Intl.DateTimeFormatOptions = {},
+    ): string {
+        return new Intl.DateTimeFormat(locale.value, {
+            timeZone,
+            ...options,
+        }).format(value);
+    }
+
+    /** Interpolate plain text only; render with Vue text bindings, never v-html. */
+    function t(
+        key: TranslationKey,
+        parameters: TranslationParameters = {},
+    ): string {
+        const catalog = messages[locale.value];
+        if (!Object.hasOwn(catalog, key)) {
+            throw new Error(`Missing translation: ${key}`);
+        }
+
+        const message = catalog[key];
+        let template: string;
+        if (typeof message === 'string') {
+            template = message;
+        } else {
+            const count = parameters.count;
+            if (typeof count !== 'number' || !Number.isFinite(count)) {
+                throw new Error(`Translation requires a finite count: ${key}`);
+            }
+            template =
+                message[new Intl.PluralRules(locale.value).select(count)] ??
+                message.other;
+        }
+
+        return template.replace(/\{(\w+)\}/g, (_, name: string) => {
+            if (!Object.hasOwn(parameters, name)) {
+                throw new Error(
+                    `Missing translation parameter: ${key}.${name}`,
+                );
+            }
+            const value = parameters[name];
+            return typeof value === 'number' ? number(value) : value;
+        });
+    }
+
+    const localization = {
+        locale: readonly(locale),
+        t,
+        number,
+        date,
+        setLocale(requested: string): void {
+            locale.value = resolveLocale(requested);
+        },
+        install(app: App): void {
+            app.provide(localizationKey, localization);
+        },
+    };
+
+    return localization;
+}
+
+export type Localization = ReturnType<typeof createLocalization>;
+export const localizationKey: InjectionKey<Localization> =
+    Symbol('localization');

resources/js/locales/en.ts

@@ -0,0 +1,15 @@
+export const en = {
+    'appearance.label': 'Color theme',
+    'appearance.light': 'Light',
+    'appearance.dark': 'Dark',
+    'appearance.system': 'System',
+    'common.cancel': 'Cancel',
+    'common.save': 'Save',
+    'common.loading': 'Loading…',
+    'common.error': 'Something went wrong.',
+    'pagination.page': 'Page {page} of {total}',
+    'tickets.count': {
+        one: '{count} ticket',
+        other: '{count} tickets',
+    },
+} as const;

resources/js/pages/admin/users/Create.vue

@@ -52,12 +52,16 @@ const breadcrumbs: BreadcrumbItem[] = [
                 <CardContent>
                     <Form
                         v-bind="UserManagementController.store.form()"
-                        :transform="(data) => ({
-                            ...data,
-                            must_change_password_on_next_login:
-                                data.must_change_password_on_next_login === true ||
-                                data.must_change_password_on_next_login === 'on',
-                        })"
+                        :transform="
+                            (data) => ({
+                                ...data,
+                                must_change_password_on_next_login:
+                                    data.must_change_password_on_next_login ===
+                                        true ||
+                                    data.must_change_password_on_next_login ===
+                                        'on',
+                            })
+                        "
                         class="space-y-6"
                         v-slot="{ errors, processing }"
                     >
@@ -128,13 +132,19 @@ const breadcrumbs: BreadcrumbItem[] = [
                                     <span class="block font-medium">
                                         Must change password on next login
                                     </span>
-                                    <span class="text-muted-foreground block text-sm">
-                                        Redirect the user to the security settings page until they save a new password.
+                                    <span
+                                        class="text-muted-foreground block text-sm"
+                                    >
+                                        Redirect the user to the security
+                                        settings page until they save a new
+                                        password.
                                     </span>
                                 </span>
                             </Label>
                             <InputError
-                                :message="errors.must_change_password_on_next_login"
+                                :message="
+                                    errors.must_change_password_on_next_login
+                                "
                             />
                         </div>
 

resources/js/pages/project-templates/Create.vue

@@ -0,0 +1,174 @@
+<script setup lang="ts">
+import { Head, Link, useForm } from '@inertiajs/vue3';
+import { computed } from 'vue';
+import Heading from '@/components/Heading.vue';
+import InputError from '@/components/InputError.vue';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+    Card,
+    CardContent,
+    CardDescription,
+    CardHeader,
+    CardTitle,
+} from '@/components/ui/card';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import AppLayout from '@/layouts/AppLayout.vue';
+import {
+    index as projectsIndex,
+    show as projectShow,
+} from '@/routes/projects/index';
+import {
+    create as projectTemplateCreate,
+    store as projectTemplateStore,
+} from '@/routes/projects/templates';
+import type { BreadcrumbItem, ProjectTemplatesCreatePageProps } from '@/types';
+
+const props = defineProps<ProjectTemplatesCreatePageProps>();
+
+const breadcrumbs: BreadcrumbItem[] = [
+    {
+        title: 'Projects',
+        href: projectsIndex(),
+    },
+    {
+        title: props.project.name,
+        href: projectShow(props.project.id),
+    },
+    {
+        title: 'Save as new template',
+        href: projectTemplateCreate(props.project.id),
+    },
+];
+
+const form = useForm({
+    copy_areas: props.copyAreaOptions.map(
+        (copyAreaOption) => copyAreaOption.value,
+    ),
+    name: `${props.project.name} template`,
+    slug: `${props.project.key.toLowerCase()}-template`,
+});
+
+const copyAreasError = computed(() => {
+    return (
+        form.errors.copy_areas ??
+        Object.entries(form.errors).find(([key]) =>
+            key.startsWith('copy_areas.'),
+        )?.[1] ??
+        ''
+    );
+});
+
+const submit = (): void => {
+    form.post(projectTemplateStore.url(props.project.id), {
+        preserveScroll: true,
+    });
+};
+</script>
+
+<template>
+    <AppLayout :breadcrumbs="breadcrumbs">
+        <Head :title="`Save ${project.name} as new template`" />
+
+        <div class="mx-auto flex w-full max-w-3xl flex-1 flex-col gap-6 p-4">
+            <div class="space-y-3">
+                <Badge variant="outline" class="px-3 py-1">{{
+                    project.key
+                }}</Badge>
+                <Heading
+                    :title="`Save ${project.name} as new template`"
+                    description="Capture reusable project configuration without copying operational ticket data."
+                />
+            </div>
+
+            <Card>
+                <CardHeader>
+                    <CardTitle>Template details</CardTitle>
+                    <CardDescription>
+                        Pick the configuration groups that should be reusable in
+                        future projects.
+                    </CardDescription>
+                </CardHeader>
+
+                <CardContent>
+                    <form class="space-y-6" @submit.prevent="submit">
+                        <div class="grid gap-2">
+                            <Label for="name">Template name</Label>
+                            <Input
+                                id="name"
+                                v-model="form.name"
+                                required
+                                placeholder="Foundation template"
+                            />
+                            <InputError :message="form.errors.name" />
+                        </div>
+
+                        <div class="grid gap-2">
+                            <Label for="slug">Template slug</Label>
+                            <Input
+                                id="slug"
+                                v-model="form.slug"
+                                required
+                                placeholder="foundation-template"
+                            />
+                            <p class="text-muted-foreground text-sm">
+                                Slugs are normalized automatically and used to
+                                identify reusable templates.
+                            </p>
+                            <InputError :message="form.errors.slug" />
+                        </div>
+
+                        <div class="grid gap-3">
+                            <div>
+                                <Label>Configuration groups</Label>
+                                <p class="text-muted-foreground text-sm">
+                                    Only the selected groups will be stored in
+                                    the template.
+                                </p>
+                            </div>
+
+                            <div class="grid gap-3">
+                                <Label
+                                    v-for="copyAreaOption in copyAreaOptions"
+                                    :key="copyAreaOption.value"
+                                    class="flex cursor-pointer items-start gap-3 rounded-xl border p-4"
+                                >
+                                    <input
+                                        v-model="form.copy_areas"
+                                        type="checkbox"
+                                        :value="copyAreaOption.value"
+                                        class="mt-1"
+                                    />
+                                    <div class="space-y-1">
+                                        <div class="font-medium">
+                                            {{ copyAreaOption.label }}
+                                        </div>
+                                        <p
+                                            class="text-muted-foreground text-sm"
+                                        >
+                                            {{ copyAreaOption.description }}
+                                        </p>
+                                    </div>
+                                </Label>
+                            </div>
+                            <InputError :message="copyAreasError" />
+                        </div>
+
+                        <div class="flex items-center gap-3">
+                            <Button type="submit" :disabled="form.processing">
+                                Save new template
+                            </Button>
+
+                            <Button as-child variant="outline">
+                                <Link :href="projectShow(project.id)"
+                                    >Cancel</Link
+                                >
+                            </Button>
+                        </div>
+                    </form>
+                </CardContent>
+            </Card>
+        </div>
+    </AppLayout>
+</template>

resources/js/pages/project-templates/Edit.vue

@@ -0,0 +1,223 @@
+<script setup lang="ts">
+import { Head, Link, useForm } from '@inertiajs/vue3';
+import { computed } from 'vue';
+import Heading from '@/components/Heading.vue';
+import InputError from '@/components/InputError.vue';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+    Card,
+    CardContent,
+    CardDescription,
+    CardHeader,
+    CardTitle,
+} from '@/components/ui/card';
+import { Input } from '@/components/ui/input';
+import { Label } from '@/components/ui/label';
+import AppLayout from '@/layouts/AppLayout.vue';
+import {
+    edit as projectTemplatesEdit,
+    index as projectTemplatesIndex,
+    update as projectTemplatesUpdate,
+} from '@/routes/project-templates';
+import type { BreadcrumbItem, ProjectTemplatesEditPageProps } from '@/types';
+
+const props = defineProps<ProjectTemplatesEditPageProps>();
+
+const breadcrumbs: BreadcrumbItem[] = [
+    {
+        title: 'Project templates',
+        href: projectTemplatesIndex(),
+    },
+    {
+        title: props.template.name,
+        href: projectTemplatesEdit(props.template.id),
+    },
+];
+
+const form = useForm({
+    confirm_linked_projects_update: false,
+    copy_areas: [...props.template.copy_areas],
+    name: props.template.name,
+});
+
+const copyAreasError = computed(() => {
+    return (
+        form.errors.copy_areas ??
+        Object.entries(form.errors).find(([key]) =>
+            key.startsWith('copy_areas.'),
+        )?.[1] ??
+        ''
+    );
+});
+
+const linkedProjectCount = computed(
+    () => props.template.linked_project_count ?? 0,
+);
+
+const submit = (): void => {
+    form.patch(projectTemplatesUpdate.url(props.template.id), {
+        preserveScroll: true,
+    });
+};
+</script>
+
+<template>
+    <AppLayout :breadcrumbs="breadcrumbs">
+        <Head :title="`Edit ${template.name}`" />
+
+        <div class="mx-auto flex w-full max-w-3xl flex-1 flex-col gap-6 p-4">
+            <div class="space-y-3">
+                <div class="flex flex-wrap items-center gap-3">
+                    <Badge variant="outline" class="px-3 py-1">{{
+                        template.slug
+                    }}</Badge>
+                    <Badge v-if="linkedProjectCount > 0" variant="secondary">
+                        {{ linkedProjectCount }} linked
+                        {{ linkedProjectCount === 1 ? 'project' : 'projects' }}
+                    </Badge>
+                </div>
+                <Heading
+                    :title="`Edit ${template.name}`"
+                    description="Refresh the template baseline from its source project while keeping immutable identifiers protected."
+                />
+            </div>
+
+            <Card>
+                <CardHeader>
+                    <CardTitle>Template details</CardTitle>
+                    <CardDescription>
+                        <template v-if="template.source_project">
+                            This template baseline is rebuilt from
+                            {{ template.source_project.name }} ({{
+                                template.source_project.key
+                            }}) when you save.
+                        </template>
+                        <template v-else>
+                            This template baseline is rebuilt from its source
+                            project when you save.
+                        </template>
+                    </CardDescription>
+                </CardHeader>
+
+                <CardContent>
+                    <form class="space-y-6" @submit.prevent="submit">
+                        <div class="grid gap-2">
+                            <Label for="name">Template name</Label>
+                            <Input
+                                id="name"
+                                v-model="form.name"
+                                required
+                                placeholder="Foundation template"
+                            />
+                            <InputError :message="form.errors.name" />
+                        </div>
+
+                        <div class="grid gap-2">
+                            <Label for="slug">Template slug</Label>
+                            <Input
+                                id="slug"
+                                :model-value="template.slug"
+                                disabled
+                            />
+                            <p class="text-muted-foreground text-sm">
+                                The slug stays locked so existing template
+                                references remain stable.
+                            </p>
+                        </div>
+
+                        <div class="grid gap-3">
+                            <div>
+                                <Label>Configuration groups</Label>
+                                <p class="text-muted-foreground text-sm">
+                                    Saving rebuilds the selected groups from the
+                                    current source-project configuration.
+                                </p>
+                            </div>
+
+                            <div class="grid gap-3">
+                                <Label
+                                    v-for="copyAreaOption in copyAreaOptions"
+                                    :key="copyAreaOption.value"
+                                    class="flex cursor-pointer items-start gap-3 rounded-xl border p-4"
+                                >
+                                    <input
+                                        v-model="form.copy_areas"
+                                        type="checkbox"
+                                        :value="copyAreaOption.value"
+                                        class="mt-1"
+                                    />
+                                    <div class="space-y-1">
+                                        <div class="font-medium">
+                                            {{ copyAreaOption.label }}
+                                        </div>
+                                        <p
+                                            class="text-muted-foreground text-sm"
+                                        >
+                                            {{ copyAreaOption.description }}
+                                        </p>
+                                    </div>
+                                </Label>
+                            </div>
+                            <InputError :message="copyAreasError" />
+                        </div>
+
+                        <div
+                            v-if="linkedProjectCount > 0"
+                            class="space-y-3 rounded-xl border border-amber-300 bg-amber-50 p-4 text-amber-950 dark:border-amber-900/70 dark:bg-amber-950/40 dark:text-amber-100"
+                        >
+                            <div class="space-y-1">
+                                <div class="font-medium">Warning</div>
+                                <p class="text-sm">
+                                    Saving this template updates the baseline
+                                    for {{ linkedProjectCount }} linked
+                                    {{
+                                        linkedProjectCount === 1
+                                            ? 'project'
+                                            : 'projects'
+                                    }}. Inherited areas will follow the new
+                                    template version, while existing overrides
+                                    stay untouched.
+                                </p>
+                            </div>
+
+                            <Label
+                                class="flex cursor-pointer items-start gap-3"
+                            >
+                                <input
+                                    v-model="
+                                        form.confirm_linked_projects_update
+                                    "
+                                    type="checkbox"
+                                    class="mt-1"
+                                />
+                                <span class="text-sm">
+                                    I understand that linked projects inheriting
+                                    from this template will be affected.
+                                </span>
+                            </Label>
+
+                            <InputError
+                                :message="
+                                    form.errors.confirm_linked_projects_update
+                                "
+                            />
+                        </div>
+
+                        <div class="flex items-center gap-3">
+                            <Button type="submit" :disabled="form.processing">
+                                Save template changes
+                            </Button>
+
+                            <Button as-child variant="outline">
+                                <Link :href="projectTemplatesIndex()"
+                                    >Cancel</Link
+                                >
+                            </Button>
+                        </div>
+                    </form>
+                </CardContent>
+            </Card>
+        </div>
+    </AppLayout>
+</template>

resources/js/pages/project-templates/Index.vue

@@ -0,0 +1,158 @@
+<script setup lang="ts">
+import { Head, Link, router } from '@inertiajs/vue3';
+import Heading from '@/components/Heading.vue';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+    Card,
+    CardContent,
+    CardDescription,
+    CardHeader,
+    CardTitle,
+} from '@/components/ui/card';
+import AppLayout from '@/layouts/AppLayout.vue';
+import {
+    destroy as projectTemplatesDestroy,
+    edit as projectTemplatesEdit,
+    index as projectTemplatesIndex,
+} from '@/routes/project-templates';
+import {
+    create as projectsCreate,
+    index as projectsIndex,
+} from '@/routes/projects/index';
+import type { BreadcrumbItem, ProjectTemplatesIndexPageProps } from '@/types';
+
+const props = defineProps<ProjectTemplatesIndexPageProps>();
+
+const breadcrumbs: BreadcrumbItem[] = [
+    {
+        title: 'Project templates',
+        href: projectTemplatesIndex(),
+    },
+];
+
+const removeTemplate = (templateId: number): void => {
+    router.delete(projectTemplatesDestroy.url(templateId), {
+        preserveScroll: true,
+    });
+};
+</script>
+
+<template>
+    <AppLayout :breadcrumbs="breadcrumbs">
+        <Head title="Project templates" />
+
+        <div class="flex flex-1 flex-col gap-6 p-4">
+            <div
+                class="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between"
+            >
+                <Heading
+                    title="Project templates"
+                    description="Reusable published project templates. Internal project base templates stay hidden here by default."
+                />
+
+                <div class="flex flex-wrap gap-3">
+                    <Button as-child variant="outline">
+                        <Link :href="projectsIndex()">Back to projects</Link>
+                    </Button>
+
+                    <Button as-child>
+                        <Link :href="projectsCreate()">Create project</Link>
+                    </Button>
+                </div>
+            </div>
+
+            <div
+                v-if="status"
+                class="rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-900 dark:border-emerald-900/70 dark:bg-emerald-950/40 dark:text-emerald-100"
+            >
+                {{ status }}
+            </div>
+
+            <div
+                v-if="templates.length === 0"
+                class="text-muted-foreground text-sm"
+            >
+                No published project templates have been saved yet.
+            </div>
+
+            <div v-else class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
+                <Card
+                    v-for="template in templates"
+                    :key="template.id"
+                    class="h-full"
+                >
+                    <CardHeader>
+                        <div class="flex flex-wrap items-center gap-2">
+                            <CardTitle>{{ template.name }}</CardTitle>
+                            <Badge variant="secondary">{{
+                                template.slug
+                            }}</Badge>
+                            <Badge
+                                v-if="template.linked_project_count"
+                                variant="outline"
+                            >
+                                {{ template.linked_project_count }} linked
+                                {{
+                                    template.linked_project_count === 1
+                                        ? 'project'
+                                        : 'projects'
+                                }}
+                            </Badge>
+                        </div>
+                        <CardDescription>
+                            <template v-if="template.source_project">
+                                Saved from
+                                {{ template.source_project.name }} ({{
+                                    template.source_project.key
+                                }}).
+                            </template>
+                            <template v-else>
+                                Saved template configuration.
+                            </template>
+                        </CardDescription>
+                    </CardHeader>
+                    <CardContent class="space-y-4">
+                        <div class="flex flex-wrap gap-2">
+                            <Badge
+                                v-for="copyArea in template.copy_areas"
+                                :key="copyArea"
+                                variant="outline"
+                            >
+                                {{ copyArea }}
+                            </Badge>
+                        </div>
+
+                        <div class="flex flex-wrap gap-3">
+                            <Button as-child variant="secondary">
+                                <Link :href="projectTemplatesEdit(template.id)">
+                                    Edit
+                                </Link>
+                            </Button>
+
+                            <Button as-child variant="outline">
+                                <Link
+                                    :href="
+                                        projectsCreate({
+                                            query: { template: template.id },
+                                        })
+                                    "
+                                >
+                                    Use template
+                                </Link>
+                            </Button>
+
+                            <Button
+                                type="button"
+                                variant="destructive"
+                                @click="removeTemplate(template.id)"
+                            >
+                                Delete
+                            </Button>
+                        </div>
+                    </CardContent>
+                </Card>
+            </div>
+        </div>
+    </AppLayout>
+</template>

resources/js/pages/projects/Backlog.vue

@@ -15,7 +15,10 @@ import AppLayout from '@/layouts/AppLayout.vue';
 import { index as boardIndex } from '@/routes/projects/board';
 import { index as backlogIndex } from '@/routes/projects/backlog';
 import { index, show } from '@/routes/projects/index';
-import { create as createTicket, show as showTicket } from '@/routes/projects/tickets';
+import {
+    create as createTicket,
+    show as showTicket,
+} from '@/routes/projects/tickets';
 import type { BreadcrumbItem, ProjectBacklogPageProps } from '@/types';
 import type { TicketModel } from '@/types/models/ticket-model';
 import type { TicketStatusModel } from '@/types/models/ticket-status-model';

resources/js/pages/projects/Board.vue

@@ -16,7 +16,10 @@ import { index as backlogIndex } from '@/routes/projects/backlog';
 import { index as projectIndex, show } from '@/routes/projects/index';
 import { board as boardSettings } from '@/routes/projects/settings';
 import { index as boardIndex } from '@/routes/projects/board';
-import { create as createTicket, show as showTicket } from '@/routes/projects/tickets';
+import {
+    create as createTicket,
+    show as showTicket,
+} from '@/routes/projects/tickets';
 import type { BreadcrumbItem, ProjectBoardPageProps } from '@/types';
 import type { TicketModel } from '@/types/models/ticket-model';
 import type { TicketStatusModel } from '@/types/models/ticket-status-model';

resources/js/pages/projects/Create.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { Form, Head, Link } from '@inertiajs/vue3';
+import { Head, Link, useForm } from '@inertiajs/vue3';
+import { computed } from 'vue';
 import ProjectController from '@/actions/App/Http/Controllers/ProjectController';
 import Heading from '@/components/Heading.vue';
 import InputError from '@/components/InputError.vue';
@@ -15,7 +16,9 @@ import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import AppLayout from '@/layouts/AppLayout.vue';
 import { create, index } from '@/routes/projects/index';
-import type { BreadcrumbItem } from '@/types';
+import type { BreadcrumbItem, ProjectsCreatePageProps } from '@/types';
+
+const props = defineProps<ProjectsCreatePageProps>();
 
 const breadcrumbs: BreadcrumbItem[] = [
     {
@@ -27,6 +30,49 @@ const breadcrumbs: BreadcrumbItem[] = [
         href: create(),
     },
 ];
+
+const defaultTemplateId =
+    props.selectedSourceTemplateId ?? props.sourceTemplates[0]?.id ?? null;
+
+const form = useForm({
+    copy_areas: [] as string[],
+    creation_mode: defaultTemplateId !== null ? 'template' : 'scratch',
+    key: '',
+    name: '',
+    source_project_id: props.sourceProjects[0]?.id
+        ? String(props.sourceProjects[0].id)
+        : '',
+    source_template_id:
+        defaultTemplateId !== null ? String(defaultTemplateId) : '',
+});
+
+const hasSourceProjects = computed(() => props.sourceProjects.length > 0);
+const hasSourceTemplates = computed(() => props.sourceTemplates.length > 0);
+
+const copyAreasError = computed(() => {
+    return (
+        form.errors.copy_areas ??
+        Object.entries(form.errors).find(([key]) =>
+            key.startsWith('copy_areas.'),
+        )?.[1] ??
+        ''
+    );
+});
+
+const submit = (): void => {
+    if (form.creation_mode !== 'duplicate') {
+        form.source_project_id = '';
+        form.copy_areas = [];
+    }
+
+    if (form.creation_mode !== 'template') {
+        form.source_template_id = '';
+    }
+
+    form.post(ProjectController.store.url(), {
+        preserveScroll: true,
+    });
+};
 </script>
 
 <template>
@@ -36,7 +82,7 @@ const breadcrumbs: BreadcrumbItem[] = [
         <div class="mx-auto flex w-full max-w-3xl flex-1 flex-col gap-6 p-4">
             <Heading
                 title="Create project"
-                description="Create a project with a stable uppercase key that will prefix all future ticket keys."
+                description="Create a fresh project, duplicate selected settings from an existing project, or start from a saved template."
             />
 
             <Card>
@@ -49,28 +95,108 @@ const breadcrumbs: BreadcrumbItem[] = [
                 </CardHeader>
 
                 <CardContent>
-                    <Form
-                        v-bind="ProjectController.store.form()"
-                        class="space-y-6"
-                        v-slot="{ errors, processing }"
-                    >
+                    <form class="space-y-6" @submit.prevent="submit">
+                        <div class="grid gap-3">
+                            <Label>How do you want to start?</Label>
+                            <div class="grid gap-3 sm:grid-cols-3">
+                                <Label
+                                    class="flex cursor-pointer items-start gap-3 rounded-xl border p-4"
+                                >
+                                    <input
+                                        v-model="form.creation_mode"
+                                        type="radio"
+                                        value="scratch"
+                                        class="mt-1"
+                                    />
+                                    <div class="space-y-1">
+                                        <div class="font-medium">
+                                            Create from scratch
+                                        </div>
+                                        <p
+                                            class="text-muted-foreground text-sm"
+                                        >
+                                            Start with the default project
+                                            setup.
+                                        </p>
+                                    </div>
+                                </Label>
+
+                                <Label
+                                    class="flex items-start gap-3 rounded-xl border p-4"
+                                    :class="
+                                        hasSourceProjects
+                                            ? 'cursor-pointer'
+                                            : 'cursor-not-allowed opacity-60'
+                                    "
+                                >
+                                    <input
+                                        v-model="form.creation_mode"
+                                        type="radio"
+                                        value="duplicate"
+                                        class="mt-1"
+                                        :disabled="!hasSourceProjects"
+                                    />
+                                    <div class="space-y-1">
+                                        <div class="font-medium">
+                                            Create from existing project
+                                        </div>
+                                        <p
+                                            class="text-muted-foreground text-sm"
+                                        >
+                                            Copy only the settings you
+                                            explicitly select. Tickets are never
+                                            duplicated.
+                                        </p>
+                                    </div>
+                                </Label>
+
+                                <Label
+                                    class="flex items-start gap-3 rounded-xl border p-4"
+                                    :class="
+                                        hasSourceTemplates
+                                            ? 'cursor-pointer'
+                                            : 'cursor-not-allowed opacity-60'
+                                    "
+                                >
+                                    <input
+                                        v-model="form.creation_mode"
+                                        type="radio"
+                                        value="template"
+                                        class="mt-1"
+                                        :disabled="!hasSourceTemplates"
+                                    />
+                                    <div class="space-y-1">
+                                        <div class="font-medium">
+                                            Create from template
+                                        </div>
+                                        <p
+                                            class="text-muted-foreground text-sm"
+                                        >
+                                            Reuse a saved configuration
+                                            template.
+                                        </p>
+                                    </div>
+                                </Label>
+                            </div>
+                        </div>
+
                         <div class="grid gap-2">
                             <Label for="name">Project name</Label>
                             <Input
                                 id="name"
-                                name="name"
+                                v-model="form.name"
                                 required
                                 autofocus
                                 placeholder="Kanban foundation"
                             />
-                            <InputError :message="errors.name" />
+                            <InputError :message="form.errors.name" />
                         </div>
 
                         <div class="grid gap-2">
                             <Label for="key">Project key</Label>
                             <Input
                                 id="key"
-                                name="key"
+                                v-model="form.key"
                                 required
                                 maxlength="5"
                                 placeholder="CORE"
@@ -82,11 +208,132 @@ const breadcrumbs: BreadcrumbItem[] = [
                                     >CORE-1</span
                                 >.
                             </p>
-                            <InputError :message="errors.key" />
+                            <InputError :message="form.errors.key" />
+                        </div>
+
+                        <div
+                            v-if="form.creation_mode === 'duplicate'"
+                            class="space-y-6 rounded-xl border border-dashed p-4"
+                        >
+                            <div class="grid gap-2">
+                                <Label for="source_project_id"
+                                    >Source project</Label
+                                >
+                                <select
+                                    id="source_project_id"
+                                    v-model="form.source_project_id"
+                                    class="border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+                                    :disabled="!hasSourceProjects"
+                                >
+                                    <option value="">
+                                        Select a source project
+                                    </option>
+                                    <option
+                                        v-for="sourceProject in sourceProjects"
+                                        :key="sourceProject.id"
+                                        :value="String(sourceProject.id)"
+                                    >
+                                        {{ sourceProject.name }} ({{
+                                            sourceProject.key
+                                        }})
+                                    </option>
+                                </select>
+                                <p class="text-muted-foreground text-sm">
+                                    The new project keeps its own identity, key,
+                                    and future ticket numbering.
+                                </p>
+                                <InputError
+                                    :message="form.errors.source_project_id"
+                                />
+                            </div>
+
+                            <div class="grid gap-3">
+                                <div>
+                                    <Label>Copy options</Label>
+                                    <p class="text-muted-foreground text-sm">
+                                        Choose which settings should be copied
+                                        into the new project.
+                                    </p>
+                                </div>
+
+                                <div class="grid gap-3">
+                                    <Label
+                                        v-for="copyAreaOption in copyAreaOptions"
+                                        :key="copyAreaOption.value"
+                                        class="flex cursor-pointer items-start gap-3 rounded-xl border p-4"
+                                    >
+                                        <input
+                                            v-model="form.copy_areas"
+                                            type="checkbox"
+                                            :value="copyAreaOption.value"
+                                            class="mt-1"
+                                        />
+                                        <div class="space-y-1">
+                                            <div class="font-medium">
+                                                {{ copyAreaOption.label }}
+                                            </div>
+                                            <p
+                                                class="text-muted-foreground text-sm"
+                                            >
+                                                {{ copyAreaOption.description }}
+                                            </p>
+                                        </div>
+                                    </Label>
+                                </div>
+
+                                <p class="text-muted-foreground text-sm">
+                                    Operational ticket data is always left
+                                    behind so the new project starts clean.
+                                </p>
+                                <InputError :message="copyAreasError" />
+                            </div>
+                        </div>
+
+                        <div
+                            v-else-if="form.creation_mode === 'template'"
+                            class="space-y-4 rounded-xl border border-dashed p-4"
+                        >
+                            <div class="grid gap-2">
+                                <Label for="source_template_id">Template</Label>
+                                <select
+                                    id="source_template_id"
+                                    v-model="form.source_template_id"
+                                    class="border-input bg-background ring-offset-background placeholder:text-muted-foreground focus-visible:ring-ring flex h-10 w-full rounded-md border px-3 py-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
+                                    :disabled="!hasSourceTemplates"
+                                >
+                                    <option value="">Select a template</option>
+                                    <option
+                                        v-for="sourceTemplate in sourceTemplates"
+                                        :key="sourceTemplate.id"
+                                        :value="String(sourceTemplate.id)"
+                                    >
+                                        {{ sourceTemplate.name }} ({{
+                                            sourceTemplate.slug
+                                        }})
+                                    </option>
+                                </select>
+                                <p class="text-muted-foreground text-sm">
+                                    Templates apply their saved configuration
+                                    groups to the new project.
+                                </p>
+                                <InputError
+                                    :message="form.errors.source_template_id"
+                                />
+                            </div>
+                        </div>
+
+                        <div
+                            v-else-if="
+                                !hasSourceProjects && !hasSourceTemplates
+                            "
+                            class="text-muted-foreground text-sm"
+                        >
+                            No accessible source projects or saved templates are
+                            available yet.
                         </div>
 
                         <div class="flex items-center gap-3">
-                            <Button type="submit" :disabled="processing">
+                            <Button type="submit" :disabled="form.processing">
                                 Create project
                             </Button>
 
@@ -94,7 +341,7 @@ const breadcrumbs: BreadcrumbItem[] = [
                                 <Link :href="index()">Cancel</Link>
                             </Button>
                         </div>
-                    </Form>
+                    </form>
                 </CardContent>
             </Card>
         </div>

resources/js/pages/projects/Show.vue

@@ -22,6 +22,7 @@ import {
     notifications as notificationSettings,
     repositories as repositorySettings,
 } from '@/routes/projects/settings';
+import { create as projectTemplateCreate } from '@/routes/projects/templates';
 import type { BreadcrumbItem, ProjectShowPageProps } from '@/types';
 
 const props = defineProps<ProjectShowPageProps>();
@@ -94,12 +95,50 @@ const projectAreas = [
                         </Link>
                     </Button>
 
+                    <Button
+                        v-if="$page.props.auth.permissions.projectCreate"
+                        as-child
+                        variant="outline"
+                    >
+                        <Link :href="projectTemplateCreate(project.id)">
+                            Save as new template
+                        </Link>
+                    </Button>
+
                     <Button as-child variant="outline">
                         <Link :href="index()">Back to projects</Link>
                     </Button>
                 </div>
             </div>
 
+            <Card v-if="templateState?.inheritsFromTemplate">
+                <CardHeader>
+                    <CardTitle>
+                        Built from template {{ templateState.templateName }}
+                    </CardTitle>
+                    <CardDescription>
+                        This project keeps its template link. Inherited areas
+                        follow the template baseline; overridden areas were
+                        customized locally.
+                    </CardDescription>
+                </CardHeader>
+                <CardContent class="flex flex-wrap gap-2">
+                    <Badge
+                        v-for="area in templateState.inheritedAreas"
+                        :key="`inherited-${area.value}`"
+                        variant="outline"
+                    >
+                        {{ area.label }} · inherited
+                    </Badge>
+                    <Badge
+                        v-for="area in templateState.overriddenAreas"
+                        :key="`overridden-${area.value}`"
+                    >
+                        {{ area.label }} · overridden
+                    </Badge>
+                </CardContent>
+            </Card>
+
             <div v-if="canManageAccess" class="flex flex-wrap gap-3">
                 <Button as-child>
                     <Link :href="boardSettings(project.id)">

resources/js/pages/projects/Ticket.vue

@@ -7,7 +7,6 @@ import {
     buildAcceptanceCriteria,
     formatChecklistLines,
     normalizeAcceptanceCriteria,
-    parseChecklistLines,
     syncAcceptanceCriteriaDescendantCheckedState,
 } from '@/lib/acceptance-criteria';
 import ProjectTicketBranchController from '@/actions/App/Http/Controllers/ProjectTicketBranchController';
@@ -123,7 +122,9 @@ const breadcrumbs: BreadcrumbItem[] = [
 const acceptanceCriteriaEditorState = acceptanceCriteriaToEditorState(
     props.ticket.acceptance_criteria,
 );
-const acceptanceCriteriaChecklist = ref(acceptanceCriteriaEditorState.checklist);
+const acceptanceCriteriaChecklist = ref(
+    acceptanceCriteriaEditorState.checklist,
+);
 const savedAcceptanceCriteria = ref(
     normalizeAcceptanceCriteria(props.ticket.acceptance_criteria),
 );
@@ -131,7 +132,9 @@ const isPersistingAcceptanceCriteriaToggle = ref(false);
 const acceptanceCriteriaToggleError = ref('');
 
 const form = useForm({
-    acceptance_criteria: buildAcceptanceCriteria(acceptanceCriteriaChecklist.value),
+    acceptance_criteria: buildAcceptanceCriteria(
+        acceptanceCriteriaChecklist.value,
+    ),
     assignee_user_id: props.ticket.assignee_user_id ?? '',
     author_user_id: props.ticket.author_user_id ?? '',
     blocked_comment: props.ticket.blocked_comment ?? '',
@@ -157,8 +160,8 @@ const form = useForm({
     story_points: props.ticket.story_points,
 });
 
-const acceptanceCriteriaPreviewItems = computed(() =>
-    savedAcceptanceCriteria.value,
+const acceptanceCriteriaPreviewItems = computed(
+    () => savedAcceptanceCriteria.value,
 );
 
 const hasUnsavedAcceptanceCriteriaDraft = computed(
@@ -318,8 +321,7 @@ watch(
 
                 branchNameValidation.value = {
                     is_valid: false,
-                    message:
-                        `${appName} could not validate this branch name right now.`,
+                    message: `${appName} could not validate this branch name right now.`,
                 };
             } finally {
                 if (!abortController.signal.aborted) {
@@ -361,7 +363,9 @@ const submitBranchCreation = (): void => {
 };
 
 const buildAcceptanceCriteriaForSubmit = () => {
-    const draftItems = buildAcceptanceCriteria(acceptanceCriteriaChecklist.value);
+    const draftItems = buildAcceptanceCriteria(
+        acceptanceCriteriaChecklist.value,
+    );
 
     return draftItems.map((item, index) => ({
         ...item,
@@ -371,7 +375,9 @@ const buildAcceptanceCriteriaForSubmit = () => {
     }));
 };
 
-const buildSavedTicketPayload = (acceptanceCriteria = savedAcceptanceCriteria.value) => ({
+const buildSavedTicketPayload = (
+    acceptanceCriteria = savedAcceptanceCriteria.value,
+) => ({
     acceptance_criteria: acceptanceCriteria,
     assignee_user_id: props.ticket.assignee_user_id,
     author_user_id: props.ticket.author_user_id,
@@ -407,7 +413,9 @@ const persistAcceptanceCriteriaToggle = async (
         index,
         checked,
     );
-    const previousChecklist = formatChecklistLines(savedAcceptanceCriteria.value);
+    const previousChecklist = formatChecklistLines(
+        savedAcceptanceCriteria.value,
+    );
     const nextChecklist = formatChecklistLines(nextAcceptanceCriteria);
     const csrfToken = document
         .querySelector('meta[name="csrf-token"]')
@@ -761,14 +769,18 @@ const formatDateTime = (value: string): string => {
                                         placeholder="[ ] User can sign in
  [x] Validation is shown for invalid credentials"
                                     />
                                     <p class="text-muted-foreground text-xs">
-                                        Use <code>[ ]</code> / <code>[x]</code> for checklist items. Indent with two spaces for nested steps.
-                                        Text changes are saved with the main ticket update.
+                                        Use <code>[ ]</code> /
+                                        <code>[x]</code> for checklist items.
+                                        Indent with two spaces for nested steps.
+                                        Text changes are saved with the main
+                                        ticket update.
                                     </p>
                                     <p
                                         v-if="hasUnsavedAcceptanceCriteriaDraft"
                                         class="text-muted-foreground text-xs"
                                     >
-                                        Save checklist text changes before toggling completion directly.
+                                        Save checklist text changes before
+                                        toggling completion directly.
                                     </p>
                                     <InputError
                                         :message="acceptanceCriteriaError"
@@ -779,7 +791,10 @@ const formatDateTime = (value: string): string => {
                                 </div>
 
                                 <div
-                                    v-if="acceptanceCriteriaPreviewItems.length > 0"
+                                    v-if="
+                                        acceptanceCriteriaPreviewItems.length >
+                                        0
+                                    "
                                     class="border-border rounded-xl border p-4 text-sm"
                                 >
                                     <p class="mb-3 font-medium">
@@ -787,7 +802,9 @@ const formatDateTime = (value: string): string => {
                                     </p>
                                     <ul class="space-y-2">
                                         <li
-                                            v-for="(item, index) in acceptanceCriteriaPreviewItems"
+                                            v-for="(
+                                                item, index
+                                            ) in acceptanceCriteriaPreviewItems"
                                             :key="item.id ?? index"
                                             :style="{
                                                 marginLeft: `${item.indent * 1.25}rem`,
@@ -805,7 +822,12 @@ const formatDateTime = (value: string): string => {
                                                     hasUnsavedAcceptanceCriteriaDraft
                                                 "
                                                 class="border-input text-primary focus:ring-ring mt-0.5 size-4 rounded"
-                                                @change="onAcceptanceCriteriaCheckboxChange(index, $event)"
+                                                @change="
+                                                    onAcceptanceCriteriaCheckboxChange(
+                                                        index,
+                                                        $event,
+                                                    )
+                                                "
                                             />
                                             <label
                                                 :for="`acceptance-criteria-${item.id ?? index}`"
@@ -1530,10 +1552,7 @@ const formatDateTime = (value: string): string => {
                         </CardContent>
                     </Card>
 
-                    <Card
-                        v-if="ticket.ticket_type?.is_parent"
-                        class="h-fit"
-                    >
+                    <Card v-if="ticket.ticket_type?.is_parent" class="h-fit">
                         <CardHeader>
                             <CardTitle>Child tickets</CardTitle>
                             <CardDescription>
@@ -1572,10 +1591,12 @@ const formatDateTime = (value: string): string => {
 
                         <CardContent>
                             <Link
-                                :href="showTicket({
-                                    project: project.id,
-                                    ticket: currentParentTicket.id,
-                                })"
+                                :href="
+                                    showTicket({
+                                        project: project.id,
+                                        ticket: currentParentTicket.id,
+                                    })
+                                "
                                 class="border-border hover:border-primary/60 block rounded-xl border px-4 py-4 transition"
                             >
                                 <div class="font-medium">

resources/js/pages/projects/TicketCreate.vue

@@ -33,7 +33,8 @@ const returnHref =
     props.source === 'board'
         ? boardIndex(props.project.id)
         : backlogIndex(props.project.id);
-const returnLabel = props.source === 'board' ? 'Back to board' : 'Back to backlog';
+const returnLabel =
+    props.source === 'board' ? 'Back to board' : 'Back to backlog';
 
 const breadcrumbs: BreadcrumbItem[] = [
     {
@@ -64,7 +65,9 @@ const hasTicketMetadata =
 const acceptanceCriteriaChecklist = ref('');
 
 const form = useForm({
-    acceptance_criteria: buildAcceptanceCriteria(acceptanceCriteriaChecklist.value),
+    acceptance_criteria: buildAcceptanceCriteria(
+        acceptanceCriteriaChecklist.value,
+    ),
     assignee_user_id: '',
     description: '',
     parent_ticket_id: '',
@@ -92,7 +95,9 @@ const acceptanceCriteriaError = computed(() => {
 });
 
 const submit = (): void => {
-    form.acceptance_criteria = buildAcceptanceCriteria(acceptanceCriteriaChecklist.value);
+    form.acceptance_criteria = buildAcceptanceCriteria(
+        acceptanceCriteriaChecklist.value,
+    );
 
     form.submit(ProjectTicketController.store({ project: props.project.id }), {
         preserveScroll: true,
@@ -173,7 +178,9 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                             <InputError :message="form.errors.title" />
                         </div>
 
-                        <div class="grid gap-6 lg:grid-cols-[minmax(0,1fr)_20rem]">
+                        <div
+                            class="grid gap-6 lg:grid-cols-[minmax(0,1fr)_20rem]"
+                        >
                             <div class="grid gap-6">
                                 <div class="grid gap-2">
                                     <Label for="description">Description</Label>
@@ -185,30 +192,46 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                         class="border-input bg-background shadow-xs focus-visible:border-ring focus-visible:ring-ring/50 rounded-md border px-3 py-2 text-sm outline-none transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-60"
                                         placeholder="Describe the expected behavior and relevant context."
                                     />
-                                    <InputError :message="form.errors.description" />
+                                    <InputError
+                                        :message="form.errors.description"
+                                    />
                                 </div>
 
                                 <div class="grid gap-4">
                                     <div class="grid gap-2">
-                                        <Label for="acceptance_criteria_checklist">
+                                        <Label
+                                            for="acceptance_criteria_checklist"
+                                        >
                                             Acceptance criteria checklist
                                         </Label>
                                         <textarea
                                             id="acceptance_criteria_checklist"
-                                            v-model="acceptanceCriteriaChecklist"
+                                            v-model="
+                                                acceptanceCriteriaChecklist
+                                            "
                                             rows="6"
                                             :disabled="form.processing"
                                             class="border-input bg-background shadow-xs focus-visible:border-ring focus-visible:ring-ring/50 rounded-md border px-3 py-2 text-sm outline-none transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-60"
                                             placeholder="[ ] User can sign in&#10;  [x] Validation is shown for invalid credentials"
                                         />
-                                        <p class="text-muted-foreground text-xs">
-                                            Use <code>[ ]</code> / <code>[x]</code> for checklist items. Indent with two spaces for nested steps.
+                                        <p
+                                            class="text-muted-foreground text-xs"
+                                        >
+                                            Use <code>[ ]</code> /
+                                            <code>[x]</code> for checklist
+                                            items. Indent with two spaces for
+                                            nested steps.
                                         </p>
-                                        <InputError :message="acceptanceCriteriaError" />
+                                        <InputError
+                                            :message="acceptanceCriteriaError"
+                                        />
                                     </div>
 
                                     <div
-                                        v-if="acceptanceCriteriaPreviewItems.length > 0"
+                                        v-if="
+                                            acceptanceCriteriaPreviewItems.length >
+                                            0
+                                        "
                                         class="border-border rounded-xl border p-4 text-sm"
                                     >
                                         <p class="mb-3 font-medium">
@@ -216,14 +239,18 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                         </p>
                                         <ul class="space-y-2">
                                             <li
-                                                v-for="(item, index) in acceptanceCriteriaPreviewItems"
+                                                v-for="(
+                                                    item, index
+                                                ) in acceptanceCriteriaPreviewItems"
                                                 :key="index"
                                                 :style="{
                                                     marginLeft: `${item.indent * 1.25}rem`,
                                                 }"
                                                 class="flex items-start gap-2"
                                             >
-                                                <span class="mt-0.5">{{ item.checked ? '☑' : '☐' }}</span>
+                                                <span class="mt-0.5">{{
+                                                    item.checked ? '☑' : '☐'
+                                                }}</span>
                                                 <span>{{ item.text }}</span>
                                             </li>
                                         </ul>
@@ -248,7 +275,9 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                             {{ ticketType.name }}
                                         </option>
                                     </select>
-                                    <InputError :message="form.errors.ticket_type_id" />
+                                    <InputError
+                                        :message="form.errors.ticket_type_id"
+                                    />
                                 </div>
 
                                 <div class="grid gap-2">
@@ -269,7 +298,11 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                             {{ ticketPriority.name }}
                                         </option>
                                     </select>
-                                    <InputError :message="form.errors.ticket_priority_id" />
+                                    <InputError
+                                        :message="
+                                            form.errors.ticket_priority_id
+                                        "
+                                    />
                                 </div>
 
                                 <div class="grid gap-2">
@@ -285,10 +318,14 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                             :key="ticketStatus.id"
                                             :value="String(ticketStatus.id)"
                                         >
-                                            {{ ticketStatusLabel(ticketStatus) }}
+                                            {{
+                                                ticketStatusLabel(ticketStatus)
+                                            }}
                                         </option>
                                     </select>
-                                    <InputError :message="form.errors.ticket_status_id" />
+                                    <InputError
+                                        :message="form.errors.ticket_status_id"
+                                    />
                                 </div>
 
                                 <div class="grid gap-2">
@@ -310,7 +347,9 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                             {{ user.name }}
                                         </option>
                                     </select>
-                                    <InputError :message="form.errors.assignee_user_id" />
+                                    <InputError
+                                        :message="form.errors.assignee_user_id"
+                                    />
                                 </div>
 
                                 <div class="grid gap-2">
@@ -323,16 +362,24 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                         :disabled="form.processing"
                                         class="border-input bg-background shadow-xs focus-visible:border-ring focus-visible:ring-ring/50 rounded-md border px-3 py-2 text-sm outline-none transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-60"
                                     >
-                                        <option value="">No parent ticket</option>
+                                        <option value="">
+                                            No parent ticket
+                                        </option>
                                         <option
                                             v-for="parentTicketOption in parentTicketOptions"
                                             :key="parentTicketOption.id"
-                                            :value="String(parentTicketOption.id)"
+                                            :value="
+                                                String(parentTicketOption.id)
+                                            "
                                         >
-                                            {{ `${parentTicketOption.ticket_key} - ${parentTicketOption.title}` }}
+                                            {{
+                                                `${parentTicketOption.ticket_key} - ${parentTicketOption.title}`
+                                            }}
                                         </option>
                                     </select>
-                                    <InputError :message="form.errors.parent_ticket_id" />
+                                    <InputError
+                                        :message="form.errors.parent_ticket_id"
+                                    />
                                 </div>
 
                                 <div
@@ -349,7 +396,9 @@ const ticketStatusLabel = (ticketStatus: TicketStatusModel): string => {
                                         step="1"
                                         :disabled="form.processing"
                                     />
-                                    <InputError :message="form.errors.story_points" />
+                                    <InputError
+                                        :message="form.errors.story_points"
+                                    />
                                 </div>
                             </div>
                         </div>