@dxtmisha/constructor 0.30.1 → 0.39.3

package/src/constructors/Window/WindowInclude.ts

@@ -1,134 +0,0 @@
-import { computed, ref, type VNode } from 'vue'
-import {
-  type ConstrBind, type ConstrEmit,
-  DesignComponents,
-  getRef,
-  type RefOrNormal,
-  toBind
-} from '@dxtmisha/functional'
-
-import type { WindowProps } from './props'
-import type { WindowExpose, WindowSlots } from './types'
-import type {
-  WindowComponentInclude,
-  WindowEmitOptions,
-  WindowEmitsInclude, WindowExposeInclude,
-  WindowPropsInclude
-} from './basicTypes'
-
-/**
- * The class returns data for working with the Window component
- *
- * Класс возвращает данные для работы с компонентом Window
- */
-export class WindowInclude<
-  Props extends WindowPropsInclude = WindowPropsInclude,
-  PropsExtra extends ConstrBind<WindowProps> = ConstrBind<WindowProps>
-> {
-  /**
-   * Constructor
-   * @param props input parameter/ входной параметр
-   * @param className class name/ название класса
-   * @param components object for working with components/ объект для работы с компонентами
-   * @param emits the function is called when an event is triggered/ функция вызывается, когда срабатывает событие
-   * @param extra additional parameter or property name/ дополнительный параметр или имя свойства
-   * @param index index identifier/ идентификатор индекса
-   */
-  constructor(
-    protected readonly props: Readonly<Props>,
-    protected readonly className: string,
-    protected readonly components?: DesignComponents<WindowComponentInclude, Props>,
-    protected readonly emits?: ConstrEmit<WindowEmitsInclude>,
-    protected readonly extra?: RefOrNormal<PropsExtra>,
-    protected readonly index?: string
-  ) {
-  }
-
-  /** Reference to window element expose/ Ссылка на expose элемента окна */
-  readonly element = ref<ConstrBind<WindowExpose> | undefined>()
-
-  /** Computed bindings for the window/ Вычисляемые привязки для окна */
-  readonly binds = computed<PropsExtra>(() => {
-    const props = toBind<PropsExtra>(
-      getRef(this.extra) ?? {},
-      this.props.windowAttrs ?? {}
-    )
-
-    return {
-      ...props,
-
-      disabled: this.props.disabled,
-      autoClose: this.props.autoClose,
-
-      preparation: this.getPreparation,
-      opening: this.getOpening,
-      closing: this.getClosing
-    }
-  })
-
-  /**
-   * Expose helpers for window state and actions/
-   * Вспомогательные методы expose для состояния и действий окна
-   */
-  readonly expose: WindowExposeInclude = {
-    id: computed(() => String(this.element.value?.id)),
-    open: computed(() => Boolean(this.element.value?.open.value)),
-    control: computed(() => this.element.value?.control.value),
-    setOpen: async (open: boolean) => this.element.value?.setOpen(open),
-    toOpen: async () => this.element.value?.toOpen(),
-    toClose: async () => this.element.value?.toClose(),
-    toggle: async () => this.element.value?.toggle(),
-
-    windowElement: this.element
-  }
-
-  /**
-   * Render the Window component with slots/
-   * Рендер компонента Window со слотами
-   * @param slotsChildren slots passed to the window/ слоты, передаваемые окну
-   * @param attrs additional attributes/ дополнительные атрибуты
-   */
-  readonly render = (
-    slotsChildren: WindowSlots,
-    attrs?: Record<string, any>
-  ): VNode[] => {
-    if (this.components) {
-      return this.components.render(
-        'window',
-        {
-          ...toBind(
-            attrs ?? {},
-            this.binds.value
-          ),
-          ref: this.element,
-          onWindow: this.onWindow
-        },
-        slotsChildren as unknown as Record<string, any>,
-        this.index
-      )
-    }
-
-    return []
-  }
-
-  /** Returns preparation result/ Возвращает результат preparation */
-  protected readonly getPreparation = () =>
-    getRef(this.extra)?.preparation?.() ?? this.props.windowAttrs?.preparation?.()
-
-  /** Returns opening result/ Возвращает результат opening */
-  protected readonly getOpening = () =>
-    getRef(this.extra)?.opening?.() ?? this.props.windowAttrs?.opening?.() ?? true
-
-  /** Returns closing result/ Возвращает результат closing */
-  protected readonly getClosing = () =>
-    getRef(this.extra)?.closing?.() ?? this.props.windowAttrs?.closing?.() ?? true
-
-  /**
-   * Emits 'window' event upward/
-   * Поднимает событие 'window' наверх
-   * @param options event payload/ параметры события
-   */
-  protected readonly onWindow = (options: WindowEmitOptions) => {
-    this.emits?.('window', options)
-  }
-}

