@devstroupe/devkit-cli 1.0.0

package/dist/templates/ui/shared/profile-component.template.js

@@ -0,0 +1,403 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.devkitProfileComponentTemplate = devkitProfileComponentTemplate;
+function devkitProfileComponentTemplate() {
+    return {
+        ts: `import { Component, OnInit, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import { Router } from '@angular/router';
+import { NgIconComponent } from '@ng-icons/core';
+import { HlmButton } from '@spartan-ng/helm/button';
+import { HlmInput } from '@spartan-ng/helm/input';
+import { AuthService } from '../../../core/services/auth.service';
+import { ProfileService } from '../../../core/services/profile.service';
+
+@Component({
+  selector: 'app-profile',
+  standalone: true,
+  imports: [CommonModule, ReactiveFormsModule, NgIconComponent, HlmButton, HlmInput],
+  templateUrl: './profile.component.html',
+  styleUrl: './profile.component.css'
+})
+export class ProfileComponent implements OnInit {
+  private fb = inject(FormBuilder);
+  private authService = inject(AuthService);
+  private profileService = inject(ProfileService);
+  private router = inject(Router);
+
+  profileForm!: FormGroup;
+  isLoading = false;
+  isSaving = false;
+  successMessage = '';
+  errorMessage = '';
+  avatarPreview = '';
+
+  currentUser$ = this.authService.currentUser$;
+
+  ngOnInit(): void {
+    const user = this.authService.currentUser;
+    this.profileForm = this.fb.group({
+      name: [user?.name || '', [Validators.required, Validators.minLength(2)]],
+      email: [user?.email || '', [Validators.required, Validators.email]],
+      avatar: [user?.avatar || '']
+    });
+    this.avatarPreview = user?.avatar || '';
+  }
+
+  onAvatarChange(): void {
+    const url = this.profileForm.get('avatar')?.value;
+    this.avatarPreview = url || '';
+  }
+
+  onSave(): void {
+    if (this.profileForm.invalid) {
+      this.profileForm.markAllAsTouched();
+      return;
+    }
+
+    this.isSaving = true;
+    this.successMessage = '';
+    this.errorMessage = '';
+
+    const data = this.profileForm.value;
+
+    this.profileService.updateProfile(data).subscribe({
+      next: () => {
+        this.isSaving = false;
+        this.successMessage = 'Perfil atualizado com sucesso!';
+        setTimeout(() => (this.successMessage = ''), 4000);
+      },
+      error: (err) => {
+        this.isSaving = false;
+        this.errorMessage = err?.error?.message || 'Erro ao salvar o perfil. Tente novamente.';
+      }
+    });
+  }
+
+  onCancel(): void {
+    this.router.navigate(['/dashboard']);
+  }
+
+  get nameControl() { return this.profileForm.get('name'); }
+  get emailControl() { return this.profileForm.get('email'); }
+}
+`,
+        html: `<div class="dt-profile-page">
+  <div class="dt-profile-container">
+
+    <!-- Header da Página -->
+    <div class="dt-profile-header">
+      <button hlmBtn variant="ghost" size="icon" (click)="onCancel()" class="dt-profile-back" title="Voltar">
+        <ng-icon name="lucideArrowLeft" class="size-5"></ng-icon>
+      </button>
+      <div>
+        <h1 class="dt-profile-title">Editar Perfil</h1>
+        <p class="dt-profile-subtitle">Atualize suas informações pessoais</p>
+      </div>
+    </div>
+
+    <div class="dt-profile-content" *ngIf="currentUser$ | async as user">
+
+      <!-- Card do Avatar -->
+      <div class="dt-profile-avatar-card">
+        <div class="dt-profile-avatar-wrapper">
+          <img
+            *ngIf="avatarPreview; else avatarInitials"
+            [src]="avatarPreview"
+            [alt]="user.name"
+            class="dt-profile-avatar-img"
+            (error)="avatarPreview = ''"
+          />
+          <ng-template #avatarInitials>
+            <div class="dt-profile-avatar-initials">
+              {{ user.name.slice(0, 2).toUpperCase() }}
+            </div>
+          </ng-template>
+        </div>
+        <div class="dt-profile-avatar-info">
+          <p class="dt-profile-avatar-name">{{ user.name }}</p>
+          <p class="dt-profile-avatar-role" *ngIf="user.role">{{ user.role }}</p>
+        </div>
+      </div>
+
+      <!-- Formulário -->
+      <form [formGroup]="profileForm" (ngSubmit)="onSave()" class="dt-profile-form" novalidate>
+
+        <!-- Campo: Nome -->
+        <div class="dt-profile-field">
+          <label class="dt-profile-label" for="profile-name">
+            <ng-icon name="lucideUser" class="size-4"></ng-icon>
+            Nome Completo
+          </label>
+          <input
+            hlmInput
+            id="profile-name"
+            type="text"
+            formControlName="name"
+            placeholder="Seu nome completo"
+            class="dt-profile-input"
+            [class.dt-profile-input--error]="nameControl?.invalid && nameControl?.touched"
+          />
+          <span *ngIf="nameControl?.invalid && nameControl?.touched" class="dt-profile-error">
+            {{ nameControl?.errors?.['required'] ? 'Nome é obrigatório.' : 'Nome deve ter no mínimo 2 caracteres.' }}
+          </span>
+        </div>
+
+        <!-- Campo: E-mail -->
+        <div class="dt-profile-field">
+          <label class="dt-profile-label" for="profile-email">
+            <ng-icon name="lucideMail" class="size-4"></ng-icon>
+            E-mail
+          </label>
+          <input
+            hlmInput
+            id="profile-email"
+            type="email"
+            formControlName="email"
+            placeholder="seu@email.com"
+            class="dt-profile-input"
+            [class.dt-profile-input--error]="emailControl?.invalid && emailControl?.touched"
+          />
+          <span *ngIf="emailControl?.invalid && emailControl?.touched" class="dt-profile-error">
+            {{ emailControl?.errors?.['required'] ? 'E-mail é obrigatório.' : 'Informe um e-mail válido.' }}
+          </span>
+        </div>
+
+        <!-- Campo: Avatar URL -->
+        <div class="dt-profile-field">
+          <label class="dt-profile-label" for="profile-avatar">
+            <ng-icon name="lucideImage" class="size-4"></ng-icon>
+            URL do Avatar (opcional)
+          </label>
+          <input
+            hlmInput
+            id="profile-avatar"
+            type="url"
+            formControlName="avatar"
+            placeholder="https://exemplo.com/sua-foto.jpg"
+            class="dt-profile-input"
+            (input)="onAvatarChange()"
+          />
+          <span class="dt-profile-hint">Cole a URL de uma imagem para usar como foto de perfil.</span>
+        </div>
+
+        <!-- Feedbacks -->
+        <div *ngIf="successMessage" class="dt-profile-alert dt-profile-alert--success">
+          <ng-icon name="lucideCircleCheck" class="size-4"></ng-icon>
+          {{ successMessage }}
+        </div>
+
+        <div *ngIf="errorMessage" class="dt-profile-alert dt-profile-alert--error">
+          <ng-icon name="lucideCircleAlert" class="size-4"></ng-icon>
+          {{ errorMessage }}
+        </div>
+
+        <!-- Ações -->
+        <div class="dt-profile-actions">
+          <button hlmBtn type="button" variant="outline" (click)="onCancel()" [disabled]="isSaving">
+            Cancelar
+          </button>
+          <button hlmBtn type="submit" variant="default" [disabled]="isSaving || profileForm.invalid">
+            <ng-icon *ngIf="isSaving" name="lucideLoader" class="size-4 mr-2 dt-spin"></ng-icon>
+            {{ isSaving ? 'Salvando...' : 'Salvar Alterações' }}
+          </button>
+        </div>
+
+      </form>
+    </div>
+
+  </div>
+</div>
+`,
+        css: `.dt-profile-page {
+  min-height: 100%;
+  padding: 32px 16px;
+  background-color: var(--background);
+  font-family: var(--font-family);
+}
+
+.dt-profile-container {
+  max-width: 640px;
+  margin: 0 auto;
+  display: flex;
+  flex-direction: column;
+  gap: 28px;
+}
+
+/* Header */
+.dt-profile-header {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+}
+
+.dt-profile-back {
+  flex-shrink: 0;
+}
+
+.dt-profile-title {
+  font-size: 22px;
+  font-weight: 700;
+  color: var(--foreground);
+  margin: 0;
+}
+
+.dt-profile-subtitle {
+  font-size: 13px;
+  color: var(--muted-foreground);
+  margin: 2px 0 0;
+}
+
+/* Card Avatar */
+.dt-profile-avatar-card {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  padding: 24px;
+  background-color: var(--card);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+}
+
+.dt-profile-avatar-wrapper {
+  flex-shrink: 0;
+}
+
+.dt-profile-avatar-img {
+  width: 80px;
+  height: 80px;
+  border-radius: 50%;
+  object-fit: cover;
+  border: 3px solid var(--border);
+}
+
+.dt-profile-avatar-initials {
+  width: 80px;
+  height: 80px;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 24px;
+  font-weight: 700;
+  background-color: var(--primary);
+  color: var(--primary-foreground);
+  border: 3px solid color-mix(in srgb, var(--primary) 30%, transparent);
+}
+
+.dt-profile-avatar-name {
+  font-size: 18px;
+  font-weight: 600;
+  color: var(--foreground);
+  margin: 0;
+}
+
+.dt-profile-avatar-role {
+  font-size: 13px;
+  color: var(--muted-foreground);
+  margin: 4px 0 0;
+}
+
+/* Formulário */
+.dt-profile-form {
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  padding: 24px;
+  background-color: var(--card);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+}
+
+.dt-profile-field {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.dt-profile-label {
+  font-size: 13px;
+  font-weight: 600;
+  color: var(--foreground);
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.dt-profile-input {
+  width: 100%;
+}
+
+.dt-profile-input--error {
+  border-color: var(--destructive) !important;
+}
+
+.dt-profile-error {
+  font-size: 12px;
+  color: var(--destructive);
+}
+
+.dt-profile-hint {
+  font-size: 12px;
+  color: var(--muted-foreground);
+}
+
+/* Feedbacks */
+.dt-profile-alert {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px 16px;
+  border-radius: var(--radius);
+  font-size: 13px;
+  font-weight: 500;
+}
+
+.dt-profile-alert--success {
+  background-color: color-mix(in srgb, var(--primary) 10%, transparent);
+  color: var(--primary);
+  border: 1px solid color-mix(in srgb, var(--primary) 30%, transparent);
+}
+
+.dt-profile-alert--error {
+  background-color: color-mix(in srgb, var(--destructive) 10%, transparent);
+  color: var(--destructive);
+  border: 1px solid color-mix(in srgb, var(--destructive) 30%, transparent);
+}
+
+/* Ações */
+.dt-profile-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 12px;
+  padding-top: 8px;
+  border-top: 1px solid var(--border);
+}
+
+/* Spinner */
+@keyframes dt-spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.dt-spin {
+  animation: dt-spin 1s linear infinite;
+}
+
+@media (max-width: 640px) {
+  .dt-profile-page {
+    padding: 16px 12px;
+  }
+
+  .dt-profile-actions {
+    flex-direction: column-reverse;
+  }
+
+  .dt-profile-actions button {
+    width: 100%;
+  }
+}
+`
+    };
+}

