@dxtmisha/constructor 0.23.0 → 0.39.3

package/src/constructors/MotionTransform/MotionTransformSize.ts

@@ -1,97 +0,0 @@
-import { MotionTransformElement } from './MotionTransformElement'
-
-/**
- * Class for managing size calculation.
- *
- * Класс для управления вычислением размера.
- */
-export class MotionTransformSize {
-  /** Top offset for transform/ Верхнее смещение для трансформации */
-  top: string | null = null
-  /** Left offset for transform/ Левое смещение для трансформации */
-  left: string | null = null
-  /** Head width value/ Ширина шапки */
-  headWidth: string | null = null
-  /** Total height value/ Общая высота */
-  height: string | null = null
-  /** Scale factor/ Коэффициент масштаба */
-  scale: string | null = null
-
-  /** Context width/ Ширина контекста */
-  contextWidth: string | null = null
-  /** Context height/ Высота контекста */
-  contextHeight: string | null = null
-
-  /** Head height value/ Высота шапки */
-  headHeight: string | null = null
-  /** Head scale factor/ Коэффициент масштаба шапки */
-  headScale: string | null = null
-
-  /** Body height value/ Высота тела */
-  bodyHeight: string | null = null
-
-  /**
-   * Constructor
-   * @param element class object for managing an element/ объект класса для управления элементом
-   */
-  constructor(
-    protected element: MotionTransformElement
-  ) {
-  }
-
-  /**
-   * Update all sizes.
-   *
-   * Обновить все размеры.
-   */
-  update(): void {
-    const rect = this.element.getRect()
-
-    if (rect) {
-      const elementHead = this.element.getElementHead()
-      const elementBody = this.element.getElementBody()
-
-      const scale = 1 / window.innerWidth * rect.width
-      const headScale = 1 / rect.width * window.innerWidth
-
-      this.top = `${rect.top - (scale * rect.top / (scale - 1))}px`
-      this.left = `${rect.left - (scale * rect.left / (scale - 1))}px`
-      this.height = `${100 / window.innerHeight * rect.height * headScale}%`
-      this.scale = scale.toString()
-
-      this.contextWidth = `${rect.width}px`
-      this.contextHeight = `${rect.height}px`
-
-      if (elementHead) {
-        this.headWidth = `${rect.width}px`
-        this.headHeight = `${elementHead.offsetHeight ?? '0'}px`
-        this.headScale = headScale.toString()
-
-        if (elementBody) {
-          this.bodyHeight = `${elementBody.offsetHeight + (this.element.isSection() ? elementHead.offsetHeight : 0)}px`
-        }
-      }
-    }
-  }
-
-  /**
-   * Restores all data to original.
-   *
-   * Восстанавливает все данные на изначальные.
-   */
-  reset(): void {
-    this.top = null
-    this.left = null
-    this.height = null
-    this.scale = null
-
-    this.contextWidth = null
-    this.contextHeight = null
-
-    this.headWidth = null
-    this.headHeight = null
-    this.headScale = null
-
-    this.bodyHeight = null
-  }
-}

package/src/constructors/MotionTransform/MotionTransformState.ts