package/src/constructors/Window/WindowOpen.ts

@@ -1,301 +0,0 @@
-import { computed, ref } from 'vue'
-import { frame } from '@dxtmisha/functional'
-
-import { TabIndexInclude } from '../../classes/TabIndexInclude'
-
-import { WindowStatus } from './WindowStatus'
-import { WindowClient } from './WindowClient'
-import { WindowHook } from './WindowHook'
-
-import { WindowElement } from './WindowElement'
-
-import { WindowFlash } from './WindowFlash'
-import { WindowCoordinates } from './WindowCoordinates'
-import { WindowPosition } from './WindowPosition'
-import { WindowOrigin } from './WindowOrigin'
-import { WindowEmit } from './WindowEmit'
-import { WindowStyles } from './WindowStyles'
-
-import { __WINDOW_TYPE_BODY_NAME } from './basicTypes'
-import type { WindowProps } from './props'
-
-/**
- * Class for managing the status of an open window.
- *
- * Класс для управления статусом открытого окна.
- */
-export class WindowOpen {
-  readonly item = ref<boolean>(false)
-
-  protected readonly first = ref<boolean>(false)
-  protected clicks: number = 0
-
-  /**
-   * Constructor
-   * @param props input data/ входные данные
-   * @param client object for working with mouse pointer coordinates/ объект для работы с координатами указателя мыши
-   * @param hook object for working with hooks/ объект для работы с хуками
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   * @param tabIndex class object for working with tab indices/ объект класса для работы с табуляцией
-   * @param status object for working with statuses/ объект для работы со статусами
-   * @param flash class object for working with fast window opening/ объект класса для работы с быстрым открытием окна
-   * @param coordinates object for working with coordinates/ объект для работы с координатами
-   * @param position object for working with the position of the element/ объект для работы с положением элемента
-   * @param origin the object for work is in the initial position upon opening/ объект для работы в начальной позиции при открытии
-   * @param emit the function is called when an event is triggered/ функция вызывается, когда срабатывает событие
-   * @param styles an object for working with the styles of an element/ объект для работы со стилями элемента
-   */
-  constructor(
-    protected readonly props: WindowProps,
-    protected readonly client: WindowClient,
-    protected readonly hook: WindowHook,
-    protected readonly element: WindowElement,
-    protected readonly tabIndex: TabIndexInclude,
-    protected readonly status: WindowStatus,
-    protected readonly flash: WindowFlash,
-    protected readonly coordinates: WindowCoordinates,
-    protected readonly position: WindowPosition,
-    protected readonly origin: WindowOrigin,
-    protected readonly emit: WindowEmit,
-    protected readonly styles: WindowStyles
-  ) {
-  }
-
-  /**
-   * Checks whether the element should be kept in the DOM.
-   *
-   * Проверяет, надо ли элемент оставить в DOM.
-   */
-  readonly inDom = computed<boolean>(() => {
-    return this.item.value
-      || this.props.staticMode
-      || (
-        Boolean(this.props.inDom)
-        && this.first.value
-      )
-  })
-
-  /**
-   * Checks if the window is open.
-   *
-   * Проверяет, открыто ли окно.
-   */
-  isClicks(): boolean {
-    return this.clicks > 0
-  }
-
-  /**
-   * Changes the current state.
-   *
-   * Изменяет текущее состояние.
-   * @param open the value of the current state/ значение текущего состояния
-   */
-  readonly set = async (open?: boolean): Promise<void> => {
-    if (this.item.value !== Boolean(open)) {
-      await this.toggle()
-    }
-  }
-
-  /**
-   * Opens the window.
-   *
-   * Открывает окно.
-   */
-  readonly open = async (): Promise<void> => this.set(true)
-
-  /**
-   * Closes the window.
-   *
-   * Закрывает окно.
-   */
-  readonly close = async (): Promise<void> => this.set(false)
-
-  /**
-   * Switches the state, that is, opens or closes the window, depending on the value of item.
-   *
-   * Переключает состояние, то есть открывает или закрывает окно, в зависимости от значения item.
-   */
-  readonly toggle = async (): Promise<void> => {
-    if (this.clicks > 1) {
-      return
-    }
-
-    const toOpen = !this.item.value
-
-    if (await this.hook.before(toOpen)) {
-      if (toOpen) {
-        this.reset()
-        this.status.toDisplay()
-
-        await this.setOpen(toOpen)
-
-        requestAnimationFrame(async () => {
-          this.status.update()
-          await this.hook.preparation()
-          await this.watchPosition()
-          this.styles.updateType(true)
-
-          requestAnimationFrame(async () => {
-            this.position.updateScroll()
-            this.status.toPreparation()
-
-            requestAnimationFrame(async () => {
-              if (this.flash.isClose()) {
-                this.status.toFlash()
-              } else {
-                this.status.toOpen()
-              }
-
-              requestAnimationFrame(() => {
-                this.hook.opening()
-                this.resetClicks()
-                this.tabIndex.goTo()
-              })
-              this.emit.on(this.item.value)
-            })
-          })
-        })
-      } else {
-        this.client.reset()
-
-        if (this.flash.isOpen()) {
-          this.toClose()
-        } else {
-          requestAnimationFrame(() => {
-            this.status.toHide()
-            this.resetClicks()
-          })
-        }
-
-        this.tabIndex.reset()
-      }
-    }
-  }
-
-  /**
-   * Close handler on animation end.
-   *
-   * Обработчик закрытия по окончании анимации.
-   */
-  closeForEvent(): void {
-    if (this.status.isHide()) {
-      this.toClose()
-    } else if (!this.status.isOpen()) {
-      this.hook.closing().then()
-    }
-  }
-
-  /**
-   * Resets all data to initial values.
-   *
-   * Сбрасывает все данные к начальным значениям.
-   */
-  reset(): this {
-    this.coordinates.reset()
-    this.origin.reset()
-
-    return this
-  }
-
-  /**
-   * The method increases the number of clicks.
-   *
-   * Метод увеличивает количество кликов.
-   */
-  pressed(): this {
-    this.clicks++
-    setTimeout(() => this.resetClicks(), 128)
-    return this
-  }
-
-  /**
-   * The method resets the number of clicks.
-   *
-   * Метод сбрасывает количество кликов.
-   */
-  resetClicks(): this {
-    this.clicks = 0
-    return this
-  }
-
-  /**
-   * The method updates the current position.
-   *
-   * Метод обновляет текущее положение.
-   */
-  async watchPosition(): Promise<void> {
-    if (
-      this.item.value
-      && this.element.isMain()
-    ) {
-      this.position.update()
-      this.position.updateBody()
-      this.origin.update()
-      this.styles.update()
-
-      this.watchCoordinates()
-    } else {
-      this.reset()
-    }
-  }
-
-  /**
-   * Changes values and triggers events.
-   *
-   * Изменяет значения и вызывает события.
-   * @param open the value of the current state/ значение текущего состояния
-   */
-  async setOpen(open: boolean): Promise<this> {
-    this.item.value = open
-
-    if (open && !this.first.value) {
-      this.first.value = true
-    }
-
-    return this
-  }
-
-  /**
-   * Changing the location of the menu window.
-   *
-   * Изменение расположения окна меню.
-   */
-  protected watchCoordinates(): this {
-    frame(
-      () => {
-        const element = this.element.getMain()
-
-        if (element) {
-          const isMenu = getComputedStyle(element).getPropertyValue(__WINDOW_TYPE_BODY_NAME) === '"--MENU--"'
-
-          if (isMenu && this.position.update()) {
-            this.styles.update()
-          }
-
-          this.styles.updateType(isMenu)
-        }
-      },
-      () => this.item.value && !this.status.isHide()
-    )
-
-    return this
-  }
-
-  /**
-   * Transition to the closing state.
-   *
-   * Переход в состояние закрытия.
-   */
-  protected toClose(): void {
-    setTimeout(async () => {
-      await this.setOpen(false)
-
-      await this.hook.closing()
-
-      this.resetClicks()
-      this.emit.on(this.item.value)
-    }, 48)
-
-    this.status.toClose()
-  }
-}

