@@ -74,10 +74,10 @@ export default defineConfig({
7474 laravelLocalizer ({
7575 // Watch patterns for language file changes
7676 patterns: [' lang/**' , ' resources/lang/**' ],
77-
77+
7878 // Command to run when files change
7979 command: ' php artisan localizer:generate --all' ,
80-
80+
8181 // Enable debug logging (optional)
8282 debug: false ,
8383 }),
@@ -86,6 +86,7 @@ export default defineConfig({
8686```
8787
8888** What it does:**
89+
8990- Watches for changes in ` lang/** ` and ` resources/lang/** `
9091- Automatically runs ` php artisan localizer:generate --all ` when files change
9192- Triggers HMR to reload your frontend with updated translations
@@ -197,7 +198,7 @@ function GreetingComponent() {
197198 { /* Supports :placeholder format */ }
198199 <p >{ __ (' greeting' , { name: ' John' })} </p >
199200 { /* "Hello :name!" → "Hello John!" */ }
200-
201+
201202 { /* Also supports {placeholder} format */ }
202203 <p >{ __ (' items' , { count: 5 })} </p >
203204 { /* "You have {count} items" → "You have 5 items" */ }
@@ -218,12 +219,12 @@ function ItemCounter({ count }: { count: number }) {
218219 <div >
219220 { /* Define in your translation file: */ }
220221 { /* "apples": "no apples|one apple|many apples" */ }
221-
222+
222223 <p >{ choice (' apples' , count )} </p >
223224 { /* count = 0: "no apples" */ }
224225 { /* count = 1: "one apple" */ }
225226 { /* count = 5: "many apples" */ }
226-
227+
227228 { /* With replacements */ }
228229 <p >{ choice (' apples' , count , { count })} </p >
229230 { /* "You have {count} apples" → "You have 5 apples" */ }
@@ -243,11 +244,7 @@ function ConditionalTranslation() {
243244 return (
244245 <div >
245246 { has (' welcome' ) && <h1 >{ __ (' welcome' )} </h1 >}
246- { has (' custom.message' ) ? (
247- <p >{ __ (' custom.message' )} </p >
248- ) : (
249- <p >Default message</p >
250- )}
247+ { has (' custom.message' ) ? <p >{ __ (' custom.message' )} </p > : <p >Default message</p >}
251248 </div >
252249 );
253250}
@@ -282,7 +279,7 @@ function LocaleInfo() {
282279 <div dir = { dir } >
283280 <p >Current Locale: { locale } </p >
284281 <p >Text Direction: { dir } </p >
285-
282+
286283 <select value = { locale } >
287284 { Object .entries (availableLocales ).map (([code , meta ]) => (
288285 <option key = { code } value = { code } >
@@ -335,30 +332,30 @@ function TranslationDebugger() {
335332
336333Returns an object with the following properties and methods:
337334
338- | Property | Type | Description |
339- | ----------| ------| -------------|
340- | ` __ ` | ` (key: string, replacements?: Replacements, fallback?: string) => string ` | Main translation function |
341- | ` trans ` | ` (key: string, replacements?: Replacements, fallback?: string) => string ` | Alias for ` __() ` |
342- | ` lang ` | ` (key: string, replacements?: Replacements, fallback?: string) => string ` | Alias for ` __() ` |
343- | ` has ` | ` (key: string) => boolean ` | Check if translation key exists |
344- | ` choice ` | ` (key: string, count: number, replacements?: Replacements) => string ` | Pluralization support |
345- | ` locale ` | ` string ` | Current locale code (e.g., 'en') |
346- | ` dir ` | ` 'ltr' \| 'rtl' ` | Text direction |
347- | ` availableLocales ` | ` Record<string, LocaleMeta> ` | Available locales with metadata |
348- | ` translations ` | ` Record<string, string> ` | All translations for current locale |
335+ | Property | Type | Description |
336+ | ------------------ | ------------------------------------------------------------------------- | ----------------------------------- |
337+ | ` __ ` | ` (key: string, replacements?: Replacements, fallback?: string) => string ` | Main translation function |
338+ | ` trans ` | ` (key: string, replacements?: Replacements, fallback?: string) => string ` | Alias for ` __() ` |
339+ | ` lang ` | ` (key: string, replacements?: Replacements, fallback?: string) => string ` | Alias for ` __() ` |
340+ | ` has ` | ` (key: string) => boolean ` | Check if translation key exists |
341+ | ` choice ` | ` (key: string, count: number, replacements?: Replacements) => string ` | Pluralization support |
342+ | ` locale ` | ` string ` | Current locale code (e.g., 'en') |
343+ | ` dir ` | ` 'ltr' \| 'rtl' ` | Text direction |
344+ | ` availableLocales ` | ` Record<string, LocaleMeta> ` | Available locales with metadata |
345+ | ` translations ` | ` Record<string, string> ` | All translations for current locale |
349346
350347### Vite Plugin Options
351348
352349``` typescript
353350interface LocalizerOptions {
354351 // Watch patterns for language file changes
355- patterns? : string []; // default: ['lang/**', 'resources/lang/**']
356-
352+ patterns? : string []; // default: ['lang/**', 'resources/lang/**']
353+
357354 // Command to run when files change
358- command? : string ; // default: 'php artisan localizer:generate --all'
359-
355+ command? : string ; // default: 'php artisan localizer:generate --all'
356+
360357 // Enable debug logging
361- debug? : boolean ; // default: false
358+ debug? : boolean ; // default: false
362359}
363360```
364361
@@ -367,12 +364,12 @@ interface LocalizerOptions {
367364The package is written in TypeScript and provides full type definitions:
368365
369366``` typescript
370- import {
371- useLocalizer ,
367+ import {
368+ useLocalizer ,
372369 UseLocalizerReturn ,
373370 Replacements ,
374371 LocaleData ,
375- PageProps
372+ PageProps ,
376373} from ' @devwizard/laravel-localizer-react' ;
377374
378375// All types are available for import
@@ -438,12 +435,12 @@ function LoginForm() {
438435 <input type = " email" required />
439436 <span className = " error" >{ __ (' validation.required' )} </span >
440437 </div >
441-
438+
442439 <div >
443440 <label >{ __ (' auth.password' )} </label >
444441 <input type = " password" required />
445442 </div >
446-
443+
447444 <button type = " submit" >{ __ (' auth.login' )} </button >
448445 </form >
449446 );
@@ -525,9 +522,7 @@ export default function Dashboard({ auth, stats }: DashboardProps) {
525522 </h1 >
526523
527524 { /* Notification count */ }
528- <p className = " mb-4" >
529- { __ (' notifications' , { count: stats .notifications })}
530- </p >
525+ <p className = " mb-4" >{ __ (' notifications' , { count: stats .notifications })} </p >
531526
532527 { /* Statistics with pluralization */ }
533528 <div className = " grid grid-cols-2 gap-4" >
0 commit comments