adata-ui 2.1.40-beta.2 → 2.1.40-beta.20

package/components/overlays/tooltip/useTooltipTrigger.ts

@@ -1,101 +1,101 @@
-import type { Ref } from 'vue'
-import type { TooltipTrigger } from './types'
-import { computed, watch } from 'vue'
-
-interface UseTooltipTriggerOptions {
-  /** Visibility ref (the component's `v-model:open`). Mutated here. */
-  open: Ref<boolean>
-  trigger: Ref<TooltipTrigger>
-  disabled: Ref<boolean>
-  openDelay: Ref<number>
-  closeDelay: Ref<number>
-}
-
-/**
- * Owns the open/close state machine for {@link ATooltipV2}: debounced show/hide
- * and the per-mode DOM listeners. Kept separate from the SFC so each trigger
- * style (hover/focus, click, manual) stays small and independently testable.
- */
-export function useTooltipTrigger(options: UseTooltipTriggerOptions) {
-  const { open, trigger, disabled, openDelay, closeDelay } = options
-
-  let openTimer: ReturnType<typeof setTimeout> | null = null
-  let closeTimer: ReturnType<typeof setTimeout> | null = null
-
-  function clearOpenTimer() {
-    if (openTimer) {
-      clearTimeout(openTimer)
-      openTimer = null
-    }
-  }
-
-  function clearCloseTimer() {
-    if (closeTimer) {
-      clearTimeout(closeTimer)
-      closeTimer = null
-    }
-  }
-
-  function clearTimers() {
-    clearOpenTimer()
-    clearCloseTimer()
-  }
-
-  function show() {
-    if (disabled.value || open.value) return
-    clearCloseTimer()
-    if (openDelay.value > 0) {
-      openTimer = setTimeout(() => {
-        open.value = true
-        openTimer = null
-      }, openDelay.value)
-    }
-    else {
-      open.value = true
-    }
-  }
-
-  function hide() {
-    clearOpenTimer()
-    if (!open.value) return
-    if (closeDelay.value > 0) {
-      closeTimer = setTimeout(() => {
-        open.value = false
-        closeTimer = null
-      }, closeDelay.value)
-    }
-    else {
-      open.value = false
-    }
-  }
-
-  function toggle() {
-    if (open.value) hide()
-    else show()
-  }
-
-  function close() {
-    clearTimers()
-    open.value = false
-  }
-
-  // Force-close if disabled while visible.
-  watch(disabled, (value) => {
-    if (value) close()
-  })
-
-  // Listeners bound on the trigger wrapper via `v-on`, selected by mode.
-  const listeners = computed<Record<string, () => void>>(() => {
-    if (disabled.value) return {}
-    switch (trigger.value) {
-      case 'hover':
-        return { mouseenter: show, mouseleave: hide, focusin: show, focusout: hide }
-      case 'click':
-        return { click: toggle }
-      default:
-        return {}
-    }
-  })
-
-  return { show, hide, toggle, close, clearTimers, listeners }
-}
+import type { Ref } from 'vue'
+import type { TooltipTrigger } from './types'
+import { computed, watch } from 'vue'
+
+interface UseTooltipTriggerOptions {
+  /** Visibility ref (the component's `v-model:open`). Mutated here. */
+  open: Ref<boolean>
+  trigger: Ref<TooltipTrigger>
+  disabled: Ref<boolean>
+  openDelay: Ref<number>
+  closeDelay: Ref<number>
+}
+
+/**
+ * Owns the open/close state machine for {@link ATooltipV2}: debounced show/hide
+ * and the per-mode DOM listeners. Kept separate from the SFC so each trigger
+ * style (hover/focus, click, manual) stays small and independently testable.
+ */
+export function useTooltipTrigger(options: UseTooltipTriggerOptions) {
+  const { open, trigger, disabled, openDelay, closeDelay } = options
+
+  let openTimer: ReturnType<typeof setTimeout> | null = null
+  let closeTimer: ReturnType<typeof setTimeout> | null = null
+
+  function clearOpenTimer() {
+    if (openTimer) {
+      clearTimeout(openTimer)
+      openTimer = null
+    }
+  }
+
+  function clearCloseTimer() {
+    if (closeTimer) {
+      clearTimeout(closeTimer)
+      closeTimer = null
+    }
+  }
+
+  function clearTimers() {
+    clearOpenTimer()
+    clearCloseTimer()
+  }
+
+  function show() {
+    if (disabled.value || open.value) return
+    clearCloseTimer()
+    if (openDelay.value > 0) {
+      openTimer = setTimeout(() => {
+        open.value = true
+        openTimer = null
+      }, openDelay.value)
+    }
+    else {
+      open.value = true
+    }
+  }
+
+  function hide() {
+    clearOpenTimer()
+    if (!open.value) return
+    if (closeDelay.value > 0) {
+      closeTimer = setTimeout(() => {
+        open.value = false
+        closeTimer = null
+      }, closeDelay.value)
+    }
+    else {
+      open.value = false
+    }
+  }
+
+  function toggle() {
+    if (open.value) hide()
+    else show()
+  }
+
+  function close() {
+    clearTimers()
+    open.value = false
+  }
+
+  // Force-close if disabled while visible.
+  watch(disabled, (value) => {
+    if (value) close()
+  })
+
+  // Listeners bound on the trigger wrapper via `v-on`, selected by mode.
+  const listeners = computed<Record<string, () => void>>(() => {
+    if (disabled.value) return {}
+    switch (trigger.value) {
+      case 'hover':
+        return { mouseenter: show, mouseleave: hide, focusin: show, focusout: hide }
+      case 'click':
+        return { click: toggle }
+      default:
+        return {}
+    }
+  })
+
+  return { show, hide, toggle, close, clearTimers, listeners }
+}