package/src/constructors/Window/WindowOrigin.ts

@@ -1,89 +0,0 @@
-import { WindowClient } from './WindowClient'
-import { WindowElement } from './WindowElement'
-import { WindowPosition } from './WindowPosition'
-
-import { __WINDOW_TYPE_BODY_NAME } from './basicTypes'
-
-/**
- * Class for defining the initial position for the animation.
- *
- * Класс для определения начального положения для анимации.
- */
-export class WindowOrigin {
-  protected x: number | null = null
-  protected y: number | null = null
-
-  /**
-   * Constructor
-   * @param client object for working with mouse pointer coordinates/ объект для работы с координатами указателя мыши
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   * @param position object for working with the position of the element/ объект для работы с положением элемента
-   */
-  constructor(
-    protected readonly client: WindowClient,
-    protected readonly element: WindowElement,
-    protected readonly position: WindowPosition
-  ) {
-  }
-
-  /**
-   * Returns the initial X point for the start of the animation.
-   *
-   * Возвращает начальную точку X для начала анимации.
-   */
-  getStyleX(): string | null {
-    return this.x !== null ? `${this.x}px` : null
-  }
-
-  /**
-   * Returns the initial Y point for the start of the animation.
-   *
-   * Возвращает начальную точку Y для начала анимации.
-   */
-  getStyleY(): string | null {
-    return this.y !== null ? `${this.y}px` : null
-  }
-
-  /**
-   * Updating the initial position of the element for the animation.
-   *
-   * Обновление начального положения элемента для анимации.
-   */
-  update(): this {
-    const element = this.element.getMain()
-
-    this.client.update()
-
-    if (!this.client.is()) {
-      this.x = 0
-      this.y = 0
-    } else if (
-      element
-      && getComputedStyle(element).getPropertyValue(__WINDOW_TYPE_BODY_NAME) !== '"--MENU--"'
-    ) {
-      const rect = this.element.getBodyRect()
-
-      if (rect) {
-        this.x = this.client.getShiftX(rect.left)
-        this.y = this.client.getShiftY(rect.top)
-      }
-    } else {
-      this.x = this.client.getShiftX(this.position.getX())
-      this.y = this.client.getShiftY(this.position.getY())
-    }
-
-    return this
-  }
-
-  /**
-   * Resets all data to initial values.
-   *
-   * Сбрасывает все данные к начальным значениям.
-   */
-  reset(): this {
-    this.x = null
-    this.y = null
-
-    return this
-  }
-}

