PeriodFilter рендерил DayPicker numberOfMonths={2} со стандартными
rdp-* стилями — `.rdp-months` имеет `flex-wrap: wrap`, при недостатке
ширины два месяца стакались вертикально, ячейки большие/разреженные,
selected/hover состояний под наш accent не было. Выглядело rough.
Два фикса:
1. PeriodFilter → numberOfMonths={1}. Для audit-фильтрации одного
месяца достаточно (presets покрывают «7д/30д/Этот месяц»; календарь
нужен для arbitrary range). Простой layout, не зависит от ширины
popover'а.
2. Полноценные стили `.ord-day-picker` в styles.css (~80 строк):
- tight cells (2rem × 2rem)
- hover state на surface-2
- selected day → accent bg + on-accent text
- range_middle → accent-bg, обнулённый radius
- range_start/end → polo'асn'ое closure radius
- today → 1px outline
- outside-month days → mute opacity
- nav buttons → accent цвет + hover
- mono font на числа (JetBrains Mono), Inter на caption/weekday
Бенефит распространяется и на DateRangePicker (использует тот же класс).
flex-wrap: nowrap override — на случай если когда-то понадобится
numberOfMonths={2} в другом контексте, не будет вертикального стека.
CSS transform-box default для SVG = view-box (transform-origin в viewBox
user coords). С transform-box: fill-box origin становится относительным
bounding-box каждой группы (whirl + whirl-rev — arc bbox смещён). Арки
летали по неправильной траектории. Прототип HTML rely on default — copy.
Per user — GlobeLoader должен показывать реальные континенты (Asia/Africa/
Australia outline) с rotating orthographic projection, как в прототипе
Downloads/Globe loader/Globe Loader.html. Прошлая версия использовала
faked ellipses graticule — выглядело как абстрактные кольца, не как глобус.
Implementation:
- d3-geo.geoOrthographic + d3.geoPath для projection math
- topojson-client.feature для распаковки world-atlas land-110m
- dynamic import обоих deps + JSON — не блокирует main bundle, lazy chunk
- requestAnimationFrame loop пересчитывает d-attr на каждом кадре
(8s per revolution per прототип, tilt -15° lean)
- LAND_CACHE module-level — повторные mount'ы не re-fetch
- CSS .globe-sphere rotation удалена — d3 projection делает работу,
CSS transform distort'ила бы land mass (нет projection math)
Bundle hit: ~55kb (land-110m.json) + ~15kb gzipped (d3-geo + topojson) —
lazy chunk, fetched один раз и cached.
UI redesign matching prototype (Ordinis (3) dump):
- ExportModal: format (CSV/JSON/Excel/SQL) + scope (all/filtered/selected) +
column toggles + encoding/delimiter + preview filename per redesign line
1059-1092. CSV uses backend mutation, JSON client-side from filtered rows,
Excel/SQL disabled (backend pending).
- TimeTravelModal: full-page compare СЕЙЧАС vs ТОЧКА ВО ВРЕМЕНИ + quick
presets (сейчас/неделя/месяц/год/при создании) + step toggle версия/день
+ slider + tabs (Что изменилось / Записи на момент / Структура и поля) +
"Открыть как readonly" CTA. Replaces inline TimeTravelPicker.
- InfoPanel ← используют merge: rich rows с field path + active records
count + onClose policy chip (BLOCK/WARN/CASCADE). Inline
DictionaryDependentsPanel above records table removed (one source of truth).
- Sidebar logo: match redesign/ui-kit.html .brand SVG (outer ring + inner
faded ring + orbit dot offset right cx=22.5). ORDINIS Tektur tracking 0.22em
+ MDM smaller mute 0.32em.
- Bg neutralized: #fbf8ee Earth cream → #faf9f5 warm neutral default
(per user preference, Earth cream still described in comment как opt-in).
- WorkflowBanner: Case 1 Live (approvalRequired=false) returns null —
permanent "Опубликовано" banner = noise, status already visible в
InfoPanel scope/version/updatedAt. Banner показывается только когда
есть actionable state.
Critical bug fixes:
- fix(CascadeConfirmDialog): infinite render loop "Maximum update depth
exceeded". useEffect had cascadeMut (TanStack Query mutation wrapper) в
deps — wrapper identity changes every render → effect fires → reset() →
store update → render → loop. Extract stable `reset` reference перед
useEffect. Симптомы у user: создание/редактирование записи не работали.
- fix(semantic-release): add missing peer dep
conventional-changelog-conventionalcommits (9.3.1). semantic-release 22+
больше не bundles preset. Без неё release job падал с
"Cannot find module 'conventional-changelog-conventionalcommits'".
Reverted MR !66 de-yellow — turns out redesign prototype intentionally
использует жёлтый Earth cream (#fbf8ee) как primary bg. User confusion
was с предыдущим build'ом до MR !66, в ui-kit все таки cream.
Added tokens per redesign/ui-kit.html prototype:
Scope tints:
--bg-public, --bg-internal, --bg-tenant (для scope chip backgrounds)
Workflow states:
--bg-draft, --bg-live, --bg-deprec (для workflow banner backgrounds)
Alert variants:
--al-info-bg/bd, --al-warn-bg/bd, --al-err-bg/bd, --al-ok-bg/bd
Shadows:
--shadow-l, --shadow-m, --shadow-toast, --shadow-drawer (consistent)
Toast cap color:
--toast-cap #d4a07a (orange-cream per handoff Screen 4)
Avatars:
--avt-pink-bg, --avt-green-bg (semantic state avatar backgrounds)
Purple:
--color-purple для future use
New theme '[data-theme=claude-light]':
Warm cream neutral (#faf9f5) — для users которые не любят saturated Earth.
Accent navy → coral orange (#d97757) per Claude branding.
Full token set включая scope/workflow/alert variants.
Dark theme получил те же дополнительные tokens (bg-public/internal/tenant,
al-info-bg/bd, shadows, toast-cap, avt-bg) — consistency с light tier.
User может через ThemeSwitch / manual data-theme attr выбрать:
default — Earth cream (handoff design intent)
claude-light — neutral warm
dark — Claude-style dark
Bundle: +~1KB CSS. Tests: 116 pass.
Реальные измерения через DevTools на staging выявили 3 бага после MR !47:
Bug 1: text-title-md/lg/xl inherited Tektur от @nstart/ui Card parent.
Handoff: 'Inter for all headings'. Computed: Tektur.
Fix: добавил font-family: var(--font-sans) explicit на text-title-*
и text-body/text-cell. После Stage 3.9 (nstart gone) можно убрать —
body inherit будет достаточно.
Bug 2: text-cap + font-mono cohabit (catalog scope chips, time-travel
presets) → Tailwind v4 cascade order: font-mono идёт после text-cap
в bundled CSS → JetBrains Mono перебивает Tektur. text-cap baked
font-display, font-mono token redundant.
Fix: codemod strip font-mono где есть text-cap (4 sites). Computed
font-family теперь правильно Tektur.
Bug 3: @nstart/ui PageHeader рендерил h1 'DICTIONARIES' в Tektur
36px/700 uppercase (font-primary text-4xl). Handoff page title:
17px/600 Inter normal case. Наш src/ui/components/page-header.tsx
написан но не экспортирован через barrel — все routes резолвили
PageHeader к nstart версии.
Fix: добавил 'export { PageHeader }' override в src/ui/index.ts.
Все 7 PageHeader usages (catalog/search/reviews/webhooks/outbox/
my-drafts/graph) теперь получат handoff-conformant heading.
Bug 4 (small): catalog counter '37/37' использовал text-cap но это
numeric value — handoff role text-mono (11px JetBrains Mono).
Fix: text-cap → text-mono + tabular-nums для grid alignment.
Verified via injected test elements + CDP computed styles:
text-title-xl: 22/600 Inter
text-title-lg: 17/600 Inter
text-title-md: 15/600 Inter
text-body: 13/400 Inter
text-cell: 12.5/500 Inter
text-mono: 11/500 JetBrains Mono
text-cap: 10.5/600 Tektur
Все 7 utilities точно matches handoff scale.
Files: 4 modified. TS strict + 116 tests pass.
Свои Modal/Button/inputs выкинуты — берём nstart-ui v0.1.3 как в других corp
React приложениях. Установка через .npmrc → repo.nstart.cloud/repository/npm-hosted/.
Что сделано:
- .npmrc: scope @nstart на corp Nexus + min-release-age=7
- deps: @nstart/ui ^0.1.3, @phosphor-icons/react ^2.1.10
- bumped peer deps: i18next ^26 + react-i18next ^17 (требование nstart-ui)
- styles.css: импорт @nstart/ui/styles/{fonts,theme}.css + critical @source
директива (без неё Tailwind v4 tree-shaking дропнул бы все классы из dist либы)
- main.tsx: <NStartUiProvider> на корне
- DROP src/components/ui/Modal.tsx (свой Modal больше не нужен)
Routes:
- __root: LanguageSwitch вместо двух кнопок RU/EN, токены ultramarain/regolith/carbon
- dictionaries.index: PageHeader + Badge для scope chip + Alert/EmptyState/LoadingBlock
- dictionaries.$name: PageHeader с actions, Modal/Panel/Table/TableRow/Cell,
IconButton с Phosphor (PencilSimple, XCircle), Button variant=primary/danger/ghost
Form (SchemaDrivenForm):
- TextInput/TextArea/SingleSelect/Checkbox + FieldLabel/Hint/Error из @nstart/ui
- FormSection + FormGrid columns=1|2 для группировки
- FormActions align=end с Button loading state
- Alert variant=error для server-side ошибок (422 IdempotencyConflict / 409 InProgress)
- ajv валидация по schema_json остаётся такой же (Draft-07, как у backend)
Bundle: 192KB → 659KB gzip — тянет echarts/lottie/brand assets из nstart-ui,
для internal admin tool приемлемо (cached after first load).
Кнопка «+ Создать запись» использует bg-brand-600 / hover:bg-brand-700, но в
@theme были определены только brand-50/500/700 — bg-brand-600 резолвился в
ничто, кнопка отрисовывалась без фона + text-white = невидимая на белом.
Добавил полную шкалу 50-900 в OKLCH для консистентного hover/active.
Zimin A.N.