package/components/transitions/ATransitionHeight.vue

@@ -1,67 +1,67 @@
-<script setup lang="ts">
-import ui from "#adata-ui/components/elements/accordion/AAccordionGroup/ui.config";
-import { twMerge } from 'tailwind-merge'
-
-const props = defineProps<{
-  transition?: {
-    enterActiveClass?: string
-    leaveActiveClass?: string
-  }
-}>()
-
-const mergedUi = computed(() => ({
-  transition: {
-    enterActiveClass: twMerge(
-      ui.transition.enterActiveClass,
-      props.transition?.enterActiveClass
-    ),
-    leaveActiveClass: twMerge(
-      ui.transition.leaveActiveClass,
-      props.transition?.leaveActiveClass
-    )
-  }
-}))
-
-function onEnter(_el: Element, done: () => void) {
-  const el = _el as HTMLElement
-  el.style.height = '0'
-  el.offsetHeight // Trigger a reflow, flushing the CSS changes
-  el.style.height = el.scrollHeight + 'px'
-
-  el.addEventListener('transitionend', done, {once: true})
-}
-
-function onBeforeLeave(_el: Element) {
-  const el = _el as HTMLElement
-  el.style.height = el.scrollHeight + 'px'
-  el.offsetHeight // Trigger a reflow, flushing the CSS changes
-}
-
-function onAfterEnter(_el: Element) {
-  const el = _el as HTMLElement
-  el.style.height = 'auto'
-}
-
-function onLeave(_el: Element, done: () => void) {
-  const el = _el as HTMLElement
-  el.style.height = '0'
-
-  el.addEventListener('transitionend', done, {once: true})
-}
-</script>
-
-<template>
-  <Transition
-    v-bind="mergedUi.transition"
-    @enter="onEnter"
-    @after-enter="onAfterEnter"
-    @before-leave="onBeforeLeave"
-    @leave="onLeave"
-  >
-    <slot/>
-  </Transition>
-</template>
-
-<style scoped>
-
-</style>
+<script setup lang="ts">
+import ui from "#adata-ui/components/elements/accordion/AAccordionGroup/ui.config";
+import { twMerge } from '#adata-ui/utils/twMerge'
+
+const props = defineProps<{
+  transition?: {
+    enterActiveClass?: string
+    leaveActiveClass?: string
+  }
+}>()
+
+const mergedUi = computed(() => ({
+  transition: {
+    enterActiveClass: twMerge(
+      ui.transition.enterActiveClass,
+      props.transition?.enterActiveClass
+    ),
+    leaveActiveClass: twMerge(
+      ui.transition.leaveActiveClass,
+      props.transition?.leaveActiveClass
+    )
+  }
+}))
+
+function onEnter(_el: Element, done: () => void) {
+  const el = _el as HTMLElement
+  el.style.height = '0'
+  el.offsetHeight // Trigger a reflow, flushing the CSS changes
+  el.style.height = el.scrollHeight + 'px'
+
+  el.addEventListener('transitionend', done, {once: true})
+}
+
+function onBeforeLeave(_el: Element) {
+  const el = _el as HTMLElement
+  el.style.height = el.scrollHeight + 'px'
+  el.offsetHeight // Trigger a reflow, flushing the CSS changes
+}
+
+function onAfterEnter(_el: Element) {
+  const el = _el as HTMLElement
+  el.style.height = 'auto'
+}
+
+function onLeave(_el: Element, done: () => void) {
+  const el = _el as HTMLElement
+  el.style.height = '0'
+
+  el.addEventListener('transitionend', done, {once: true})
+}
+</script>
+
+<template>
+  <Transition
+    v-bind="mergedUi.transition"
+    @enter="onEnter"
+    @after-enter="onAfterEnter"
+    @before-leave="onBeforeLeave"
+    @leave="onLeave"
+  >
+    <slot/>
+  </Transition>
+</template>
+
+<style scoped>
+
+</style>