package/src/constructors/Window/WindowPersistent.ts

@@ -1,89 +0,0 @@
-import { ref, watch } from 'vue'
-
-import { WindowClasses } from './WindowClasses'
-import { WindowElement } from './WindowElement'
-
-import type { WindowProps } from './props'
-
-/**
- * Class for managing the animation output before closing the window.
- *
- * Класс управления выводом анимации перед закрытием окна.
- */
-export class WindowPersistent {
-  readonly item = ref<boolean>(false)
-
-  /**
-   * Constructor
-   * @param props input data/ входные данные
-   * @param classes an object for working with classes and searching for elements/ объект для работы с классами и поиском элементов
-   * @param element an object of the class for working with elements/ объект класса для работы с элементами
-   */
-  constructor(
-    protected readonly props: WindowProps,
-    protected readonly classes: WindowClasses,
-    protected readonly element: WindowElement
-  ) {
-    watch(this.item, (value) => {
-      const element = this.element.getMain()
-
-      if (element) {
-        if (value) {
-          this.removeEvent()
-
-          element.classList.add(this.classes.list.persistent)
-          element.addEventListener('animationend', this.onTransitionend)
-        } else {
-          element.classList.remove(this.classes.list.persistent)
-        }
-      }
-    })
-  }
-
-  /**
-   * Request to enable animation.
-   *
-   * Запрос на включение анимации.
-   */
-  on(): boolean {
-    if (this.props.persistent) {
-      this.item.value = true
-      return true
-    }
-
-    return false
-  }
-
-  /**
-   * Request to disable animation.
-   *
-   * Запрос на выключение анимации.
-   */
-  disabled(): this {
-    if (this.item.value) {
-      this.item.value = false
-    }
-
-    return this
-  }
-
-  /**
-   * Event of the animation end of the closing prohibition.
-   *
-   * Событие окончания анимации запрета на закрытие.
-   */
-  protected readonly onTransitionend = (): void => {
-    this.removeEvent()
-    this.disabled()
-  }
-
-  /**
-   * Removes the event of the end of the animation.
-   *
-   * Удаляет событие окончания анимации.
-   */
-  protected removeEvent() {
-    this.element.getMain()
-      ?.removeEventListener('animationend', this.onTransitionend)
-  }
-}