\n\n# Orcestr UI\n\n[](https://www.npmjs.com/package/@orcestr/ui)\n[](./LICENSE)\n\n## [Live Demo](https://orcestr.com/ui)\n\nДоступные React-компоненты и стили для интерфейсов приложений.\n\nВ пакете есть layout primitives, контролы, поля, overlays, data views, workflow-состояния, theme tokens и utility hooks.\n\nОсновной сайт: [orcestr.com](https://orcestr.com)\n\n## Статус\n\n| Пункт | Значение |\n| ------- | ------------------------------------------ |\n| Package | `@orcestr/ui` |\n| Version | актуальная версия указана в npm badge выше |\n| Status | Beta |\n| Runtime | React 19 |\n| Styling | CSS из `@orcestr/ui/styles.css` |\n\nPublic API еще формируется, пока пакет находится в beta.\n\n## Что внутри\n\n| Зона | Что входит |\n| ---------- | ------------------------------------------------------------------------------ |\n| App layout | shell, навигационные паттерны, page surfaces |\n| Actions | buttons, icon buttons, text links, menus, command surfaces |\n| Inputs | fields, selects, comboboxes, pickers, switches, checkboxes, segmented controls |\n| Overlays | dialogs, drawers, modals, popovers, tooltips, context menus, confirm flows |\n| Data views | tables, pagination, empty/error/loading states, badges, alerts |\n| Workflows | lifecycle и status components для операционных экранов |\n| Foundation | provider, locale, theme tokens, CSS variables, utility hooks |\n\n## Установка\n\n```bash\nnpm install @orcestr/ui react react-dom react-icons\n```\n\nTanStack Query нужен только при использовании `@orcestr/ui/react-query`:\n\n```bash\nnpm install @tanstack/react-query\n```\n\nДля проверки неопубликованной сборки в другом приложении запусти `npm pack` и\nустанови созданный архив. В публикуемых manifest- и lock-файлах должны оставаться\nregistry-версии.\n\n## Использование\n\nПодключи CSS один раз рядом с корнем приложения и оберни приложение в `OrcestrUiProvider`.\n\n```tsx\nimport { Button, Link, OrcestrUiProvider } from '@orcestr/ui';\nimport '@orcestr/ui/styles.css';\n\nexport function App() {\n return (\n \n \n Аккаунт\n \n );\n}\n```\n\nReact Query integration опциональная:\n\n```ts\nimport { usePaginatedComboboxQueryLoader } from '@orcestr/ui/react-query';\n```\n\nВ Server Components можно импортировать render-only primitives без client boundary:\n\n```tsx\nimport { Box, Flex, Table, Text } from '@orcestr/ui/server';\n```\n\nDemo page экспортируется отдельно:\n\n```tsx\nimport { UiExamplePage } from '@orcestr/ui/example/UiExamplePage';\nimport '@orcestr/ui/example/styles.css';\n```\n\nНастройка provider, тем приложения, overlays, controlled state и границ между\nclient/server описана в [руководстве для потребителей](./docs/CONSUMER_GUIDE.ru.md).\n\n## Entrypoints\n\n| Entrypoint | Назначение |\n| ----------------------------------- | ----------------------------------------------- |\n| `@orcestr/ui` | Client components, providers, hooks и theme API |\n| `@orcestr/ui/server` | Server-safe render-only primitives |\n| `@orcestr/ui/styles.css` | Runtime styles UI kit |\n| `@orcestr/ui/react-query` | Optional React Query adapter |\n| `@orcestr/ui/example/UiExamplePage` | Demo page component |\n| `@orcestr/ui/example/styles.css` | Demo page styles |\n\n## Скрипты\n\n```bash\nnpm run build\nnpm run typecheck\nnpm test\nnpm run check:package\nnpm run pack:dry-run\n```\n\n| Script | Что проверяет |\n| ----------------------- | -------------------------------------------------- |\n| `npm run build` | TypeScript output, declarations, CSS и ESM imports |\n| `npm run typecheck` | TypeScript без emit |\n| `npm test` | Contract и state tests |\n| `npm run check:package` | Публичные Node ESM entrypoints |\n| `npm run pack:dry-run` | Состав публикуемого пакета |\n\n## Release\n\nПубликация в NPM идет через GitHub Actions по тегам `ui-v*`.\n\nЛокальные helpers:\n\n```bash\nnpm run release:patch\nnpm run release:minor\nnpm run release:major\n```\n\nКаждый helper обновляет `package.json` и `package-lock.json`, создает release commit и tag вроде `ui-v0.3.1`.\n\n```bash\ngit push\ngit push origin ui-v0.3.1\n```\n\nWorkflow перед публикацией запускает typecheck, tests, build и `npm pack --dry-run`.\n\nПолная инструкция: [docs/RELEASE.md](./docs/RELEASE.md).\n\n## Maintainer\n\nПубличные обновления ведет [@Artasov](https://github.com/Artasov).\n\n## Лицензия\n\nПроект распространяется по [Mozilla Public License 2.0](./LICENSE). Коммерческое использование\nразрешено; изменения файлов под MPL остаются на условиях MPL. Авторство указано в\n[NOTICE](./NOTICE), правила использования бренда — в [TRADEMARKS.md](./TRADEMARKS.md).\n","readmeFilename":"README.ru.md"}
![\"Баннер](\"./assets/orcestr-banner.webp\")
\n \n