package/components/utils/index.ts

@@ -1,19 +1,19 @@
-export function mergeConfig<T>(defaultUi: T, config: Partial<T>): T {
-  const mergedUi = {...defaultUi};
-
-  for (const key in config) {
-    if (Object.prototype.hasOwnProperty.call(config, key)) {
-      const defaultValue = defaultUi[key];
-      const configValue = config[key];
-      if (typeof defaultValue === 'object' && typeof configValue === 'object' && defaultValue !== null && configValue !== null) {
-        mergedUi[key] = mergeConfig(defaultValue, configValue);
-      } else if (typeof configValue === 'string') {
-        mergedUi[key] = `${defaultValue} ${configValue}`;
-      } else {
-        mergedUi[key] = configValue;
-      }
-    }
-  }
-
-  return mergedUi as T;
-}
+export function mergeConfig<T>(defaultUi: T, config: Partial<T>): T {
+  const mergedUi = {...defaultUi};
+
+  for (const key in config) {
+    if (Object.prototype.hasOwnProperty.call(config, key)) {
+      const defaultValue = defaultUi[key];
+      const configValue = config[key];
+      if (typeof defaultValue === 'object' && typeof configValue === 'object' && defaultValue !== null && configValue !== null) {
+        mergedUi[key] = mergeConfig(defaultValue, configValue);
+      } else if (typeof configValue === 'string') {
+        mergedUi[key] = `${defaultValue} ${configValue}`;
+      } else {
+        mergedUi[key] = configValue;
+      }
+    }
+  }
+
+  return mergedUi as T;
+}

package/components/utils/removeTrailingSlash.ts

@@ -1,7 +1,7 @@
-export function removeTrailingSlash(str: string): string {
-  if (str.endsWith('/')) {
-    return str.slice(0, -1)
-  }
-
-  return str
-}
+export function removeTrailingSlash(str: string): string {
+  if (str.endsWith('/')) {
+    return str.slice(0, -1)
+  }
+
+  return str
+}

package/composables/highlight.ts

@@ -1,18 +1,18 @@
-export default function (text: string, search = ""): string {
-  let label: string = text || ""
-
-  const index: number = label.toLowerCase().indexOf(search?.toLowerCase())
-  const regExp = new RegExp(search, "gi")
-
-  if (index >= 0) {
-    label = label.replace(
-      regExp,
-      `<span class="bg-yellow-200 dark:text-gray-950 dark:bg-yellow-300">${label.substring(
-        index,
-        index + search.length
-      )}</span>`
-    )
-  }
-
-  return label
-}
+export default function (text: string, search = ""): string {
+  let label: string = text || ""
+
+  const index: number = label.toLowerCase().indexOf(search?.toLowerCase())
+  const regExp = new RegExp(search, "gi")
+
+  if (index >= 0) {
+    label = label.replace(
+      regExp,
+      `<span class="bg-yellow-200 dark:text-gray-950 dark:bg-yellow-300">${label.substring(
+        index,
+        index + search.length
+      )}</span>`
+    )
+  }
+
+  return label
+}

package/composables/modalsState.ts

