React Features library with internationalization support (Paraglide JS) - Full version with all features
npm install @milord_frontend/features-export-fullReact Features library - полная версия со всеми фичами для публикации в npm.
``bash`
npm install @milord_frontend/features-export-full
Peer Dependencies:
`bash`
npm install react react-dom
`tsx
import { HelloWorld } from "@milord_frontend/features-export-full";
function App() {
return (
showButton={true}
onGreet={(greeting) => console.log(greeting)}
/>
);
}
`
`tsx
import {
HelloWorld,
setLocale,
getLocale,
type Locale
} from "@milord_frontend/features-export-full";
function App() {
// Установить язык
setLocale('en', { reload: false });
// Получить текущий язык
const currentLang = getLocale(); // 'ru' | 'en' | 'de' | 'es'
return
}
`
`tsx
import * as m from "@milord_frontend/features-export-full/paraglide/messages";
console.log(m.hello_world_title()); // "👋 Hello World Feature"
console.log(m.welcome_message({ name: 'John' })); // "Welcome, John!"
`
- 🇷🇺 ru - Русский (по умолчанию)
- 🇬🇧 en - English
- 🇩🇪 de - Deutsch
- 🇪🇸 es - Español
`typescript
// Получить текущий язык
getLocale(): Locale // 'ru' | 'en' | 'de' | 'es'
// Установить язык
setLocale(locale: Locale, options?: { reload?: boolean }): void
// Пример
setLocale('en', { reload: false });
`
`typescript`
hello_world_title(): string
welcome_message({ name }: { name: string }): string
feature_description(): string
greet_button(): string
greeting_alert({ name }: { name: string }): string
Демонстрационная фича приветствия с использованием UI компонентов и поддержкой интернационализации.
Props:
- name?: string - Имя для приветствия (по умолчанию "World")showButton?: boolean
- - Показывать ли кнопку (по умолчанию true)onGreet?: (greeting: string) => void
- - Callback при клике на кнопкуicon?: IconName
- - Опциональная иконка в заголовке
Пример:
`tsx`
Компонент автоматически использует переводы из Paraglide. При смене языка через setLocale() все тексты обновляются автоматически.
Эта библиотека не включает CSS. Используйте UI компоненты из:
- @milord_frontend/ui-export-full - для стилизации
| Файл | Размер |
| ---- | ------- |
| ESM | ~3 KB |
| CJS | ~2.5 KB |
Полная поддержка TypeScript из коробки.
`tsx
import type { HelloWorldProps } from "@milord_frontend/features-export-full";
const props: HelloWorldProps = {
name: "TypeScript",
showButton: true,
};
`
Этот пакет генерируется из @repo/features в монорепе.
Сборка:
`bash`
npm run build
Генерация типов:
`bash`
npm run generate:types
Публикация:
`bash`
npm publish
Подробная документация доступна в монорепе:
- packages/features/README.md - основной пакетpackages/ARCHITECTURE_SUMMARY.md
- - архитектура
- @repo/features - Основной пакет для разработки@milord_frontend/ui-export-full` - UI компоненты
-
MIT