package/dist/templates/ui/shared/profile-service.template.d.ts

@@ -0,0 +1 @@
+export declare function devkitProfileServiceTemplate(): string;

package/dist/templates/ui/shared/profile-service.template.js

@@ -0,0 +1,44 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.devkitProfileServiceTemplate = devkitProfileServiceTemplate;
+function devkitProfileServiceTemplate() {
+    return `import { Injectable, inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+import { Observable, tap } from 'rxjs';
+import { AuthService } from './auth.service';
+
+export interface UpdateProfileDto {
+  name?: string;
+  email?: string;
+  avatar?: string;
+}
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ProfileService {
+  private http = inject(HttpClient);
+  private authService = inject(AuthService);
+  private apiUrl = '/api/auth/profile';
+
+  updateProfile(data: UpdateProfileDto): Observable<any> {
+    return this.http.patch<any>(this.apiUrl, data).pipe(
+      tap((updatedUser) => {
+        const current = this.authService.currentUser;
+        if (current) {
+          const merged = { ...current, ...updatedUser };
+          localStorage.setItem('user', JSON.stringify(merged));
+          this.authService.setCurrentUser(merged);
+        }
+      })
+    );
+  }
+
+  uploadAvatar(file: File): Observable<{ url: string }> {
+    const formData = new FormData();
+    formData.append('file', file);
+    return this.http.post<{ url: string }>(\`\${this.apiUrl}/avatar\`, formData);
+  }
+}
+`;
+}

