sprof 0.2.4 → 0.2.7

package/README.md

@@ -1,29 +1,181 @@
-# services front
+# sprof — UI Kit & Platform Library (PF)
 
-<!-- ## Project setup
+Библиотека UI-компонентов и платформенного ядра для проектов на **Vue 3 + Quasar 2**.
+Используется в rdkb (map/hr/food/leiter), portal и pros.
 
+- **P-компоненты** — обёртки над Quasar (полный проброс props/slots/events)
+- **PF / PFM** — платформенное ядро: helpers, store (BaseStore), FTSP, UI (Notify/Dialog), auth,
+  модули (Buildings, Docs, Forms, Pages, Settings, Chats, Extracts, Menus)
+- **installSprof** — регистрация всех P-компонентов + Quasar-плагинов одной строкой
+
+---
+
+## 📦 Установка
+
+```bash
+npm install sprof
 ```
-npm install
+
+### Требования (peer dependencies)
+
+| Пакет | Версия | Обязателен |
+| --- | --- | --- |
+| `vue` | ^3.4 | да |
+| `quasar` | ^2.21 | да |
+| `axios` | ^1.6 | нет (auth) |
+| `vue-router` | ^4.3 | нет |
+
+Приложение должно использовать **Quasar 2** — P-компоненты рендерят Q-компоненты напрямую
+(импортируют их из `quasar`), поэтому Quasar CSS уже должен быть подключён.
+
+## 🚀 Подключение
+
+```ts
+// main.ts (или boot-файл Quasar)
+import { createApp } from 'vue';
+import { installSprof } from 'sprof';
+
+const app = createApp(App);
+installSprof(app); // Quasar-плагины Notify+Dialog + все P-компоненты
+app.mount('#app');
 ```
 
-### Compiles and hot-reloads for development
+Если Quasar уже настроен (Quasar CLI):
+
+```ts
+import { installSprof } from 'sprof';
 
+export default boot(({ app }) => {
+  installSprof(app, { quasarPlugins: false }); // плагины уже есть в quasar.config.ts
+});
 ```
-npm run serve
+
+### Типы глобальных P-компонентов
+
+Декларация генерируется из реестров (`scripts/gen-global-components.mjs`) и поставляется
+в пакете. В проекте достаточно одного файла:
+
+```ts
+// src/types/sprof-components.d.ts
+import type {} from 'sprof';
+export {};
 ```
 
-### Compiles and minifies for production
+Ничего вручную дописывать не нужно — все 69 P-компонентов (атомы, молекулы, организмы)
+типизируются в шаблонах автоматически.
+
+---
+
+## 🧱 P-компоненты (обёртки над Quasar)
+
+Общий принцип: **весь API Quasar работает как есть** — props/events передаются насквозь,
+слоты пробрасываются, `:disable`/`color`/`size` и др. имеют приоритет над P-пропсами.
+
+### Атомы (24)
+
+| Компонент | Обёртка над | Особенности |
+| --- | --- | --- |
+| `PButton` | QBtn | нативный click, `type=submit/reset`, attrs-приоритет, legacy `skin` |
+| `PInput` | QInput | все слоты, `v-model` string/number/null, `rules`, `width` |
+| `PSelect` | QSelect | все слоты, модель `any` |
+| `PCheckBox` | QCheckbox | v-model boolean |
+| `PToggle` | QToggle | v-model boolean, label, size |
+| `PDialog` | QDialog | v-model boolean, persistent/maximized, слоты title/header/body/footer |
+| `PChip` | QChip | label/color/outline/removable, слоты avatar/remove |
+| `PBadge` | QBadge | label/color/outline/rounded/floating/multiLine |
+| `PRadio` | QRadio | v-model, label, size |
+| `PInputNumber` | QInput + QBtn | step/min/max, кнопки +/− |
+| `PDatePicker` | QInput | дата (legacy, см. PInputDate) |
+| `PInputDate` | QInput | дата |
+| `PTextarea` | QInput | resize, mask |
+| `PTooltip` | QTooltip | timeout, позиционирование, typeStyle |
+| `PString` | QItemLabel | текст с цветом/размером, isHtml |
+| `PLabelField` | QItemLabel | подпись с отступами |
+| `PFlex` | div | flex-контейнер |
+| `PList` / `PListItem` | QList / QItem | списки |
+| `PLeftSlider` / `PRightSlider` / `PTopSlider` | QBtn | выдвижные панели |
+| `PSticky` | div | sticky-обёртка |
+| `PTable` | table (HTML) | простая таблица со слотами |
+
+### Молекулы/организмы (основные)
 
+`PAdd`, `PDel`, `PModal`, `PContainer`, `PContainerStickyHead`, `PTabs`, `PUploaderFile`,
+`PUploaderImage`, `PAuthForm`, `PAuthModal`, `PNameEdit`, `PNotify`, `PLoader`, `PPagination`,
+`PAutocomplete`, `PhoneForm`, `DateInputRange`, `FilterSelect`, `SortList`, `ThemeWrapper`
+и др. — полный список в реестрах `src/core/components/*/index.ts`.
+
+---
+
+## 🏛 PF — платформенное ядро
+
+| Объект | Описание |
+| --- | --- |
+| `PF` | helpers, store (BaseStore), FTSP, UI (Notify/Dialog), auth, types |
+| `PFM` | модули: Buildings, Docs, Forms, Pages, Settings, Chats, Extracts, Menus |
+
+```ts
+import { PF, PFM } from 'sprof';
 ```