@@ -1,8 +1,8 @@
-export const useAuthModal = () => useState<boolean>('auth-modal', () => false)
-export const useAnotherDeviceModal = () => useState<boolean>('another-device-modal', () => false)
-
-export const useLimitReachedModal = () => useState<boolean>('limit-reached-modal', () => false)
-export const usePaymentMethodModal = () => useState<boolean>('payment-method-modal', () => false)
-export const useReplenishModal = () => useState<boolean>('replenish-modal', () => false)
-export const useLowBalanceModal = () => useState<boolean>('low-balance-modal', () => false)
-export const useNoAccessModal = () => useState<boolean>('no-access-modal', () => false)
+export const useAuthModal = () => useState<boolean>('auth-modal', () => false)
+export const useAnotherDeviceModal = () => useState<boolean>('another-device-modal', () => false)
+
+export const useLimitReachedModal = () => useState<boolean>('limit-reached-modal', () => false)
+export const usePaymentMethodModal = () => useState<boolean>('payment-method-modal', () => false)
+export const useReplenishModal = () => useState<boolean>('replenish-modal', () => false)
+export const useLowBalanceModal = () => useState<boolean>('low-balance-modal', () => false)
+export const useNoAccessModal = () => useState<boolean>('no-access-modal', () => false)

package/composables/projectState.ts

@@ -1,2 +1,2 @@
-export const useCurrentModule = () => useState<string>('current-module', () => 'pk')
-export const useContacts = () => useState<any>('contacts', () => [])
+export const useCurrentModule = () => useState<string>('current-module', () => 'pk')
+export const useContacts = () => useState<any>('contacts', () => [])

package/composables/useAccessTokenCookie.ts

@@ -0,0 +1,25 @@
+import { useUrls } from '#adata-ui/composables/useUrls'
+
+/**
+ * Единая точка записи куки accessToken (логин, 2FA, OTP, обмен по auth-сессии).
+ * Домен должен совпадать с доменом удаления в resetTokens (adata-common-auth),
+ * иначе кука не находится на следующей загрузке и логин-флоу зацикливается на reload.
+ */
+export async function writeAccessTokenCookie(accessToken: string, expireIn?: number): Promise<boolean> {
+  const { mode } = useUrls()
+  const sharedDomain = `${mode}.kz`
+  const onSharedDomain = location.hostname === sharedDomain || location.hostname.endsWith(`.${sharedDomain}`)
+  const maxAge = Number(expireIn) > 0 ? Number(expireIn) : undefined
+
+  useCookie('accessToken', {
+    maxAge,
+    // на localhost/превью-хостах атрибут domain невалиден — пишем host-only куку
+    domain: onSharedDomain ? `.${sharedDomain}` : undefined,
+    path: '/',
+    secure: location.protocol === 'https:',
+  }).value = accessToken
+
+  // useCookie пишет document.cookie на следующем flush, не синхронно
+  await nextTick()
+  return document.cookie.split('; ').some(part => part.startsWith('accessToken='))
+}

package/composables/useActiveNavigation.ts