package/dist/templates/ui/shared/theme-service.template.d.ts

@@ -0,0 +1 @@
+export declare function devkitThemeServiceTemplate(): string;

package/dist/templates/ui/shared/theme-service.template.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.devkitThemeServiceTemplate = devkitThemeServiceTemplate;
+function devkitThemeServiceTemplate() {
+    return `import { Injectable } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+
+const THEME_KEY = 'devkit-theme';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ThemeService {
+  private isDarkSubject = new BehaviorSubject<boolean>(false);
+  isDark$ = this.isDarkSubject.asObservable();
+
+  get isDark(): boolean {
+    return this.isDarkSubject.getValue();
+  }
+
+  constructor() {
+    this.loadTheme();
+  }
+
+  toggle(): void {
+    this.setDark(!this.isDark);
+  }
+
+  setDark(dark: boolean): void {
+    this.isDarkSubject.next(dark);
+    localStorage.setItem(THEME_KEY, dark ? 'dark' : 'light');
+    if (dark) {
+      document.documentElement.classList.add('dark');
+    } else {
+      document.documentElement.classList.remove('dark');
+    }
+  }
+
+  private loadTheme(): void {
+    const saved = localStorage.getItem(THEME_KEY);
+    const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
+    const dark = saved ? saved === 'dark' : prefersDark;
+    this.setDark(dark);
+  }
+}
+`;
+}