-npm run build
+
+---
+
+## 🔄 Миграция q-* → P-*
+
+Зачем: единые обёртки (проброс всего API Quasar) + платформенные типы + точка расширения.
+
+| Было | Стало | Примечание |
+| --- | --- | --- |
+| `<q-btn ...>` | `<PButton ...>` | attrs совместимы; `@click` нативный |
+| `<q-input ...>` | `<PInput ...>` | все слоты/события работают |
+| `<q-select ...>` | `<PSelect ...>` | модель any |
+| `<q-checkbox ...>` | `<PCheckBox ...>` | |
+| `<q-toggle ...>` | `<PToggle ...>` | |
+| `<q-dialog ...>` | `<PDialog ...>` | |
+| `<q-chip ...>` | `<PChip ...>` | |
+| `<q-badge ...>` | `<PBadge ...>` | |
+
+`q-icon` и низкоуровневые q-компоненты (q-card/q-item/q-td и т.п.) можно не переводить.
+
+⚠️ **Важно (баг 0.2.3/0.2.4)**: P-компоненты обязаны импортировать Q-компоненты из `quasar`
+явно — без этого в клиентах с auto-import Quasar элементы «пропадают» (Vue рендерит пустые
+`<pbutton>`/`<qbtn>`). Защита: тесты `src/core/components/atoms/__consumer__/` и
+`npm run check:dist`.
+
+---
+
+## 🧪 Разработка
+
+```bash
+npm run test        # vitest (234 теста, 35 файлов)
+npm run lint        # eslint src --fix
+npm run lint:check  # eslint src (без мутаций, для CI)
+npm run build       # сборка dist (ESM + UMD + d.ts)
+npm run check:dist  # проверка бандла: нет resolveComponent("Q…")
+npm run storybook   # Storybook (документация компонентов)
 ```
 
-### Lints and fixes files
+### Публикация
 
+```bash
+./publish.sh              # bump patch + тесты + сборка + npm publish (2FA) + git tag
+# или вручную: npm run test && npm run build && npm run check:dist && npm publish
 ```
-npm run lint
+
+Либо GitHub Actions `publish.yml` (workflow_dispatch, OTP-инпут).
+
+После публикации обновить клиентов: `npm i sprof@<версия> --save` в каждом клиенте
+(rdkb ×4, portal, pros), `quasar build` ×6, `make deploy` ×3.
+
+### Генерация типов GlobalComponents
+
+```bash
+node scripts/gen-global-components.mjs   # после добавления/удаления P-компонентов
 ```
 
-### Customize configuration
+---
+
+## 📋 Полезное
 
-See [Configuration Reference](https://cli.vuejs.org/config/). -->
+- Реестр задач и роадмап — [`TASKS.md`](TASKS.md)
+- История изменений — [`CHANGELOG.md`](CHANGELOG.md)
+- Заметки для агентов — [`AGENT.md`](AGENT.md)

package/dist/{ExtractsList-CqMn_6Rp.js → ExtractsList-BNHHbmEu.js}

@@ -1,5 +1,5 @@
 import { defineComponent as d, resolveComponent as l, openBlock as i, createElementBlock as C, Fragment as P, createVNode as m, unref as o, ref as u, createBlock as E, withCtx as k, createCommentVNode as v } from "vue";
-import { _ as f, P as w } from "./index-8p7UPAAQ.js";
+import { _ as f, P as w } from "./index-T6suvcZB.js";
 import "quasar";
 const B = /* @__PURE__ */ d({
   __name: "ExtractCreateForm",

package/dist/core/components/CarouselImages.vue.d.ts

@@ -55,8 +55,8 @@ declare const _default: import('vue').DefineComponent<globalThis.ExtractPropType
 }>> & Readonly<{
     onOpenModalWindow?: ((...args: any[]) => any) | undefined;
 }>, {
-    height: string;
     maxHeight: string;
+    height: string;
     quantity: number;
     animationTime: number;
     startActiveGroupIndex: number;

package/dist/core/components/GeneralItem.vue.d.ts

@@ -102,8 +102,8 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<gl
     };
 }>> & Readonly<{}>, {
     padding: string;
-    margin: string;
     width: string;
+    margin: string;
     height: string;
     fontSize: string;
     background: string;

package/dist/core/components/GridContainer.vue.d.ts

@@ -81,8 +81,8 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<gl
         default: string;
     };
 }>> & Readonly<{}>, {
-    margin: string;
     width: string;
+    margin: string;
     maxWidth: string;
     background: string;
     gridGap: string;

package/dist/core/components/InfoItem.vue.d.ts

@@ -202,19 +202,19 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<gl
     padding: string;
     title: string;
     close: boolean;
-    margin: string;
     width: string;
+    margin: string;
     height: string;
     maxWidth: string;
     minWidth: string;
     background: string;
     borderColor: string;
     customClass: string;
-    withOpenWindow: boolean;
-    withHover: boolean;
     openWidth: string;
     openHeight: string;
+    withOpenWindow: boolean;
     colorSelected: string;
+    withHover: boolean;
     baseBoxMargin: string;
     closeWindowOverflow: string;
     showSaveDialog: boolean;