@dxtmisha/constructor 0.23.0 → 0.39.3

package/src/constructors/Image/basicTypes.ts

@@ -1,70 +0,0 @@
-import type { ConstrBind, Undefined } from '@dxtmisha/functional'
-import type { ImageEmits } from './types'
-import type { ImagePropsBasic } from './props'
-
-export enum ImageTypeValue {
-  pdf = 'pdf',
-  file = 'file',
-  image = 'image',
-  flag = 'flag',
-  color = 'color',
-  public = 'public',
-  filled = 'filled',
-  outlined = 'outlined',
-  round = 'round',
-  sharp = 'sharp',
-  twoTone = 'two-tone',
-  material = 'material',
-  icon = 'icon'
-}
-
-export type ImageElement = HTMLElement | undefined
-
-export type ImageCoordinatorItem
-  = [number]
-    | [number, number]
-    | [number, number, number]
-    | [number, number, number, number]
-    | Undefined
-
-export type ImageSize<T = number> = {
-  width: T
-  height: T
-}
-
-/**
- * Parameters for the uploaded image or the one available by a direct link.
- *
- * Параметры для загруженного изображения или доступного по прямой ссылке.
- */
-export type ImageItem
-  = ImageSize
-    & {
-      image: HTMLImageElement
-      src: string
-    }
-
-export type ImageTypeItem = ImageTypeValue | Undefined
-
-export type ImageEventItem = ImageItem | string | undefined
-export type ImageEventType = {
-  type: ImageTypeItem
-}
-export type ImageEventData
-  = ImageEventType
-    & {
-      image: ImageEventItem
-    }
-
-export type ImageValue<
-  Image extends ImagePropsBasic = ImagePropsBasic
-> = string | ConstrBind<Image> | null
-
-export type ImageComponentsInclude = {
-  image: object
-}
-export type ImageEmitsInclude = ImageEmits
-
-export interface ImagePropsInclude<Image extends ImagePropsBasic = ImagePropsBasic> {
-  image?: string | ConstrBind<Image>
-}

package/src/constructors/Image/index.ts

@@ -1,5 +0,0 @@
-export * from './Image'
-export * from './ImageDesign'
-export * from './basicTypes'
-export * from './props'
-export * from './types'

package/src/constructors/Image/properties.json

@@ -1,17 +0,0 @@
-{
-  "color": {
-    "_type": "var"
-  },
-  "color-opacity": {
-    "_type": "var"
-  },
-  "~turn": {},
-  "~disabled": {},
-  "~hide": {},
-  "~adaptive": {},
-  "~size": {
-    "~auto": {},
-    "~contain": {},
-    "~cover": {}
-  }
-}

package/src/constructors/Image/props.ts

