[design-wave1][@dark] fix: палитра команд — рамка курсора на любом столе, не только активном

Заголовок workspace-row получал outline только когда стол активный (.is-active .row.is-selected). На неактивных столах при навигации курсор «терялся»: только лёгкая смена фона на surface-2, без рамки — в отличие от page'ей, которые подсвечиваются outline'ом всегда. Выровнял правило: outline на любом .workspace-row.is-selected.
[design-wave1][@dark] fix: палитра команд — clamp навигации стрелками вместо wrap-around
2026-05-28 11:52:16 +00:00 · 2026-05-28 11:47:46 +00:00 · 2026-05-28 11:40:01 +00:00 · 2026-05-28 10:32:30 +00:00 · 2026-05-28 10:30:25 +00:00 · 2026-05-28 10:28:24 +00:00
21 changed files with 178 additions and 1093 deletions
@@ -532,6 +532,7 @@ const selectGroupByName = (workspaceName: string) => {
    contentRef,

    // Computed
+    groupedItems,
    filteredItems,
    flatSearchResults,
    isSearchMode,
@@ -1,9 +1,40 @@
 <template lang="pug">
-q-page.p-md.bg-gray-100.text-center.pa-4
-  div.q-mt-lg.full-screen 404 страница не найдена!
-  q-btn(flat @click="router.push('/')") на главную
+q-page.blank-page
+  .blank-page__inner
+    EmptyState(
+      title='Страница не найдена',
+      body='Похоже, такой страницы нет или она была перенесена. Попробуйте вернуться на главную.'
+    )
+      template(#icon)
+        q-icon(name='search_off', size='48px')
+      template(#action)
+        BaseButton(variant='primary', @click='goHome')
+          template(#icon-left)
+            q-icon(name='home')
+          | На главную
 </template>
+
 <script setup lang="ts">
-  import { useRouter } from 'vue-router'
-  const router = useRouter()
+import { useRouter } from 'vue-router';
+import EmptyState from 'src/shared/ui/base/EmptyState/EmptyState.vue';
+import BaseButton from 'src/shared/ui/base/BaseButton/BaseButton.vue';
+
+const router = useRouter();
+
+function goHome(): void {
+  void router.push('/');
+}
 </script>
+
+<style scoped>
+.blank-page {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--p-6, 24px);
+}
+.blank-page__inner {
+  width: 100%;
+  max-width: 520px;
+}
+</style>
@@ -1,46 +1,56 @@
 <template lang="pug">
-.row.justify-center
-  q-card.q-pa-md.q-mt-lg(flat, bordered)
-    q-card-section
-      .full-width.text-center
-        q-badge.q-pa-sm(color='red')
-          q-icon(name='fa-regular fa-hand', size='48px')
-      .text-h4 Недостаточно прав доступа
-
-    q-card-actions(align='center')
-      q-btn(
-        label='Вернуться',
-        color='primary',
-        icon='fa fa-arrow-left',
-        @click='goBack'
-      )
+q-page.permission-denied
+  .permission-denied__inner
+    EmptyState(
+      title='Недостаточно прав доступа',
+      body='У вас нет доступа к этой странице. Если это ошибка — обратитесь к председателю или вернитесь в личный кабинет.'
+    )
+      template(#icon)
+        q-icon(name='lock_outline', size='48px')
+      template(#action)
+        BaseButton(variant='primary', @click='goBack')
+          template(#icon-left)
+            q-icon(name='arrow_back')
+          | Вернуться
 </template>
+
 <script lang="ts" setup>
 import { useRouter } from 'vue-router';
 import { useDesktopStore } from 'src/entities/Desktop/model';
 import { useSessionStore } from 'src/entities/Session';
+import EmptyState from 'src/shared/ui/base/EmptyState/EmptyState.vue';
+import BaseButton from 'src/shared/ui/base/BaseButton/BaseButton.vue';

 const router = useRouter();
 const desktops = useDesktopStore();
 const session = useSessionStore();

-function goBack() {
-  // Если пользователь авторизован, пытаемся перейти на безопасную страницу
+function goBack(): void {
  if (session.isAuth && session.isRegistrationComplete) {
-    // Пытаемся перейти на participant workspace как самый безопасный вариант
    const hasParticipantWorkspace = desktops.currentDesktop?.workspaces.some(
      (ws) => ws.name === 'participant',
    );

    if (hasParticipantWorkspace) {
-      // Устанавливаем participant workspace и переходим на его главную страницу
      desktops.selectWorkspace('participant');
      desktops.goToDefaultPage(router);
      return;
    }
  }

-  // Если ничего не найдено, идем на страницу по умолчанию для неавторизованного пользователя
  desktops.goToDefaultPage(router);
 }
 </script>
+
+<style scoped>
+.permission-denied {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: var(--p-6, 24px);
+}
+.permission-denied__inner {
+  width: 100%;
+  max-width: 520px;
+}
+</style>
@@ -1 +0,0 @@
-export { default as AxonWalletDisplay } from './ui/AxonWalletDisplay.vue';
@@ -1,82 +0,0 @@
-<template lang="pug">
-.axon-wallet-display
-  ColorCard(color='purple')
-    // Заголовок
-    .wallet-header
-      .wallet-title
-        q-icon(name="account_balance_wallet" size="20px").q-mr-sm
-        | Кошелек AXON
-
-    // Описание
-    .wallet-description
-      .text-body2.text-white
-        | AXON используется для оплаты пакетов документов. Минимально 5 AXON в день, по факту - от использования.
-
-    // Баланс
-    .balance-section
-      .balance-value {{ formattedBalance }}
-      .balance-label Доступно
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue';
-import { useSessionStore } from 'src/entities/Session';
-import { ColorCard } from 'src/shared/ui';
-import { formatAsset2Digits } from 'src/shared/lib/utils/formatAsset2Digits';
-
-const session = useSessionStore();
-
-// Форматированный баланс AXON
-const formattedBalance = computed(() => {
-  const balance = session.blockchainAccount?.core_liquid_balance || '0';
-  return formatAsset2Digits(`${balance} AXON`);
-});
-</script>
-
-<style lang="scss" scoped>
-.axon-wallet-display {
-  padding: 8px;
-
-  // Переопределяем отступ ColorCard только для этого виджета
-  :deep(.color-card) {
-    margin-bottom: 0 !important;
-  }
-
-  .wallet-header {
-    margin-bottom: 8px;
-
-    .wallet-title {
-      display: flex;
-      align-items: center;
-      font-size: 14px;
-      font-weight: 600;
-    }
-  }
-
-  .wallet-description {
-    margin-bottom: 12px;
-
-    .text-body2 {
-      font-size: 12px;
-      line-height: 1.4;
-    }
-  }
-
-  .balance-section {
-    padding: 12px;
-    background: rgba(255, 255, 255, 0.15);
-    border-radius: 8px;
-
-    .balance-label {
-      font-size: 11px;
-      opacity: 0.8;
-      margin-bottom: 4px;
-    }
-
-    .balance-value {
-      font-size: 18px;
-      font-weight: 700;
-    }
-  }
-}
-</style>
@@ -1,71 +0,0 @@
-<template lang="pug">
-div.footer-root.blockinfo.no-select
-  div(v-if="missedConnection")
-    i(style="color: red").far.fa-circle
-    div
-      span нет
-    div
-      span соединения
-  div(v-else)
-    i(style="color: green").far.fa-circle
-    div
-      span блок №
-    div
-      span {{ currentBlock }}
-
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue'
-import { useSystemStore } from 'src/entities/System/model'
-
-const { info } = useSystemStore()
-
-let currentBlock = computed(() => {
-  return info.blockchain_info?.head_block_num
-})
-
-// Всегда считаем, что соединение есть, поскольку blockchain_info обновляется автоматически
-let missedConnection = computed(() => {
-  return false
-})
-
-</script>
-
-<style lang="scss">
-.footer-root {
-  text-align: center;
-}
-
-.blockinfo {
-  width: 100%;
-  text-align: center;
-  position: absolute;
-  bottom: 10px;
-  font-style: normal;
-  font-weight: 400;
-  font-size: 10px;
-  line-height: 16px;
-  color: #8a8a8a;
-}
-
-.logout {
-  cursor: pointer;
-
-  &:hover .logout-text {
-    text-decoration: underline;
-  }
-
-  .logout-text {
-    font-style: normal;
-    font-weight: 400;
-    font-size: 14px;
-    line-height: 18px;
-    color: #181818;
-    vertical-align: bottom;
-    display: inline-block;
-    padding-left: 10px;
-  }
-}
-</style>
-src/app/config
@@ -1 +0,0 @@
-export { default as BlockchainStatusBar } from './BlockchainStatusBar.vue'
@@ -1,36 +0,0 @@
-<template lang="pug">
-// Кнопки сохранения (всегда видны при наличии прав редактирования)
-div(v-if="canEdit").row.justify-center.q-gutter-sm
-  q-btn(
-    flat
-    size="sm"
-    color="negative"
-    label="Отменить"
-    :disable="!hasChanges"
-    @click="$emit('reset')"
-  )
-  q-btn(
-    size="sm"
-    color="primary"
-    label="Сохранить"
-    :loading="isSaving"
-    :disable="!hasChanges"
-    @click="$emit('save')"
-  )
-</template>
-
-<script lang="ts" setup>
-defineProps<{
-  hasChanges: boolean;
-  canEdit: boolean;
-  isSaving: boolean;
-}>();
-
-defineEmits<{
-  reset: [];
-  save: [];
-}>();
-</script>
-
-<style lang="scss" scoped>
-</style>
@@ -1 +0,0 @@
-export { default as DescriptionSaveButtons } from './DescriptionSaveButtons.vue';
@@ -2,50 +2,72 @@
 import { computed } from 'vue';

 interface IProps {
-  title?: string
-  show_close?: boolean
+  title?: string;
+  show_close?: boolean;
 }

 const props = withDefaults(defineProps<IProps>(), {
  title: '',
-  show_close: true
-})
+  show_close: true,
+});

-const title = computed(() => props.title)
+const title = computed(() => props.title);
 </script>

 <template lang="pug">
-q-card(style="min-width: 350px; max-width: 100%;")
-  q-bar.modal-base__bar.bg-gradient-dark.text-white
-    span.modal-base__title(v-if="!$slots.title") {{ title }}
-    slot(v-else name="title")
-    q-space
-    q-btn.modal-base__close(v-if="show_close" v-close-popup dense flat icon="close")
+//- Canon-оболочка диалога. Визуально соответствует shared/ui/base/BaseDialog.
+//- API совместим со старым ModalBase: title / show_close / slot=default,
+//- slot=title — поэтому подходит как drop-in для 40+ legacy call-site'ов
+//- (внешний q-dialog держит родитель). Новые диалоги пишем на BaseDialog
+//- с v-model:modelValue.
+q-card.modal-base
+  .modal-base__head(v-if='title || $slots.title || show_close')
+    .modal-base__title
+      slot(v-if='$slots.title', name='title')
+      template(v-else) {{ title }}
+    q-btn.modal-base__close(
+      v-if='show_close',
+      v-close-popup,
+      flat,
+      round,
+      dense,
+      icon='close',
+      aria-label='Закрыть'
+    )
      q-tooltip Закрыть
  slot
-
 </template>

 <style scoped lang="scss">
-/* Заголовок диалога может занимать две строки (длинные названия, узкий
-   экран). q-bar по умолчанию nowrap c фиксированной высотой и обрезает
-   текст сверху — разрешаем перенос, растим бар по контенту и прижимаем
-   крестик к верху, чтобы он не уезжал вниз вслед за второй строкой. */
-.modal-base__bar {
-  height: auto;
-  min-height: 32px;
-  align-items: flex-start;
-  padding-top: 8px;
-  padding-bottom: 8px;
+.modal-base {
+  width: 100%;
+  max-width: 440px;
+  background: var(--p-surface);
+  color: var(--p-ink);
+  border-radius: var(--p-r-md, 12px);
+  box-shadow: var(--p-shadow-modal);
+}
+.modal-base__head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: var(--p-3, 12px);
+  padding: var(--p-3, 12px) var(--p-4, 16px) 0;
 }
 .modal-base__title {
  flex: 1 1 auto;
  min-width: 0;
+  font-size: var(--p-fs-h3);
+  font-weight: 600;
+  letter-spacing: var(--p-ls-h3);
+  color: var(--p-ink);
+  /* Длинные заголовки переносятся, не обрезаются. */
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.3;
 }
 .modal-base__close {
  flex: 0 0 auto;
+  color: var(--p-ink-3);
 }
 </style>
@@ -1,53 +0,0 @@
-// Стили для компактных табов
-.compact-tabs {
-  border-radius: 8px 8px 0 0;
-  overflow: hidden;
-  background-color: rgba(0, 0, 0, 0.03);
-  border: 1px solid rgba(0, 0, 0, 0.05);
-  border-bottom: none;
-
-  .q-dark & {
-    background-color: rgba(255, 255, 255, 0.05);
-    border: 1px solid rgba(255, 255, 255, 0.08);
-    border-bottom: none;
-  }
-
-  .q-tab {
-    font-size: 11px !important;
-    font-weight: 400;
-    transition: all 0.2s ease;
-    letter-spacing: -0.2px;
-  }
-
-  .q-tab__label {
-    font-size: 11px !important;
-    transition: transform 0.2s ease;
-  }
-
-  .q-tab__indicator {
-    height: 3px;
-    opacity: 0.8;
-  }
-}
-
-.q-tab__label {
-  font-size: 12px !important;
-}
-.q-tab {
-  min-height: 32px !important;
-}
-
-// Стили для панелей табов
-.tab-panels-card {
-  font-size: 10px !important;
-  border-radius: 0 0 8px 8px;
-  background-color: rgba(0, 0, 0, 0.02);
-  border: 1px solid rgba(0, 0, 0, 0.05);
-  border-top: none;
-
-  .q-dark & {
-    background-color: rgba(255, 255, 255, 0.03);
-    border: 1px solid rgba(255, 255, 255, 0.08);
-    border-top: none;
-  }
-}
@@ -1,141 +0,0 @@
-<template lang="pug">
-label.q-field.row.no-wrap.items-start.q-input.q-field--labeled.q-field--with-bottom(
-  :class="fieldClasses"
-  :style="standoutStyle"
-  :for="inputId"
-)
-  .q-field__inner.relative-position.col.self-stretch
-    .q-field__control.relative-position.row.no-wrap(tabindex="-1")
-      .q-field__control-container.col.relative-position.row.no-wrap.q-anchor--skip
-        .editor-input-wrapper
-          Editor(
-            :model-value="modelValue",
-            :readonly="readonly",
-            :placeholder="placeholder || 'Начните писать...'",
-            :min-height="minHeight || 150",
-            :show-focus-ring="true"
-            @update:modelValue="emit('update:modelValue', $event)"
-            @change="handleChange"
-            @ready="handleReady"
-          )
-        .q-field__label.no-pointer-events.absolute.ellipsis(v-if="label")
-          | {{ label }}
-    .q-field__bottom.row.items-start.q-field__bottom--animated
-      .q-field__messages.col
-        .q-field__messages--error(v-if="errorMessage")
-          | {{ errorMessage }}
-      .q-field__counter(v-if="counter")
-        | {{ counterText }}
-</template>
-
-<script setup lang="ts">
-import { computed, ref, watch } from 'vue'
-import { Editor } from '../Editor'
-
-interface Props {
-  modelValue: string | null | undefined
-  label?: string
-  placeholder?: string
-  readonly?: boolean
-  minHeight?: number
-  rules?: ((val: any) => string | boolean)[]
-  counter?: boolean
-  maxlength?: number
-  standout?: string
-  dark?: boolean
-}
-
-interface Emits {
-  (e: 'update:modelValue', value: string): void
-  (e: 'change'): void
-  (e: 'ready'): void
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  readonly: false,
-  minHeight: 150,
-})
-
-const emit = defineEmits<Emits>()
-
-// Генерируем уникальный ID для label
-const inputId = `f_${Math.random().toString(36).substr(2, 9)}`
-
-const errorMessage = ref('')
-const hasError = computed(() => !!errorMessage.value)
-
-const fieldClasses = computed(() => ({
-  'q-field--standout': props.standout,
-  'q-field--dark': props.dark,
-  'q-field--error': hasError.value,
-  'q-field--readonly': props.readonly
-}))
-
-const standoutStyle = computed(() => {
-  if (props.standout) {
-    return { background: props.standout }
-  }
-  return {}
-})
-
-const counterText = computed(() => {
-  if (!props.counter || !props.modelValue) return ''
-  const length = props.modelValue.length
-  return props.maxlength ? `${length}/${props.maxlength}` : `${length}`
-})
-
-const validate = () => {
-  if (!props.rules) return
-
-  for (const rule of props.rules) {
-    const result = rule(props.modelValue)
-    if (result !== true) {
-      errorMessage.value = result as string
-      return
-    }
-  }
-  errorMessage.value = ''
-}
-
-const handleChange = () => {
-  validate()
-  emit('change')
-}
-
-const handleReady = () => {
-  emit('ready')
-}
-
-watch(() => props.modelValue, () => {
-  if (hasError.value) {
-    validate()
-  }
-})
-</script>
-
-<style scoped>
-.editor-input-wrapper {
-  width: 100%;
-  min-width: 0;
-  max-width: 100%;
-}
-
-/* Стили для интеграции Editor с q-field */
-.q-field__control-container {
-  padding: 0;
-  min-height: 56px; /* Минимальная высота как у q-input */
-}
-
-.q-field__label {
-  z-index: 1;
-  transition: all 0.3s ease;
-}
-
-/* Когда редактор имеет контент, лейбл должен быть вверху */
-.q-field--labeled .q-field__label {
-  top: 8px;
-  left: 12px;
-  font-size: 12px;
-  transform: translateY(-8px);
-}
-</style>
@@ -1 +0,0 @@
-export { default as WrappedEditor } from './WrappedEditor.vue'
@@ -34,7 +34,7 @@ q-dialog(
      template(v-if='!isSearchMode')
        template(v-for='ws in workspaces', :key='ws.name')
          .command-palette__workspace(
-            :class='{ "is-active": ws.isActive, "is-sticky": ws.isActive }'
+            :class='{ "is-active": ws.isActive }'
          )
            button.command-palette__workspace-row(
              type='button',
@@ -218,8 +218,17 @@ function moveSelection(delta: number): void {
  const list = activeList.value;
  if (!list.length) return;
  const currentIdx = list.findIndex((e) => e.key === activeKey.value);
-  const safe = currentIdx === -1 ? 0 : currentIdx;
-  const next = (safe + delta + list.length) % list.length;
+  let next: number;
+  if (currentIdx === -1) {
+    // Нет текущего выделения — ↓ ставит на первый, ↑ на последний.
+    next = delta > 0 ? 0 : list.length - 1;
+  } else {
+    // Clamp в границах списка: на верхней/нижней позиции стрелка дальше
+    // не «оборачивает» курсор в противоположный конец — он остаётся на
+    // месте (привычное поведение скролла в нативных меню/listbox).
+    next = Math.max(0, Math.min(list.length - 1, currentIdx + delta));
+  }
+  if (next === currentIdx) return;
  activeKey.value = list[next].key;
  nextTick(() => scrollActiveIntoView());
 }
@@ -284,7 +293,7 @@ function onHide(): void {
  background: var(--p-surface);
  color: var(--p-ink);
  border-radius: var(--p-r-md, 12px);
-  box-shadow: var(--p-elev-3);
+  box-shadow: var(--p-shadow-modal);
  overflow: hidden;
 }

@@ -345,11 +354,6 @@ function onHide(): void {
 .command-palette__workspace {
  background: var(--p-surface);
 }
-.command-palette__workspace.is-sticky {
-  position: sticky;
-  top: 0;
-  z-index: 1;
-}

 .command-palette__workspace-row {
  display: flex;
@@ -368,20 +372,25 @@ function onHide(): void {
  transition: background var(--p-dur-fast, 120ms) var(--p-ease-standard);
 }
 .command-palette__workspace.is-active .command-palette__workspace-row {
-  background: var(--p-accent-soft, var(--p-primary-soft));
+  background: var(--p-primary-soft);
 }
 .command-palette__workspace-row:hover,
 .command-palette__workspace-row.is-selected {
  background: var(--p-surface-2);
 }
 .command-palette__workspace.is-active .command-palette__workspace-row.is-selected {
-  background: var(--p-accent-soft, var(--p-primary-soft));
-  outline: 2px solid var(--p-accent, var(--p-primary));
+  background: var(--p-primary-soft);
+}
+/* Универсальная рамка selected для строки стола — иначе при наведении
+   на неактивный стол курсор «теряется»: page'и имеют outline по selected,
+   а workspace-row до фикса получали outline только в is-active. */
+.command-palette__workspace-row.is-selected {
+  outline: 2px solid var(--p-primary);
  outline-offset: -2px;
 }

 .command-palette__workspace-icon {
-  color: var(--p-accent, var(--p-primary));
+  color: var(--p-primary);
  flex: 0 0 auto;
 }

@@ -399,8 +408,8 @@ function onHide(): void {
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
-  background: var(--p-accent, var(--p-primary));
-  color: var(--p-ink-on-accent, var(--p-ink-on-primary, #fff));
+  background: var(--p-primary);
+  color: var(--p-ink-on-primary, #fff);
  font-size: var(--p-fs-caption, 11px);
  font-weight: 600;
  flex: 0 0 auto;
@@ -435,7 +444,7 @@ function onHide(): void {
  color: var(--p-ink);
 }
 .command-palette__page.is-selected {
-  outline: 2px solid var(--p-accent, var(--p-primary));
+  outline: 2px solid var(--p-primary);
  outline-offset: -2px;
 }

@@ -482,15 +491,15 @@ function onHide(): void {
 }
 .command-palette__flat-item:hover,
 .command-palette__flat-item.is-selected {
-  background: var(--p-accent-soft, var(--p-primary-soft));
+  background: var(--p-primary-soft);
 }
 .command-palette__flat-item.is-selected {
-  outline: 2px solid var(--p-accent, var(--p-primary));
+  outline: 2px solid var(--p-primary);
  outline-offset: -2px;
 }

 .command-palette__flat-icon {
-  color: var(--p-accent, var(--p-primary));
+  color: var(--p-primary);
  flex: 0 0 auto;
 }

@@ -68,7 +68,7 @@ function close(): void {
  height: 100vh;
  background: var(--p-surface);
  color: var(--p-ink);
-  box-shadow: var(--p-elev-3);
+  box-shadow: var(--p-shadow-modal);
 }

 .details-drawer__header {
@@ -146,7 +146,7 @@ function plural(n: number, one: string, few: string, many: string): string {
  background: var(--p-surface);
  color: var(--p-ink);
  border-radius: var(--p-r-md, 12px);
-  box-shadow: var(--p-elev-2);
+  box-shadow: var(--p-shadow-pop);
  overflow: hidden;
 }

@@ -10,14 +10,11 @@ export * from './MeetCompactCard';
 export * from './ModalBase';
 export * from './TitleStyles';
 export * from './Editor';
-export * from './WrappedEditor';
 export * from './AutoSaveIndicator';
-export * from './AxonWalletDisplay';
 export * from './ColorCard';
 export * from './RouteMenuButton';
 export * from './Fab';
 export * from './CreateDialog';
-export * from './DescriptionSaveButtons';
 export * from './ExpandToggleButton';
 export * from './EntityIdBadge';
 export * from './Estimation';
@@ -1,563 +1,57 @@
 <template lang="pug">
-// Командная панель
-q-dialog.cmdk-dialog(
-  v-model="cmdkStore.showDialog",
-  transition-show="slide-down",
-  transition-hide="slide-up",
-  @keydown="cmdkStore.handleDialogKeydown",
-  @click="cmdkStore.closeDialog"
+//- Canon-обёртка: глобальная палитра команд по ⌘K / Ctrl+K.
+//- UI — canon CommandPalette из shared/ui/domain.
+//- Данные и навигация — из useCmdkMenuStore (роли, conditions, переключение
+//- рабочих столов, push в роутер, переключение по горячей клавише).
+CommandPalette(
+  v-model='showDialog',
+  :workspaces='workspaces',
+  placeholder='Поиск рабочих столов и страниц…'
+  @select-workspace='handleSelectWorkspace',
+  @select-page='handleSelectPage'
 )
-  .cmdk-panel
-    // Заголовок
-    .cmdk-header
-      q-icon.cmdk-search-icon(name="search")
-      input.cmdk-input(
-        autofocus,
-        ref="searchInput",
-        v-model="cmdkStore.searchQuery",
-        placeholder="Поиск рабочих столов и страниц...",
-        @input="cmdkStore.handleSearch"
-      )
-      q-btn.cmdk-close-btn(
-        flat,
-        dense,
-        round,
-        size="sm",
-        @click="cmdkStore.showDialog = false"
-      )
-        q-icon(name="close")
-
-    // Список результатов
-    div.cmdk-content(ref="contentRef")
-      transition-group(
-        name="cmdk-fade",
-        tag="div"
-      )
-        // Пустое состояние
-        .cmdk-empty-state(
-          v-if="cmdkStore.isSearchMode && cmdkStore.flatSearchResults.length === 0 && cmdkStore.searchQuery",
-          key="empty"
-        )
-          q-icon(name="search_off", size="md")
-          .empty-text Ничего не найдено
-          .empty-subtext Попробуйте другой запрос
-
-        // Плоский список при поиске
-        template(v-else-if="cmdkStore.isSearchMode && cmdkStore.flatSearchResults.length > 0")
-          .cmdk-flat-list
-            .cmdk-flat-item(
-              v-for="(item, index) in cmdkStore.flatSearchResults",
-              :key="item.workspaceName + (item.page?.name || 'workspace') + index",
-              :class="{ 'selected': cmdkStore.selectedIndex === index, 'is-workspace': item.type === 'workspace' }",
-              @click="handleSelectFlatItem(index)"
-            )
-              // Иконка рабочего стола
-              q-icon.cmdk-flat-workspace-icon(
-                v-if="item.type === 'page'",
-                :name="item.workspaceIcon"
-              )
-              q-icon.cmdk-flat-workspace-icon.cmdk-flat-workspace-icon_direct(
-                v-else,
-                :name="item.icon"
-              )
-
-              .cmdk-flat-content
-                // Название рабочего стола (для страниц)
-                .cmdk-flat-workspace-name(v-if="item.type === 'page'") {{ item.workspaceTitle }}
-                // Название страницы или рабочего стола
-                .cmdk-flat-title(v-if="item.type === 'page'") {{ item.page?.meta?.title }}
-                .cmdk-flat-title(v-else) {{ item.title }}
-                  span.badge-active(v-if="item.isActiveWorkspace") Активный
-
-              // Шорткат для страниц
-              .cmdk-flat-shortcut(v-if="item.type === 'page' && item.page?.shortcut") {{ item.page.shortcut }}
-
-        // Иерархический список (без поиска)
-        template(v-else-if="!cmdkStore.isSearchMode && cmdkStore.filteredItems.length > 0", v-for="(group, groupIndex) in cmdkStore.filteredItems", :key="group.workspaceName")
-          .cmdk-group
-            // Заголовок группы (воркспейс)
-            .cmdk-group-header(
-              :class="{ 'selected': cmdkStore.selectedIndex === groupIndex }"
-              @click="handleSelectGroup(groupIndex)"
-            )
-              q-icon.cmdk-group-icon(:name="group.icon")
-              .cmdk-group-title {{ group.title }}
-              .cmdk-group-badge(v-if="group.isActive") Активный
-
-            // Страницы внутри воркспейса
-            .cmdk-pages
-              .cmdk-page(
-                v-for="(page, pageIndex) in group.pages",
-                :key="page.name",
-                :class="{ 'selected': cmdkStore.selectedIndex === groupIndex && cmdkStore.selectedPageIndex === pageIndex }"
-                @click="handleSelectPage(group.workspaceName, page)"
-              )
-                q-icon.cmdk-page-icon(:name="page.meta.icon || 'circle'")
-                .cmdk-page-title {{ page.meta.title }}
-                .cmdk-page-shortcut(v-if="page.shortcut") {{ page.shortcut }}
-
-    // Подсказки
-    .cmdk-footer(v-if="!isMobile")
-      .cmdk-hint
-        kbd ↑↓
-        span для навигации
-        kbd ↵ Enter
-        span для выбора
-        kbd ⎋ Esc
-        span для закрытия
 </template>

 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, watchEffect } from 'vue';
+import { computed, onMounted, onUnmounted } from 'vue';
+import { storeToRefs } from 'pinia';
 import { useCmdkMenuStore } from 'src/entities/CmdkMenu/model';
-import { useMobileDrawer } from 'src/shared/lib/composables/useMobileDrawer';
-import { useWindowSize } from 'src/shared/hooks/useWindowSize';
+import type { CommandPaletteWorkspace } from 'src/shared/ui/domain/CommandPalette';

 const cmdkStore = useCmdkMenuStore();
-const { isMobile } = useWindowSize();
-const { closeDrawerOnMobile } = useMobileDrawer();
-const searchInput = ref<HTMLInputElement | null>(null);
-const contentRef = ref<HTMLElement | null>(null);
+const { showDialog, groupedItems } = storeToRefs(cmdkStore);

-// Обработчики для выбора элементов с закрытием drawer на мобильных устройствах
-const handleSelectGroup = (groupIndex: number) => {
-  closeDrawerOnMobile();
-  cmdkStore.selectGroup(groupIndex);
-};
+const workspaces = computed<CommandPaletteWorkspace[]>(() =>
+  groupedItems.value.map((group) => ({
+    name: group.workspaceName,
+    title: group.title,
+    icon: group.icon,
+    isActive: group.isActive,
+    pages: group.pages.map((page) => ({
+      name: page.name,
+      title: page.meta?.title ?? page.name,
+      icon: page.meta?.icon,
+      shortcut: page.shortcut,
+    })),
+  })),
+);

-const handleSelectPage = (workspaceName: string, page: any) => {
-  closeDrawerOnMobile();
+function handleSelectWorkspace(workspaceName: string): void {
+  cmdkStore.selectGroupByName(workspaceName);
+}
+
+function handleSelectPage(workspaceName: string, pageName: string): void {
+  const group = groupedItems.value.find((g) => g.workspaceName === workspaceName);
+  const page = group?.pages.find((p) => p.name === pageName);
+  if (!page) return;
  cmdkStore.selectPage(workspaceName, page);
-};
+}

-const handleSelectFlatItem = (index: number) => {
-  closeDrawerOnMobile();
-  cmdkStore.selectedIndex = index;
-  cmdkStore.selectCurrentItem();
-};
-
-// Следим за contentRef и устанавливаем его в store
-watchEffect(() => {
-  if (contentRef.value) {
-    cmdkStore.setContentRef(contentRef.value);
-  }
-});
-
-// Инициализируем глобальные обработчики клавиш при монтировании компонента
 onMounted(() => {
  cmdkStore.initGlobalKeydown();
-
-  // Устанавливаем searchInput
-  if (searchInput.value) {
-    cmdkStore.setSearchInput(searchInput.value);
-  }
 });

 onUnmounted(() => {
  cmdkStore.destroyGlobalKeydown();
 });
 </script>
-
-<style lang="scss">
-.cmdk-dialog {
-  max-width: 100%;
-  z-index: 10000;
-}
-
-.cmdk-panel {
-  width: 100%;
-  max-width: 600px;
-  background: white;
-  border-radius: 16px;
-  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
-  overflow: hidden;
-  border: 1px solid rgba(0, 0, 0, 0.1);
-}
-
-.cmdk-header {
-  display: flex;
-  align-items: center;
-  padding: 16px 20px;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-  background: #fafafa;
-}
-
-.cmdk-search-icon {
-  color: #666;
-  margin-right: 12px;
-  font-size: 18px;
-}
-
-.cmdk-input {
-  flex: 1;
-  border: none;
-  outline: none;
-  background: transparent;
-  font-size: 16px;
-  font-weight: 500;
-  color: #333;
-
-  &::placeholder {
-    color: #999;
-  }
-}
-
-.cmdk-close-btn {
-  margin-left: 12px;
-  opacity: 0.6;
-
-  &:hover {
-    opacity: 1;
-  }
-}
-
-.cmdk-content {
-  max-height: 400px;
-  overflow-y: auto;
-
-  &::-webkit-scrollbar {
-    width: 6px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: rgba(0, 0, 0, 0.05);
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: rgba(0, 105, 92, 0.3);
-    border-radius: 3px;
-  }
-}
-
-.cmdk-group {
-  &:not(:last-child) {
-    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
-  }
-}
-
-// Плоский список (режим поиска)
-.cmdk-flat-list {
-  padding: 8px 0;
-}
-
-.cmdk-flat-item {
-  display: flex;
-  align-items: center;
-  padding: 10px 20px;
-  cursor: pointer;
-  transition: all 0.2s ease;
-  user-select: none;
-
-  &:hover {
-    background: rgba(0, 105, 92, 0.06);
-  }
-
-  &.selected {
-    background: rgba(0, 105, 92, 0.1);
-  }
-
-  &.is-workspace {
-    background: rgba(0, 0, 0, 0.02);
-
-    &:hover {
-      background: rgba(0, 105, 92, 0.04);
-    }
-
-    &.selected {
-      background: rgba(0, 105, 92, 0.08);
-    }
-  }
-}
-
-.cmdk-flat-workspace-icon {
-  margin-right: 12px;
-  color: #00695c;
-  font-size: 18px;
-  opacity: 0.7;
-
-  &_direct {
-    opacity: 1;
-  }
-}
-
-.cmdk-flat-content {
-  flex: 1;
-  min-width: 0;
-}
-
-.cmdk-flat-workspace-name {
-  font-size: 11px;
-  color: #888;
-  margin-bottom: 2px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.cmdk-flat-title {
-  font-size: 14px;
-  color: #333;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-
-  .badge-active {
-    margin-left: 8px;
-    background: #00695c;
-    color: white;
-    padding: 2px 8px;
-    border-radius: 12px;
-    font-size: 10px;
-    font-weight: 500;
-  }
-}
-
-.cmdk-flat-shortcut {
-  color: #999;
-  font-size: 12px;
-  font-weight: 500;
-  margin-left: 12px;
-}
-
-.cmdk-group-header {
-  display: flex;
-  align-items: center;
-  padding: 12px 20px;
-  cursor: pointer;
-  transition: all 0.2s ease;
-  user-select: none;
-
-  &:hover {
-    background: rgba(0, 105, 92, 0.04);
-  }
-
-  &.selected {
-    background: rgba(0, 105, 92, 0.08);
-  }
-}
-
-.cmdk-group-icon {
-  margin-right: 12px;
-  color: #00695c;
-  font-size: 18px;
-}
-
-.cmdk-group-title {
-  flex: 1;
-  font-weight: 500;
-  color: #333;
-}
-
-.cmdk-group-badge {
-  background: #00695c;
-  color: white;
-  padding: 2px 8px;
-  border-radius: 12px;
-  font-size: 11px;
-  font-weight: 500;
-}
-
-.cmdk-pages {
-  background: rgba(0, 0, 0, 0.02);
-}
-
-.cmdk-page {
-  display: flex;
-  align-items: center;
-  padding: 10px 20px 10px 56px;
-  cursor: pointer;
-  transition: all 0.2s ease;
-  user-select: none;
-
-  &:hover {
-    background: rgba(0, 105, 92, 0.06);
-  }
-
-  &.selected {
-    background: rgba(0, 105, 92, 0.1);
-  }
-}
-
-.cmdk-page-icon {
-  margin-right: 12px;
-  color: #666;
-  font-size: 16px;
-}
-
-.cmdk-page-title {
-  flex: 1;
-  font-size: 14px;
-  color: #555;
-}
-
-.cmdk-page-shortcut {
-  color: #999;
-  font-size: 12px;
-  font-weight: 500;
-}
-
-.cmdk-empty-state {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 48px 20px;
-  color: #999;
-
-  .q-icon {
-    margin-bottom: 16px;
-    opacity: 0.5;
-  }
-
-  .empty-text {
-    font-size: 16px;
-    font-weight: 500;
-    margin-bottom: 4px;
-  }
-
-  .empty-subtext {
-    font-size: 14px;
-  }
-}
-
-.cmdk-footer {
-  padding: 12px 20px;
-  border-top: 1px solid rgba(0, 0, 0, 0.1);
-  background: #fafafa;
-}
-
-.cmdk-hint {
-  display: flex;
-  align-items: center;
-  gap: 16px;
-  font-size: 12px;
-  color: #666;
-
-  kbd {
-    background: #e0e0e0;
-    border-radius: 4px;
-    padding: 2px 6px;
-    font-size: 11px;
-    font-weight: 500;
-    color: #333;
-    border: 1px solid #ccc;
-  }
-
-  span {
-    margin-left: 4px;
-  }
-}
-
-// Анимации
-.cmdk-fade-enter-active,
-.cmdk-fade-leave-active {
-  transition: all 0.2s ease;
-}
-
-.cmdk-fade-enter-from {
-  opacity: 0;
-  transform: translateY(-8px);
-}
-
-.cmdk-fade-leave-to {
-  opacity: 0;
-  transform: translateY(8px);
-}
-
-// Темная тема
-body.body--dark {
-  .cmdk-panel {
-    background: #1e1e1e;
-    border-color: rgba(255, 255, 255, 0.1);
-  }
-
-  .cmdk-header {
-    background: #2a2a2a;
-    border-color: rgba(255, 255, 255, 0.1);
-  }
-
-  .cmdk-input {
-    color: #e0e0e0;
-
-    &::placeholder {
-      color: #888;
-    }
-  }
-
-  .cmdk-group-header:hover {
-    background: rgba(255, 255, 255, 0.05);
-  }
-
-  .cmdk-group-header.selected {
-    background: rgba(0, 105, 92, 0.15);
-  }
-
-  .cmdk-group-title {
-    color: #e0e0e0;
-  }
-
-  // Плоский список (поиск) - темная тема
-  .cmdk-flat-item {
-    &:hover {
-      background: rgba(255, 255, 255, 0.05);
-    }
-
-    &.selected {
-      background: rgba(0, 105, 92, 0.15);
-    }
-
-    &.is-workspace {
-      background: rgba(255, 255, 255, 0.03);
-
-      &:hover {
-        background: rgba(255, 255, 255, 0.05);
-      }
-
-      &.selected {
-        background: rgba(0, 105, 92, 0.12);
-      }
-    }
-  }
-
-  .cmdk-flat-workspace-icon {
-    color: #4db6ac;
-  }
-
-  .cmdk-flat-workspace-name {
-    color: #888;
-  }
-
-  .cmdk-flat-title {
-    color: #e0e0e0;
-
-    .badge-active {
-      background: #4db6ac;
-    }
-  }
-
-  .cmdk-page:hover {
-    background: rgba(255, 255, 255, 0.05);
-  }
-
-  .cmdk-page.selected {
-    background: rgba(0, 105, 92, 0.15);
-  }
-
-  .cmdk-page-title {
-    color: #ccc;
-  }
-
-  .cmdk-footer {
-    background: #2a2a2a;
-    border-color: rgba(255, 255, 255, 0.1);
-  }
-
-  .cmdk-hint {
-    color: #888;
-  }
-
-  .cmdk-empty-state {
-    color: #888;
-  }
-}
-</style>
@@ -1,90 +0,0 @@
-<template lang="pug">
-q-btn.cmdk-trigger(
-  flat,
-  dense,
-  stack,
-  @click="openCmdkDialog"
-  :color="buttonColor"
-  :class="{ 'active': cmdkStore.activeWorkspaceIcon !== 'fa-solid fa-desktop' }"
-)
-
-  .trigger-content
-    q-icon.trigger-icon(:name="cmdkStore.activeWorkspaceIcon")
-    .trigger-text {{ cmdkStore.activeWorkspaceTitle }}
-  .cmdk-shortcut(v-if="cmdkStore.shortcutHint") {{ cmdkStore.shortcutHint }}
-
-</template>
-
-<script setup lang="ts">
-import { computed } from 'vue';
-import { useQuasar } from 'quasar';
-import { useCmdkMenuStore } from 'src/entities/CmdkMenu/model';
-
-const cmdkStore = useCmdkMenuStore();
-const $q = useQuasar();
-
-const isDark = computed(() => $q.dark.isActive);
-
-const buttonColor = computed(() => isDark.value ? 'white' : 'black');
-
-const openCmdkDialog = () => {
-  cmdkStore.openDialog();
-};
-</script>
-
-<style lang="scss">
-.cmdk-trigger {
-  width: 100%;
-  height: 100px;
-  border-radius: 0 !important;
-  background: transparent;
-  border: none;
-  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-  position: relative;
-  align-items: center;
-  justify-content: center;
-
-  &:hover {
-    background: rgba(0, 105, 92, 0.04);
-  }
-
-  &.active {
-    background: rgba(0, 105, 92, 0.04);
-  }
-
-  .trigger-content {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: 4px;
-  }
-
-  .trigger-icon {
-    font-size: 20px;
-  }
-
-  .trigger-text {
-    font-size: 10px;
-    font-weight: 500;
-    text-align: center;
-    max-width: 100%;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .cmdk-shortcut {
-    position: absolute;
-    top: 4px;
-    right: 4px;
-    font-size: 8px;
-    color: #999;
-    font-weight: 500;
-    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-    line-height: 1;
-    padding: 1px 3px;
-    border-radius: 3px;
-    pointer-events: none;
-  }
-}
-</style>
@@ -1 +0,0 @@
-export { default as CmdkTrigger } from './CmdkTrigger.vue';
@@ -1,5 +1,4 @@
 export * from './CmdkMenu';
-export * from './CmdkTrigger';
 export * from './LeftDrawerMenu';
 export * from './SecondLevelMenuList';
 export * from './WorkspaceMenu';
Author	SHA1	Message	Date
coopops	6ee7eb93df	[design-wave1][@dark] fix: палитра команд — рамка курсора на любом столе, не только активном Заголовок workspace-row получал outline только когда стол активный (.is-active .row.is-selected). На неактивных столах при навигации курсор «терялся»: только лёгкая смена фона на surface-2, без рамки — в отличие от page'ей, которые подсвечиваются outline'ом всегда. Выровнял правило: outline на любом .workspace-row.is-selected.	2026-05-28 11:52:16 +00:00
coopops	1f15f368a6	[design-wave1][@dark] fix: палитра команд — clamp навигации стрелками вместо wrap-around На верхней/нижней позиции стрелка дальше прыгала в противоположный конец списка из-за (idx+delta+len)%len. Заменено на clamp в [0..len-1]: курсор остаётся на месте, как в нативном listbox/меню. Пустое выделение + ↓ ставит на первый, ↑ — на последний.	2026-05-28 11:47:46 +00:00
coopops	f72b4900ab	[design-wave1][@dark] fix: палитра команд — снят sticky-баннер активного стола Активный workspace был position:sticky top:0 — при навигации стрелкой вверх курсор-выделение «исчезал» за sticky-overlay'ем, потому что scrollIntoView({block:'nearest'}) считал элемент видимым в normal flow, не учитывая sticky-перекрытие. Активный стол и так идёт первым по сортировке + есть badge «Активный», sticky не нужен.	2026-05-28 11:40:01 +00:00
coopops	f859651038	[design-wave1][@dark] chore: снос мёртвых shared/ui компонентов Удалены 5 компонентов без call-site'ов (проверено grep'ом по имени, не только по пути — barrel-импорты тоже учтены): AxonWalletDisplay, BlockchainStatusBar, DescriptionSaveButtons, TabStyles, WrappedEditor. Соответствующие реэкспорты из shared/ui/index.ts вычищены.	2026-05-28 10:32:30 +00:00
coopops	d763f08fec	[design-wave1][@dark] feat: страницы 404 и «Нет доступа» на canon EmptyState BlankPage (404) и PermissionDenied переписаны: вместо вёрстки на q-card с text-h4 теперь EmptyState + BaseButton. Иконки в EmptyState через slot=icon, действия — через slot=action. Текст пользовательский: «Страница не найдена / такой страницы нет или она была перенесена» и «Недостаточно прав доступа / обратитесь к председателю».	2026-05-28 10:30:25 +00:00
coopops	805ac73ed7	[design-wave1][@dark] refactor: ModalBase под canon-стили — 40+ диалогов сразу в canon без правки call-site'ов ModalBase визуально приведён к canon (как BaseDialog): surface, h3-заголовок, round close-btn, --p-r-md, --p-shadow-modal. API сохранён (title/show_close/ slot=default/slot=title) — внешний q-dialog по-прежнему держит родитель. Чистая миграция на BaseDialog с v-model:modelValue отложена в Cleanup. Попутно фикс несуществующих токенов --p-elev-* (CommandPalette, DetailsDrawer, NotificationCenter): --p-elev-3 → --p-shadow-modal, --p-elev-2 → --p-shadow-pop.	2026-05-28 10:28:24 +00:00
coopops	b82b778b81	[design-wave1][@dark] refactor: CmdkMenu → canon CommandPalette — palette в primary, мёртвый CmdkTrigger удалён CmdkMenu стал тонкой обёрткой над shared/ui/domain/CommandPalette: данные и навигация из useCmdkMenuStore (роли/conditions/⌘K), UI — canon-палитра. В CommandPalette заменил accent на primary (бирюзовый по канону). CmdkTrigger нигде не использовался — удалён вместе с экспортом.	2026-05-28 10:23:53 +00:00
				`@@ -1 +0,0 @@`
				`export { default as AxonWalletDisplay } from './ui/AxonWalletDisplay.vue';`
				`@@ -1 +0,0 @@`
				`export { default as BlockchainStatusBar } from './BlockchainStatusBar.vue'`
				`@@ -1 +0,0 @@`
				`export { default as DescriptionSaveButtons } from './DescriptionSaveButtons.vue';`
				`@@ -1 +0,0 @@`
				`export { default as WrappedEditor } from './WrappedEditor.vue'`
				`@@ -1 +0,0 @@`
				`export { default as CmdkTrigger } from './CmdkTrigger.vue';`