@@ -1,84 +1,84 @@
-// Active-state detection for the products mega-menu.
-//
-// Two levels of "active":
-//   1. activeModule  — the current host matches one of the module's hosts
-//      (host ≠ module key: e.g. the `fines` module lives on avto.*.kz,
-//       and `tenders` spans both zakupki.*.kz and tender.*.kz).
-//   2. activeService — within the active module, the current page matches a
-//      concrete item link (`/`, `/unload`, `/foreign`, …).
-
-const LOCALE_SEGMENTS = new Set(['kk', 'en'])
-
-interface NavTarget { to: string }
-interface NavModule { link: string, items: NavTarget[] }
-interface NormalizedUrl { host: string, key: string }
-
-function safeUrl(href: string): URL | null {
-  try {
-    return new URL(href)
-  }
-  catch {
-    return null
-  }
-}
-
-// Reduce a URL to a comparable identity: host + locale-stripped path + query.
-// The query is kept because it can be significant (fines main is `/?check_fines=true`).
-function normalize(href: string): NormalizedUrl | null {
-  const url = safeUrl(href)
-  if (!url) return null
-
-  const segments = url.pathname
-    .split('/')
-    .filter(segment => segment && !LOCALE_SEGMENTS.has(segment))
-
-  const path = `/${segments.join('/')}`
-  return { host: url.host, key: path + url.search }
-}
-
-// A "root" target has no path segments (e.g. `/` or `/?check_fines=true`).
-// Roots must match exactly, otherwise their prefix would light up every sub-page.
-function isRoot(key: string): boolean {
-  return key === '/' || key.startsWith('/?')
-}
-
-export function useActiveNavigation() {
-  const route = useRoute()
-
-  // Recompute on every SPA navigation. Host stays constant within an app, so we
-  // read it from the request URL (SSR-safe); the path/query come from the route.
-  const current = computed<NormalizedUrl | null>(() => {
-    const host = useRequestURL().host
-    return normalize(`https://${host}${route.fullPath}`)
-  })
-
-  function isActiveModule(module: NavModule): boolean {
-    if (!current.value) return false
-
-    const hosts = new Set<string>()
-    const link = normalize(module.link)
-    if (link) hosts.add(link.host)
-    for (const item of module.items) {
-      const item_url = normalize(item.to)
-      if (item_url) hosts.add(item_url.host)
-    }
-
-    return hosts.has(current.value.host)
-  }
-
-  function isActiveService(itemTo: string): boolean {
-    const cur = current.value
-    const item = normalize(itemTo)
-    if (!cur || !item || cur.host !== item.host) return false
-
-    // The car-check page redirects to a `car-result` URL; keep its item lit.
-    if (item.key.includes('check-car') && cur.key.includes('car-result')) return true
-
-    if (cur.key === item.key) return true
-    if (isRoot(item.key)) return false
-
-    return cur.key.startsWith(item.key)
-  }
-
-  return { isActiveModule, isActiveService }
-}
+// Active-state detection for the products mega-menu.
+//
+// Two levels of "active":
+//   1. activeModule  — the current host matches one of the module's hosts
+//      (host ≠ module key: e.g. the `fines` module lives on avto.*.kz,
+//       and `tenders` spans both zakupki.*.kz and tender.*.kz).
+//   2. activeService — within the active module, the current page matches a
+//      concrete item link (`/`, `/unload`, `/foreign`, …).
+
+const LOCALE_SEGMENTS = new Set(['kk', 'en'])
+
+interface NavTarget { to: string }
+interface NavModule { link: string, items: NavTarget[] }
+interface NormalizedUrl { host: string, key: string }
+
+function safeUrl(href: string): URL | null {
+  try {
+    return new URL(href)
+  }
+  catch {
+    return null
+  }
+}
+
+// Reduce a URL to a comparable identity: host + locale-stripped path + query.
+// The query is kept because it can be significant (fines main is `/?check_fines=true`).
+function normalize(href: string): NormalizedUrl | null {
+  const url = safeUrl(href)
+  if (!url) return null
+
+  const segments = url.pathname
+    .split('/')
+    .filter(segment => segment && !LOCALE_SEGMENTS.has(segment))
+
+  const path = `/${segments.join('/')}`
+  return { host: url.host, key: path + url.search }
+}
+
+// A "root" target has no path segments (e.g. `/` or `/?check_fines=true`).
+// Roots must match exactly, otherwise their prefix would light up every sub-page.
+function isRoot(key: string): boolean {
+  return key === '/' || key.startsWith('/?')
+}
+
+export function useActiveNavigation() {
+  const route = useRoute()
+
+  // Recompute on every SPA navigation. Host stays constant within an app, so we
+  // read it from the request URL (SSR-safe); the path/query come from the route.
+  const current = computed<NormalizedUrl | null>(() => {
+    const host = useRequestURL().host
+    return normalize(`https://${host}${route.fullPath}`)
+  })
+
+  function isActiveModule(module: NavModule): boolean {
+    if (!current.value) return false
+
+    const hosts = new Set<string>()
+    const link = normalize(module.link)
+    if (link) hosts.add(link.host)
+    for (const item of module.items) {
+      const item_url = normalize(item.to)
+      if (item_url) hosts.add(item_url.host)
+    }
+
+    return hosts.has(current.value.host)
+  }
+
+  function isActiveService(itemTo: string): boolean {
+    const cur = current.value
+    const item = normalize(itemTo)
+    if (!cur || !item || cur.host !== item.host) return false
+
+    // The car-check page redirects to a `car-result` URL; keep its item lit.
+    if (item.key.includes('check-car') && cur.key.includes('car-result')) return true
+
+    if (cur.key === item.key) return true
+    if (isRoot(item.key)) return false
+
+    return cur.key.startsWith(item.key)
+  }
+
+  return { isActiveModule, isActiveService }
+}