@@ -1,250 +0,0 @@
-import { computed, ref, watch } from 'vue'
-
-import { MotionTransformElement } from './MotionTransformElement'
-import { MotionTransformSize } from './MotionTransformSize'
-
-import type { MotionTransformProps } from './props'
-
-/**
- * State management class.
- *
- * Класс управления состоянием.
- */
-export class MotionTransformState {
-  /** Open state flag/ Флаг состояния открытия */
-  readonly open = ref<boolean>(false)
-  /** Temporary show state for animation/ Временный флаг показа для анимации */
-  readonly show = ref<boolean>(false)
-  /** Teleportation state flag/ Флаг состояния телепортации */
-  readonly teleport = ref<boolean>(false)
-
-  /**
-   * Constructor.
-   *
-   * Конструктор.
-   * @param props input data/ входные данные
-   * @param element class object for managing an element/ объект класса для управления элементом
-   * @param size class object for managing sizes/ объект класса для управления размерами
-   */
-  constructor(
-    props: MotionTransformProps,
-    protected element: MotionTransformElement,
-    protected size: MotionTransformSize
-  ) {
-    watch([this.element.element, this.open], this.makeOpen)
-    watch([this.element.element, this.teleport], this.makeTeleport)
-
-    if (props.open) {
-      requestAnimationFrame(() => {
-        this.open.value = Boolean(props.open)
-        this.calculations()
-      })
-    }
-  }
-
-  /** Computed open flag/ Вычисляемый флаг открытия */
-  readonly isOpen = computed(() => this.open.value)
-
-  /** Checks if the element should be shown/ Проверяет, следует ли показывать элемент */
-  readonly isShow = computed<boolean>(() => this.open.value || this.show.value)
-
-  /**
-   * Checks if teleportation should be disabled.
-   *
-   * Проверяет, нужно ли отключить телепортацию.
-   */
-  isTeleportClose(): boolean {
-    return this.teleport.value && !this.open.value
-  }
-
-  /**
-   * Changes in the state of the open window.
-   *
-   * Изменения состояния открытого окна.
-   * @param open opening status/ статус открытия
-   * @param animation opening with animation/ открытие с анимацией
-   */
-  set(
-    open: boolean,
-    animation = true
-  ) {
-    if (this.open.value !== open) {
-      if (
-        animation
-        && this.element.isAnimation()
-      ) {
-        this.show.value = true
-
-        requestAnimationFrame(() => {
-          this.calculations()
-          this.make()
-
-          requestAnimationFrame(() => {
-            this.open.value = open
-          })
-        })
-      } else {
-        this.open.value = open
-        this.calculations()
-      }
-
-      setTimeout(() => this.reset(), 480)
-    }
-  }
-
-  /**
-   * Status switching.
-   *
-   * Переключение статуса.
-   */
-  toggle(): void {
-    this.set(!this.open.value)
-  }
-
-  /**
-   * Resets the data to the initial state.
-   *
-   * Сбрасывает данные в первичное состояние.
-   */
-  reset(): this {
-    if (this.show.value) {
-      this.show.value = false
-
-      if (this.isTeleportClose()) {
-        this.teleport.value = false
-      }
-
-      this.make()
-    }
-
-    return this
-  }
-
-  /**
-   * Update of the display class.
-   *
-   * Обновление класса показа.
-   */
-  protected readonly makeShow = () => {
-    const element = this.element.getElement()
-
-    if (element) {
-      element.dataset.show = this.show.value ? 'show' : 'none'
-    }
-  }
-
-  /**
-   * Update of the opening class.
-   *
-   * Обновление класса открытия.
-   */
-  protected readonly makeOpen = () => {
-    const element = this.element.getElement()
-
-    if (element) {
-      element.dataset.open = this.open.value ? 'open' : 'none'
-    }
-  }
-
-  /**
-   * Update of the teleport class.
-   *
-   * Обновление класса телепорта.
-   */
-  protected readonly makeTeleport = () => {
-    const element = this.element.getElement()
-
-    if (element) {
-      element.dataset.teleport = this.teleport.value ? 'teleport' : 'none'
-    }
-  }
-
-  /**
-   * Calculations before animation.
-   *
-   * Вычисления перед анимацией.
-   */
-  protected calculations(): void {
-    this.size.update()
-    this.toTeleport()
-  }
-
-  /**
-   * Animation control.
-   *
-   * Управление анимацией.
-   */
-  protected toTeleport(): void {
-    if (this.element.isWindow()) {
-      this.teleport.value = this.isShow.value
-    }
-  }
-
-  /**
-   * Updates the list of styles.
-   *
-   * Обновляет список стилей.
-   */
-  protected make() {
-    this.makeShow()
-    this.makeMain()
-    this.makeContext()
-  }
-
-  /**
-   * Updates the list of styles for the main element.
-   *
-   * Обновляет список стилей для главного элемента.
-   */
-  protected makeMain(): void {
-    const element = this.element.getElement()
-
-    if (element) {
-      const style = this.element.style
-
-      if (this.show.value) {
-        element.style.setProperty(style.top, this.size.top)
-        element.style.setProperty(style.left, this.size.left)
-        element.style.setProperty(style.height, this.size.height)
-        element.style.setProperty(style.scale, this.size.scale)
-        element.style.setProperty(style.headWidth, this.size.headWidth)
-        element.style.setProperty(style.headHeight, this.size.headHeight)
-        element.style.setProperty(style.headScale, this.size.headScale)
-        element.style.setProperty(style.bodyHeight, this.size.bodyHeight)
-      } else {
-        element.style.removeProperty(style.top)
-        element.style.removeProperty(style.left)
-        element.style.removeProperty(style.height)
-        element.style.removeProperty(style.scale)
-        element.style.removeProperty(style.headWidth)
-        element.style.removeProperty(style.headHeight)
-        element.style.removeProperty(style.headScale)
-        element.style.removeProperty(style.bodyHeight)
-      }
-    }
-  }
-
-  /**
-   * Updates the list of styles for the context element.
-   *
-   * Обновляет список стилей для элемента контекста.
-   */
-  protected makeContext(): void {
-    const context = this.element.getElementContext()
-
-    if (context) {
-      const style = this.element.style
-
-      if (
-        this.element.isWindow()
-        && this.isShow.value
-      ) {
-        context.style.setProperty(style.contextWidth, this.size.contextWidth)
-        context.style.setProperty(style.contextHeight, this.size.contextHeight)
-      } else {
-        context.style.removeProperty(style.contextWidth)
-        context.style.removeProperty(style.contextHeight)
-      }
-    }
-  }
-}