@@ -1,66 +0,0 @@
-interface ImagePropsToken {
-  // :type [!] System label / Системная метка
-  turn?: boolean
-  disabled?: boolean
-  hide?: boolean
-  adaptive?: boolean
-  size?: 'auto' | 'contain' | 'cover'
-  // :type [!] System label / Системная метка
-}
-
-export interface ImagePropsBasic {
-  // Value
-  /**
-   * Accepts icon name, image URL, File object or PDF link/
-   * Принимает название иконки, ссылку на изображение, объект File или ссылку на PDF файл
-   */
-  value?: string | any
-
-  /** Image URL/ URL изображения */
-  url?: string
-
-  // Adaptive
-  /**
-   * Adaptive group (e.g. for different resolutions)/
-   * Группа адаптивности (например, для разных разрешений)
-   */
-  adaptiveGroup?: string
-  /** Always use adaptivity/ Всегда использовать адаптивность */
-  adaptiveAlways?: boolean
-  /** Image object width/ Ширина объекта изображения */
-  objectWidth?: string | number
-  /** Image object height/ Высота объекта изображения */
-  objectHeight?: string | number
-
-  // Style
-  /**
-   * Image coordinates (e.g. for cropping or positioning)/
-   * Координаты изображения (например, для обрезки или позиционирования)
-   */
-  coordinator?: number[] | any
-  /** X position/ Позиция по оси X */
-  x?: string | number
-  /** Y position/ Позиция по оси Y */
-  y?: string | number
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface ImageProps extends ImagePropsBasic, ImagePropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsImage = {
-  adaptiveGroup: 'basic',
-  ...{
-    // :default [!] System label / Системная метка
-    // :default [!] System label / Системная метка
-  }
-}

package/src/constructors/List/List.ts

@@ -1,267 +0,0 @@
-import { toRef, type Ref, type ToRefs, computed } from 'vue'
-import {
-  type ConstrBind,
-  type ConstrEmit,
-  DesignComp,
-  ListData,
-  type ListDataItem,
-  type ListList,
-  toBinds
-} from '@dxtmisha/functional'
-
-import { EventClickInclude } from '../../classes/EventClickInclude'
-
-import { WindowClassesInclude } from '../Window'
-
-import { ListSearch } from './ListSearch'
-import { ListFocus } from './ListFocus'
-import { ListGo } from './ListGo'
-import { ListControl } from './ListControl'
-
-import type { ListComponents, ListEmits, ListSlots } from './types'
-import type { ListProps } from './props'
-import type { IconValue } from '../Icon'
-
-/** Maximum number of lists/ Максимальное количество списков */
-let listIdMax = 1
-
-/**
- * List
- */
-export class List {
-  readonly search: ListSearch
-  readonly focus: ListFocus
-
-  readonly data: ListData
-  readonly event: EventClickInclude
-
-  readonly go: ListGo
-  readonly control: ListControl
-
-  readonly windowClasses: WindowClassesInclude
-
-  /** Unique list identifier/ Уникальный идентификатор списка */
-  protected readonly id: number = ++listIdMax
-
-  /**
-   * Constructor
-   * @param props input data/ входные данные
-   * @param refs input data in the form of reactive elements/ входные данные в виде реактивных элементов
-   * @param element input element/ элемент ввода
-   * @param classDesign design name/ название дизайна
-   * @param className class name/ название класса
-   * @param components object for working with components/ объект для работы с компонентами
-   * @param slots object for working with slots/ объект для работы со слотами
-   * @param emits the function is called when an event is triggered/ функция вызывается, когда срабатывает событие
-   */
-  constructor(
-    protected readonly props: ListProps,
-    protected readonly refs: ToRefs<ListProps>,
-    protected readonly element: Ref<HTMLElement | undefined>,
-    protected readonly classDesign: string,
-    protected readonly className: string,
-    protected readonly components?: DesignComp<ListComponents, ListProps>,
-    protected readonly slots?: ListSlots,
-    protected readonly emits?: ConstrEmit<ListEmits>
-  ) {
-    this.search = new ListSearch(this.props)
-    this.focus = new ListFocus(this.props, this.element, this.id)
-
-    this.data = new ListData(
-      toRef(this.props, 'list'),
-      this.focus.focus,
-      this.search.highlight,
-      this.refs.highlightLengthStart,
-      this.refs.selected,
-      this.refs.keyValue,
-      this.refs.keyLabel,
-      this.refs.liteThreshold
-    )
-
-    this.go = new ListGo(this.props, this.focus, this.data, this.emits)
-    this.control = new ListControl(this.props, this.search, this.data, this.go)
-
-    this.event = new EventClickInclude(undefined, undefined, emits)
-    this.windowClasses = new WindowClassesInclude(classDesign)
-  }
-
-  /**
-   * Computed list data
-   *
-   * Вычисляемые данные списка
-   * */
-  readonly list = computed<ListList>(() => {
-    if (this.props.lite) {
-      return this.data.liteData.value
-    }
-
-    return this.data.fullData.value
-  })
-
-  /**
-   * Computed binding properties for list items/
-   * Вычисляемые привязочные свойства для элементов списка
-   * */
-  protected readonly itemBinds = computed(() => {
-    return {
-      tag: this.props.tag,
-      divider: this.props.divider,
-      onClick: this.event.onClick,
-      ...(this.props.itemAttrs ?? {}),
-      listId: this.id
-    }
-  })
-
-  /**
-   * Returns information about the opening status of a group item.
-   *
-   * Возвращает информацию о статусе открытия группового элемента.
-   * @param item List item data/ данные элемента списка
-   */
-  isOpenGroup(
-    item: ConstrBind<ListDataItem>
-  ): boolean {
-    const data = this.data.getSubList(item)
-
-    return data.isSelected.value
-      || data.isFocus()
-      || data.isHighlight()
-  }
-
-  /**
-   * Gets binding properties for a list item
-   *
-   * Получает привязочные свойства для элемента списка
-   * @param item List item data/ данные элемента списка
-   */
-  getItem(
-    item: ConstrBind<ListDataItem>
-  ) {
-    return toBinds(
-      this.itemBinds.value,
-      item,
-      { key: item.value }
-    )
-  }
-
-  /**
-   * Gets binding properties for a group item in the list
-   *
-   * Получает привязочные свойства для группового элемента в списке
-   * @param item List item data/ данные элемента списка
-   */
-  getItemGroup(
-    item: ConstrBind<ListDataItem>
-  ) {
-    return toBinds(
-      this.itemBinds.value,
-      this.props.itemGroupAttrs,
-      item,
-      {
-        key: item.value,
-        class: `${this.className}__group`
-      }
-    )
-  }
-
-  /**
-   * Gets binding properties for a menu item in the list
-   *
-   * Получает привязочные свойства для элемента меню в списке
-   * @param item List item data/ данные элемента списка
-   */
-  getItemMenu(
-    item: ConstrBind<ListDataItem>
-  ) {
-    return toBinds(
-      this.itemBinds.value,
-      this.props.itemMenuAttrs,
-      item,
-      {
-        key: item.value,
-        class: `${this.className}__menu`
-      }
-    )
-  }
-
-  /**
-   * Gets binding properties for a group management item with down arrow
-   *
-   * Получает привязочные свойства для элемента управления группой со стрелкой вниз
-   * @param item List item data/ данные элемента списка
-   * @param open Whether the group is open/ открыта ли группа
-   */
-  getItemManagementFormGroup(
-    item: ConstrBind<ListDataItem>,
-    open: boolean
-  ): ConstrBind<ListDataItem> {
-    return this.getItemManagement(
-      item,
-      open,
-      this.props.iconArrowDown
-    )
-  }
-
-  /**
-   * Gets binding properties for a menu management item with right arrow
-   *
-   * Получает привязочные свойства для элемента управления меню со стрелкой вправо
-   * @param item List item data/ данные элемента списка
-   * @param open Whether the menu is open/ открыто ли меню
-   */
-  getItemManagementFormMenu(
-    item: ConstrBind<ListDataItem>,
-    open: boolean
-  ): ConstrBind<ListDataItem> {
-    return this.getItemManagement(
-      item,
-      open,
-      this.props.iconArrowRight
-    )
-  }
-
-  /**
-   * Returns a sublist for a group item.
-   *
-   * Возвращает подсписок для группового элемента.
-   * @param item List item data/ данные элемента списка
-   */
-  getList(
-    item: ConstrBind<ListDataItem>
-  ) {
-    return this.data.getSubList(item).fullData.value
-  }
-
-  /**
-   * Internal method to create management item binding properties
-   *
-   * Внутренний метод для создания привязочных свойств элемента управления
-   * @param item List item data/ данные элемента списка
-   * @param open Whether the item is open/ открыт ли элемент
-   * @param icon Icon to display/ иконка для отображения
-   */
-  protected getItemManagement(
-    item: ConstrBind<ListDataItem>,
-    open: boolean,
-    icon?: IconValue
-  ): ConstrBind<ListDataItem> {
-    return toBinds(
-      this.itemBinds.value,
-      this.props.itemManagementAttrs,
-      item,
-      {
-        'class': [
-          `${this.className}__management`,
-          this.windowClasses.get().static
-        ],
-        'focus': item?.index === this.focus.focus.value,
-        'selectedChild': this.isOpenGroup(item),
-        open,
-        'iconTurn': open,
-        'iconTrailing': icon,
-        'iconTrailingTurnOnly': true,
-        'data-status': open ? 'open' : 'close'
-      }
-    )
-  }
-}

package/src/constructors/List/ListControl.ts

@@ -1,194 +0,0 @@
-import { computed, onUnmounted, watch } from 'vue'
-import { EventItem, isDomRuntime, ListData } from '@dxtmisha/functional'
-
-import { ListSearch } from './ListSearch'
-import { ListGo } from './ListGo'
-
-import type { ListProps } from './props'
-
-/**
- * Class for managing keyboard navigation and event handling in list components.
- * Provides keyboard shortcuts, search functionality, and navigation controls.
- *
- * Класс для управления навигацией с клавиатуры и обработкой событий в компонентах списка.
- * Предоставляет клавиатурные сокращения, функциональность поиска и элементы управления навигацией.
- */
-export class ListControl {
-  protected event?: EventItem<HTMLElement, any>
-
-  /**
-   * Creates an instance of ListControl for managing keyboard navigation and events.
-   *
-   * Создает экземпляр ListControl для управления навигацией с клавиатуры и событиями.
-   * @param props input data/ входные данные
-   * @param search search functionality controller / контроллер функциональности поиска
-   * @param data list data manager / менеджер данных списка
-   * @param go navigation controller / контроллер навигации
-   */
-  constructor(
-    protected readonly props: ListProps,
-    protected readonly search: ListSearch,
-    protected readonly data: ListData,
-    protected readonly go: ListGo
-  ) {
-    watch(
-      this.isActive,
-      (status) => {
-        if (status) {
-          this.start()
-        } else {
-          this.stop()
-        }
-      },
-      { immediate: true }
-    )
-
-    onUnmounted(() => this.stop())
-  }
-
-  /**
-   * Checks if the menu is active.
-   *
-   * Проверяет, активное ли меню.
-   */
-  readonly isActive = computed<boolean>(() => {
-    return Boolean(this.props.control)
-  })
-
-  /**
-   * Checks if the event target is not an input.
-   *
-   * Проверяет, не является ли цель события input.
-   * @param target selected element/ выбранный элемент
-   */
-  protected isNotInput(target: HTMLElement): boolean {
-    return ['INPUT', 'TEXTAREA'].indexOf(target.nodeName) === -1
-      || Boolean(this.getActiveElement())
-  }
-
-  /**
-   * Gets the currently active input element with menu control.
-   *
-   * Получает текущий активный элемент input с управлением меню.
-   * @returns active input element or undefined / активный элемент input или undefined
-   */
-  protected getActiveElement(): HTMLInputElement | undefined {
-    if (isDomRuntime()) {
-      const element = document.activeElement as HTMLInputElement
-
-      if (
-        element
-        && element.dataset?.menuControl === '1'
-      ) {
-        return element
-      }
-    }
-
-    return undefined
-  }
-
-  /**
-   * Starts the event.
-   *
-   * Запускает событие.
-   */
-  protected start() {
-    if (isDomRuntime()) {
-      if (!this.event) {
-        this.event = new EventItem<HTMLElement, any>(
-          document.body,
-          ['keydown', 'keypress'],
-          this.on
-        )
-      }
-
-      this.go.reset()
-      this.event.start()
-    }
-  }
-
-  /**
-   * Stops the event.
-   *
-   * Останавливает событие.
-   */
-  protected stop() {
-    if (this.event) {
-      this.event.stop()
-      this.event = undefined
-      this.go.stop()
-    }
-  }
-
-  /**
-   * Updates the search value based on keyboard input.
-   *
-   * Обновляет значение поиска на основе ввода с клавиатуры.
-   * @param event keyboard event / событие клавиатуры
-   */
-  protected updateSearch(event: KeyboardEvent) {
-    const element = this.getActiveElement()
-
-    if (element) {
-      requestAnimationFrame(() => this.search.set(element.value))
-    } else {
-      this.search.add(event.key)
-    }
-  }
-
-  /**
-   * Method for tracking keys when a window is open.
-   *
-   * Метод для отслеживания нажатий при открытом окне.
-   * @param event event object/ объект события
-   */
-  protected readonly on = (event: KeyboardEvent) => {
-    if (
-      this.isNotInput(event.target as HTMLElement)
-      && this.data.getLength()
-    ) {
-      if (event.type === 'keypress') {
-        this.updateSearch(event)
-      } else {
-        const key = event.code || event.key || (event as any).keyCode
-
-        switch (key) {
-          case 'Backspace':
-          case 8:
-            this.updateSearch(event)
-            break
-          case 'ArrowUp':
-          case 38:
-            event.preventDefault()
-            this.go.previous()
-            break
-          case 'ArrowDown':
-          case 40:
-            event.preventDefault()
-            this.go.next()
-            break
-          case 'Enter':
-          case 'ArrowRight':
-          case ' ':
-          case 13:
-          case 39:
-            event.preventDefault()
-            this.go.open()
-            break
-          case 'ArrowLeft':
-          case 37:
-            event.preventDefault()
-            this.go.close()
-            break
-          case 'Space':
-          case 32:
-            if (!this.getActiveElement()) {
-              event.preventDefault()
-              this.go.open()
-            }
-            break
-        }
-      }
-    }
-  }
-}