package/dist/templates/ui/spartan/badge-directive.template.d.ts

@@ -0,0 +1,3 @@
+export declare function devkitHlmBadgeDirectiveTemplate(): {
+    ts: string;
+};

package/dist/templates/ui/spartan/badge-directive.template.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.devkitHlmBadgeDirectiveTemplate = devkitHlmBadgeDirectiveTemplate;
+function devkitHlmBadgeDirectiveTemplate() {
+    return {
+        ts: `import { Directive, input } from '@angular/core';
+import { classes } from '@spartan-ng/helm/utils';
+import { type VariantProps, cva } from 'class-variance-authority';
+
+const badgeVariants = cva(
+  'h-5 gap-1 rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium transition-all has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&>ng-icon]:text-[length:--spacing(3)] group/badge focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 inline-flex w-fit shrink-0 items-center justify-center overflow-hidden whitespace-nowrap focus-visible:ring-[3px] [&>ng-icon]:pointer-events-none',
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
+        secondary: 'bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80',
+        destructive:
+          'bg-destructive/10 [a]:hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 text-destructive dark:bg-destructive/20',
+        outline: 'border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground',
+        ghost: 'hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+    },
+  },
+);
+
+export type BadgeVariants = VariantProps<typeof badgeVariants>;
+
+@Directive({
+  selector: '[hlmBadge],hlm-badge',
+  host: {
+    'data-slot': 'badge',
+    '[attr.data-variant]': 'variant()',
+  },
+  standalone: true,
+})
+export class HlmBadge {
+  public readonly variant = input<BadgeVariants['variant']>('default');
+
+  constructor() {
+    classes(() => badgeVariants({ variant: this.variant() }));
+  }
+}
+`
+    };
+}
+// 19. Template do devkit-badge (adaptado para importar HlmBadge oficial)

package/dist/templates/ui/spartan/button-directive.template.d.ts

@@ -0,0 +1,3 @@
+export declare function devkitHlmButtonDirectiveTemplate(): {
+    ts: string;
+};