package/src/constructors/MotionTransform/basicTypes.ts

@@ -1,121 +0,0 @@
-import type { ComputedRef, Ref } from 'vue'
-import type { ConstrBind } from '@dxtmisha/functional'
-
-import type { MotionTransformEmits, MotionTransformExpose } from './types'
-import type { MotionTransformProps } from './props'
-
-/**
- * Options for MotionTransform events/
- * Опции для событий MotionTransform
- */
-export type MotionTransformEmitOptions = {
-  /** Source area type (head, body, top, script)/ Тип области источника (head, body, top, script) */
-  type: 'head' | 'body' | 'top' | 'script'
-  /** Open state after transform/ Состояние открытия после трансформации */
-  open: boolean
-}
-
-/**
- * List of CSS classes for MotionTransform styling/
- * Список CSS классов для стилизации MotionTransform
- */
-export type MotionTransformClassList = {
-  /** Show state class/ Класс состояния видимости */
-  show: string
-  /** Open state class/ Класс состояния открытия */
-  open: string
-  /** Window mode class/ Класс режима окна */
-  window: string
-
-  /** Click feedback class/ Класс отклика на клик */
-  click: string
-  /** Ignore element class/ Класс игнорирования элемента */
-  none: string
-  /** Global ignore class/ Глобальный класс игнорирования */
-  noneGlobal: string
-  /** Close trigger class/ Класс триггера закрытия */
-  close: string
-}
-
-/**
- * Style variable names for MotionTransform layout/
- * Имена стилевых переменных для раскладки MotionTransform
- */
-export type MotionTransformStyle = {
-  /** Context width CSS var/ CSS‑переменная ширины контекста */
-  contextWidth: string
-  /** Context height CSS var/ CSS‑переменная высоты контекста */
-  contextHeight: string
-  /** Head scale CSS var/ CSS‑переменная масштаба заголовка */
-  headScale: string
-  /** Top position CSS var/ CSS‑переменная верхней позиции */
-  top: string
-  /** Left position CSS var/ CSS‑переменная левой позиции */
-  left: string
-  /** Head width CSS var/ CSS‑переменная ширины заголовка */
-  headWidth: string
-  /** Height CSS var/ CSS‑переменная высоты */
-  height: string
-  /** Scale CSS var/ CSS‑переменная масштаба */
-  scale: string
-  /** Head height CSS var/ CSS‑переменная высоты заголовка */
-  headHeight: string
-  /** Body height CSS var/ CSS‑переменная высоты тела */
-  bodyHeight: string
-}
-
-/**
- * Slot props passed to head/body slots/
- * Параметры слота, передаваемые в head/body
- */
-export type MotionTransformControlItem = {
-  /** Reactive open state/ Реактивное состояние открытия */
-  isOpen: ComputedRef<boolean>
-  /** Visible or preparing to show/ Видим либо готовится к показу */
-  isShow: ComputedRef<boolean>
-  /** Helper CSS classes/ Вспомогательные CSS‑классы */
-  classes: MotionTransformClassList
-}
-
-/**
- * Component map for including MotionTransform/
- * Карта компонентов для подключения MotionTransform
- */
-export type MotionTransformComponentInclude = {
-  /** MotionTransform component key/ Ключ компонента MotionTransform */
-  motionTransform?: object
-}
-
-/**
- * Event map for MotionTransform include/
- * Карта событий для подключения MotionTransform
- */
-export type MotionTransformEmitsInclude = {
-  /** Transform event with native event and options/ Событие трансформации с нативным событием и опциями */
-  transform?: MotionTransformEmits['transform']
-  /** Lightweight transform event with options only/ Облегчённое событие трансформации только с опциями */
-  transformLite?: MotionTransformEmits['transformLite']
-}
-
-/**
- * Interface for MotionTransform expose inclusion/
- * Интерфейс для включения expose MotionTransform
- */
-export interface MotionTransformExposeInclude extends MotionTransformExpose {
-  motionTransformElement: Ref<ConstrBind<MotionTransformExpose> | undefined>
-}
-
-/**
- * Props used to include and configure MotionTransform/
- * Свойства для подключения и настройки MotionTransform
- */
-export interface MotionTransformPropsInclude {
-  /** Open state/ Состояние открытия */
-  open?: boolean
-  /** Click on head opens component/ Клик по заголовку открывает компонент */
-  clickOpen?: boolean
-  /** Auto close on outside click/ Авто‑закрытие при клике вне */
-  autoClose?: boolean
-  /** Additional attributes for MotionTransform/ Дополнительные атрибуты для MotionTransform */
-  motionTransformAttrs?: ConstrBind<MotionTransformProps>
-}