package/dist/templates/ui/spartan/button-directive.template.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.devkitHlmButtonDirectiveTemplate = devkitHlmButtonDirectiveTemplate;
+function devkitHlmButtonDirectiveTemplate() {
+    return {
+        ts: `import { Directive, input, signal } from '@angular/core';
+import { BrnButton } from '@spartan-ng/brain/button';
+import { classes } from '@spartan-ng/helm/utils';
+import { cva, type VariantProps } from 'class-variance-authority';
+import type { ClassValue } from 'clsx';
+import { injectBrnButtonConfig } from './hlm-button.token';
+
+export const buttonVariants = cva(
+  "focus-visible:border-ring focus-visible:ring-ring/50 data-[matches-spartan-invalid=true]:ring-destructive/20 dark:data-[matches-spartan-invalid=true]:ring-destructive/40 data-[matches-spartan-invalid=true]:border-destructive dark:data-[matches-spartan-invalid=true]:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 active:not-aria-[haspopup]:translate-y-px data-[matches-spartan-invalid=true]:ring-3 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)] group/button inline-flex shrink-0 items-center justify-center whitespace-nowrap transition-all outline-none select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_ng-icon]:pointer-events-none [&_ng-icon]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
+        outline:
+          'border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+        secondary:
+          'bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
+        ghost:
+          'hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground',
+        destructive:
+          'bg-destructive/10 hover:bg-destructive/20 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/20 text-destructive focus-visible:border-destructive/40 dark:hover:bg-destructive/30',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+      size: {
+        default:
+          'h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pe-2 has-data-[icon=inline-start]:ps-2',
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)]",
+        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3.5)]",
+        lg: 'h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pe-3 has-data-[icon=inline-start]:ps-3',
+        icon: 'size-8',
+        'icon-xs':
+          "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)]",
+        'icon-sm':
+          'size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg',
+        'icon-lg': 'size-9',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  },
+);
+
+export type ButtonVariants = VariantProps<typeof buttonVariants>;
+
+@Directive({
+  selector: 'button[hlmBtn], a[hlmBtn]',
+  exportAs: 'hlmBtn',
+  hostDirectives: [{ directive: BrnButton, inputs: ['disabled'] }],
+  host: { 'data-slot': 'button' },
+  standalone: true,
+})
+export class HlmButton {
+  private readonly _config = injectBrnButtonConfig();
+
+  private readonly _additionalClasses = signal<ClassValue>('');
+
+  public readonly variant = input<ButtonVariants['variant']>(this._config.variant);
+
+  public readonly size = input<ButtonVariants['size']>(this._config.size);
+
+  constructor() {
+    classes(() => [
+      buttonVariants({ variant: this.variant(), size: this.size() }),
+      this._additionalClasses(),
+    ]);
+  }
+
+  setClass(classes: string): void {
+    this._additionalClasses.set(classes);
+  }
+}
+`
+    };
+}
+// Template do hlm-button.token.ts oficial

package/dist/templates/ui/spartan/button-token.template.d.ts

@@ -0,0 +1,3 @@
+export declare function devkitHlmButtonTokenTemplate(): {
+    ts: string;
+};

package/dist/templates/ui/spartan/button-token.template.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.devkitHlmButtonTokenTemplate = devkitHlmButtonTokenTemplate;
+function devkitHlmButtonTokenTemplate() {
+    return {
+        ts: `import { InjectionToken, type ValueProvider, inject } from '@angular/core';
+import type { ButtonVariants } from './hlm-button';
+
+export interface BrnButtonConfig {
+  variant: ButtonVariants['variant'];
+  size: ButtonVariants['size'];
+}
+
+const defaultConfig: BrnButtonConfig = {
+  variant: 'default',
+  size: 'default',
+};
+
+const BrnButtonConfigToken = new InjectionToken<BrnButtonConfig>('BrnButtonConfig');
+
+export function provideBrnButtonConfig(config: Partial<BrnButtonConfig>): ValueProvider {
+  return { provide: BrnButtonConfigToken, useValue: { ...defaultConfig, ...config } };
+}
+
+export function injectBrnButtonConfig(): BrnButtonConfig {
+  return inject(BrnButtonConfigToken, { optional: true }) ?? defaultConfig;
+}
+`
+    };
+}
+// 17. Template da diretiva hlmInput do Spartan local (hlm-input.ts oficial)

package/dist/templates/ui/spartan/hlm-core.template.d.ts

@@ -0,0 +1,3 @@
+export declare function devkitHlmCoreTemplate(): {
+    ts: string;
+};