package/src/constructors/MotionTransform/index.ts

@@ -1,7 +0,0 @@
-export * from './MotionTransform'
-export * from './MotionTransformDesign'
-export * from './MotionTransformInclude'
-export * from './MotionTransformClassesInclude'
-export * from './props'
-export * from './types'
-export * from './basicTypes'

package/src/constructors/MotionTransform/properties.json

@@ -1,35 +0,0 @@
-{
-  "z-index": {
-    "_type": "var"
-  },
-  "background-full": {
-    "_type": "var"
-  },
-  "background-color": {
-    "_type": "var"
-  },
-  "box-shadow": {
-    "_type": "var"
-  },
-  "#context": {},
-  "#head": {},
-  "#body": {},
-  "#backdrop": {},
-  "#scrim": {},
-  "#clickNone": {},
-  "~section": {},
-  "~animationHeadPosition": {
-    "~top": {},
-    "~toBottom": {},
-    "_default": "top"
-  },
-  "~adaptive": {
-    "~planeAlways": {
-      "content": "none"
-    },
-    "group|plane": {
-      "link|plane": "{??adaptive.planeAlways}",
-      "_type": "media-group"
-    }
-  }
-}

package/src/constructors/MotionTransform/props.ts

@@ -1,50 +0,0 @@
-interface MotionTransformPropsToken {
-  // :type [!] System label / Системная метка
-  section?: boolean
-  animationHeadPosition?: 'top' | 'toBottom'
-  adaptive?: 'planeAlways'
-  // :type [!] System label / Системная метка
-}
-
-export interface MotionTransformPropsBasic {
-  // Status
-  'open'?: boolean
-
-  // Value
-  'ignore'?: HTMLElement | string
-  'ignoreSelector'?: string
-
-  // Style
-  'clickOpen'?: boolean
-  'autoClose'?: boolean
-  'animationShow'?: boolean
-
-  // Event
-  'modelOpen'?: boolean
-  'onUpdate:open'?: (value: boolean) => void
-  'onUpdate:modelOpen'?: (value: boolean) => void
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface MotionTransformProps extends MotionTransformPropsBasic, MotionTransformPropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsMotionTransform = {
-  clickOpen: true,
-  autoClose: true,
-  animationShow: true,
-  ...{
-    // :default [!] System label / Системная метка
-    animationHeadPosition: 'top'
-    // :default [!] System label / Системная метка
-  }
-}

package/src/constructors/MotionTransform/types.ts

@@ -1,86 +0,0 @@
-import type { ComputedRef, Ref } from 'vue'
-import type { ConstrClass } from '@dxtmisha/functional'
-
-import type { MotionTransformControlItem, MotionTransformEmitOptions } from './basicTypes'
-
-/**
- * Interface for describing which components need to be connected for work.
- *
- * Интерфейс для описания, какие компоненты надо подключить для работы.
- */
-export type MotionTransformComponents = {}
-
-/**
- * Type describing available events.
- *
- * Тип, описывающий доступные события.
- */
-export type MotionTransformEmits = {
-  'transform': [
-    event: Event | undefined,
-    options: MotionTransformEmitOptions
-  ]
-  'transformLite': [
-    options: MotionTransformEmitOptions
-  ]
-
-  'update:open': [value: boolean]
-  'update:modelOpen': [value: boolean]
-}
-
-/**
- * Type describing available properties.
- *
- * Тип, описывающий доступные свойства.
- */
-export interface MotionTransformExpose {
-  /** Reactive state of window visibility/ Реактивное состояние видимости окна */
-  open: Ref<boolean>
-
-  /**
-   * Computed state indicating if component is shown or being prepared for display/
-   * Вычисляемое состояние, указывающее отображается ли компонент или готовится к отображению
-   */
-  isShow: ComputedRef<boolean>
-
-  /** Sets open state/ Устанавливает состояние открытия */
-  setOpen(open: boolean): void
-
-  /** Transition to opening state/ Переход в состояние открытия */
-  toOpen(): void
-
-  /** Transition to closing state/ Переход в состояние закрытия */
-  toClose(): void
-
-  /** Toggles open state/ Переключает состояние открытия */
-  toggle(): void
-}
-
-/**
- * Type describing available slots.
- *
- * Тип, описывающий доступные слоты.
- */
-export interface MotionTransformSlots {
-  /** Head slot for controls/ Слот шапки для элементов управления */
-  head? (props: MotionTransformControlItem): any
-  /** Body slot for content/ Слот тела для содержимого */
-  body? (props: MotionTransformControlItem): any
-}
-
-/**
- * Type describing subclasses.
- *
- * Тип, описывающий подклассы.
- */
-export type MotionTransformClasses = {
-  main: ConstrClass
-  // :classes [!] System label / Системная метка
-  context: string
-  head: string
-  body: string
-  backdrop: string
-  scrim: string
-  clickNone: string
-  // :classes [!] System label / Системная метка
-}