@dxtmisha/constructor 0.30.1 → 0.39.3

package/src/constructors/Mask/MaskView.ts

@@ -1,169 +0,0 @@
-import { computed } from 'vue'
-
-import { MaskType } from './MaskType'
-import { MaskDate } from './MaskDate'
-import { MaskFormat } from './MaskFormat'
-import { MaskSpecial } from './MaskSpecial'
-import { MaskRubber } from './MaskRubber'
-import { MaskItem } from './MaskItem'
-import { MaskValueBasic } from './MaskValueBasic'
-import { MaskValidation } from './MaskValidation'
-
-import { MASK_CHAR_DELETE, type MaskViewList, MASK_VIEW_DEFAULT } from './basicTypes'
-import type { MaskProps } from './props'
-
-/**
- * Class for working with data to output to the screen.
- *
- * Класс для работы с данными для вывода на экран.
- */
-export class MaskView {
-  /** Class name prefix for item/ Класс для элемента */
-  protected classNameItem: string
-
-  /**
-   * Constructor
-   * @param props input data/ входные данные
-   * @param type object for working with the mask type/ объект для работы с типом маски
-   * @param date object for working with date types/ объект для работы с типом даты
-   * @param format object for managing numeric mask types/ объект для управления числовыми типами масок
-   * @param special object for working with special characters/ объект для работы со специальными символами
-   * @param rubber object for working with rubber types/ объект для работы с резиновыми типами
-   * @param mask object for managing masks/ объект управления маской
-   * @param valueBasic object for working with base values/ объект для работы с базовыми значениями
-   * @param validation object for working with validation/ объект для работы с валидацией
-   * @param className define class names for each symbol/ определить название класса для каждого символа
-   */
-  constructor(
-    protected readonly props: MaskProps,
-    protected readonly type: MaskType,
-    protected readonly date: MaskDate,
-    protected readonly format: MaskFormat,
-    protected readonly special: MaskSpecial,
-    protected readonly rubber: MaskRubber,
-    protected readonly mask: MaskItem,
-    protected readonly valueBasic: MaskValueBasic,
-    protected readonly validation: MaskValidation,
-    className: string
-  ) {
-    this.classNameItem = `${className}__character__item`
-  }
-
-  /** View items list/ Список данных для отображения */
-  readonly item = computed<MaskViewList>(() => {
-    const data: MaskViewList = []
-    const valueBasic = this.valueBasic.item.value
-
-    this.mask.item.value.forEach((char, index) => {
-      const value = valueBasic?.[index]
-
-      data.push({
-        className: `${this.classNameItem} ${this.classNameItem}--${this.getStatus(char, value)}`,
-        value: this.getValue(char, value)
-      })
-    })
-
-    return data
-  })
-
-  /** Input value with special view characters/ Значение ввода со спецсимволами отображения */
-  readonly input = computed<string>(() => {
-    const value: string[] = []
-    const list = this.mask.item.value
-
-    this.valueBasic.item.value.split('').forEach((char, index) => {
-      if (char === MASK_CHAR_DELETE) {
-        value.push(
-          this.getSpecialToView(list?.[index] ?? '') ?? char
-        )
-      } else {
-        value.push(char)
-      }
-    })
-
-    return value.join('')
-  })
-
-  /**
-   * Checks if the value is filled in.
-   *
-   * Проверяет, заполнено ли значение.
-   * @param value checked value/ проверяемое значение
-   */
-  protected isValue(value?: string): value is string {
-    return Boolean(value && value !== MASK_CHAR_DELETE)
-  }
-
-  /**
-   * Returns the status by mask symbol and its position.
-   *
-   * Возвращает статус по символу маски и месту его расположения.
-   * @param char mask symbol/ символ маски
-   * @param value entered value for this position/ введённое значение для позиции
-   */
-  protected getStatus(char: string, value?: string): string {
-    if (this.isValue(value)) {
-      if (!this.special.isSpecial(char)) {
-        return 'standard'
-      }
-
-      if (this.validation.isError(char)) {
-        return 'error'
-      }
-
-      return 'special'
-    }
-
-    if (this.rubber.isTransition(char)) {
-      return 'transition'
-    }
-
-    return 'placeholder'
-  }
-
-  /**
-   * Returns symbol for rendering: real value or placeholder.
-   *
-   * Возвращает символ для отображения: реальное значение или плейсхолдер.
-   * @param char mask symbol/ символ маски
-   * @param value entered value for position/ введённое значение позиции
-   */
-  protected getValue(char: string, value?: string): string {
-    return this.isValue(value) ? value : this.getSpecialToView(char)
-  }
-
-  /**
-   * Returns display version of special mask symbol (placeholder).
-   *
-   * Возвращает отображаемую версию специального символа маски (плейсхолдер).
-   * @param char mask symbol/ символ маски
-   */
-  protected getSpecialToView(char: string): string {
-    if (this.special.isSpecial(char)) {
-      return this.getViewChar(char)
-        ?? this.special.getView(char)
-        ?? this.props.view
-        ?? MASK_VIEW_DEFAULT
-    }
-
-    return char
-  }
-
-  /**
-   * Returns special character for view by its group name.
-   *
-   * Возвращает специальный символ для отображения по имени группы.
-   * @param groupName group name/ имя группы
-   */
-  protected getViewChar(groupName: string): string | undefined {
-    if (this.type.isDate()) {
-      return this.date.getView(groupName)
-    }
-
-    if (this.type.isCurrencyOrNumber()) {
-      return this.format.view.value
-    }
-
-    return undefined
-  }
-}

package/src/constructors/Mask/basicTypes.ts

@@ -1,67 +0,0 @@
-import type { ConstrBind, GeoDate } from '@dxtmisha/functional'
-import type { FieldPatternItemOrFunction, FieldValidationItem } from '../../types/fieldTypes'
-import type { MaskPropsBasic } from './props'
-
-export type MaskTypeItem = GeoDate
-  | 'text'
-  | 'number'
-  | 'number-format'
-  | 'currency'
-
-export type MaskElementInput = HTMLInputElement | undefined
-export type MaskMatchItem = RegExp | string
-export type MaskFractionItem = string | boolean | number
-
-export type MaskSpecialItem = {
-  defaultValue?: string
-  rubber?: boolean
-  transitionChar?: string | string[]
-  minLength?: number
-  maxLength?: number
-  match?: MaskMatchItem
-  pattern?: FieldPatternItemOrFunction
-  view?: string
-}
-export type MaskSpecialInfo = {
-  index: number
-  key: number
-  char: string
-}
-export type MaskSpecialList = Record<string, MaskSpecialItem>
-export type MaskSpecialProp = string | string[] | MaskSpecialList
-
-export type MaskViewItem = {
-  className: string
-  value: string
-}
-export type MaskViewList = MaskViewItem[]
-
-export type MaskList = string | string[]
-
-export type MaskEventData = FieldValidationItem
-export type MaskEventSelection = {
-  target: HTMLInputElement
-  start: number
-  end: number
-  length: number
-}
-
-export type MaskComponentInclude = {
-  mask?: object
-}
-
-export type MaskPropsInclude<
-  Mask extends MaskPropsBasic = MaskPropsBasic
-> = {
-  name?: string
-  mask?: string | ConstrBind<Mask>
-  maskVisible?: boolean
-  maskNone?: boolean
-  currency?: string
-  currencyHide?: boolean
-  fraction?: MaskFractionItem
-  maskAttrs?: ConstrBind<Mask>
-}
-
-export const MASK_CHAR_DELETE = '~'
-export const MASK_VIEW_DEFAULT = '_'

package/src/constructors/Mask/index.ts

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

package/src/constructors/Mask/properties.json

@@ -1,30 +0,0 @@
-{
-  "color": {
-    "_type": "var"
-  },
-  "color-opacity": {
-    "_type": "var"
-  },
-  "caret-opacity": {
-    "_type": "var"
-  },
-  "#input": {},
-  "#character": {
-    "#item": {
-      "~placeholder": {}
-    }
-  },
-  "~visible": {
-    "_default": true
-  },
-  "~visiblePartly": {},
-  "~align": {
-    "~center": {},
-    "~left": {},
-    "~right": {}
-  },
-  "~dir": {
-    "~ltr": {},
-    "~rtl": {}
-  }
-}

package/src/constructors/Mask/props.ts

@@ -1,70 +0,0 @@
-import type { FieldPatternItemOrFunction } from '../../types/fieldTypes'
-import type {
-  MaskFractionItem,
-  MaskList,
-  MaskMatchItem,
-  MaskSpecialProp,
-  MaskTypeItem
-} from './basicTypes'
-
-interface MaskPropsToken {
-  // :type [!] System label / Системная метка
-  visible?: boolean
-  visiblePartly?: boolean
-  align?: 'center' | 'left' | 'right'
-  dir?: 'ltr' | 'rtl'
-  // :type [!] System label / Системная метка
-}
-
-export interface MaskPropsBasic {
-  // Value
-  name?: string
-  value?: string | number
-  valueDefault?: string | number
-  currency?: string
-  currencyHide?: boolean
-  fullOnly?: boolean
-
-  mask?: MaskList
-  special?: MaskSpecialProp
-  match?: MaskMatchItem
-  groupSave?: boolean
-
-  pattern?: FieldPatternItemOrFunction
-  check?: FieldPatternItemOrFunction
-  fraction?: MaskFractionItem
-
-  // Style
-  type?: MaskTypeItem
-  view?: string
-
-  inputAttrs?: Partial<HTMLInputElement>
-
-  language?: string
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface MaskProps extends MaskPropsBasic, MaskPropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsMask = {
-  special: '*',
-  match: /[0-9]/,
-  type: 'text',
-  groupSave: true,
-  view: '_',
-  ...{
-    // :default [!] System label / Системная метка
-    visible: true
-    // :default [!] System label / Системная метка
-  }
-}

package/src/constructors/Mask/types.ts

@@ -1,71 +0,0 @@
-import type { ComputedRef } from 'vue'
-import type { ConstrClass } from '@dxtmisha/functional'
-import type { FieldValidationItem } from '../../types/fieldTypes'
-
-/**
- * Interface for describing which components need to be connected for work.
- *
- * Интерфейс для описания, какие компоненты надо подключить для работы.
- */
-export type MaskComponents = {}
-
-/**
- * Type describing available events.
- *
- * Тип, описывающий доступные события.
- */
-export type MaskEmits = {
-  focus: [event: FocusEvent]
-  blur: [event: FocusEvent]
-  keydown: [event: KeyboardEvent]
-  keyup: [event: KeyboardEvent]
-  beforeinput: [event: InputEvent]
-  input: [
-    event: InputEvent,
-    value: FieldValidationItem
-  ]
-  inputLite: [value: FieldValidationItem]
-  change: [
-    event: InputEvent,
-    value: FieldValidationItem
-  ]
-  changeLite: [value: FieldValidationItem]
-  paste: [event: ClipboardEvent]
-  reset: [event: Event]
-}
-
-/**
- * Type describing available properties.
- *
- * Тип, описывающий доступные свойства.
- */
-export interface MaskExpose {
-  valueBasic: ComputedRef<string>
-  value: ComputedRef<string>
-
-  setValue(value: string): boolean
-
-  clear(): boolean
-}
-
-/**
- * Type describing available slots.
- *
- * Тип, описывающий доступные слоты.
- */
-export interface MaskSlots {
-}
-
-/**
- * Type describing subclasses.
- *
- * Тип, описывающий подклассы.
- */
-export type MaskClasses = {
-  main: ConstrClass
-  // :classes [!] System label / Системная метка
-  input: string
-  character: string
-  characterItem: string
-  // :classes [!] System label / Системная метка
-}

package/src/constructors/Menu/Menu.ts

@@ -1,191 +0,0 @@
-import { computed, type Ref, type ToRefs } from 'vue'
-import { type ConstrEmit, DesignComp, ListDataRef } from '@dxtmisha/functional'
-
-import { EventClickInclude } from '../../classes/EventClickInclude'
-
-import { BarsInclude } from '../Bars'
-import { WindowInclude } from '../Window'
-
-import { MenuRequest } from './MenuRequest'
-import { MenuSearch } from './MenuSearch'
-
-import { MenuWindow } from './MenuWindow'
-import { MenuValue } from './MenuValue'
-import { MenuGo } from './MenuGo'
-
-import type { MenuComponents, MenuEmits, MenuSlots } from './types'
-import type { MenuProps } from './props'
-import type { MenuControlBasic } from './basicTypes'
-import type { ListPropsBasic } from '../List'
-import type { EventClickValue } from '../../types/eventClickTypes'
-
-/**
- * Menu
- */
-export class Menu {
-  /** Request handler for list data/ Обработчик запросов данных списка */
-  readonly request: MenuRequest
-  /** Search helper for menu filtering/ Вспомогательный класс поиска для фильтрации меню */
-  readonly search: MenuSearch
-  /** Value manager for selected handling/ Менеджер выбранного значения */
-  readonly value: MenuValue
-
-  /** Data manager for list selection and mapping/ Менеджер данных списка для выбора и сопоставления */
-  readonly data: ListDataRef
-  readonly go: MenuGo
-
-  /** Include for working with the Bars component/ Подключение для работы с компонентом Bars */
-  readonly bars: BarsInclude
-  /** Include for working with the Window component/ Подключение для работы с компонентом Window */
-  readonly window: WindowInclude
-
-  /** Window manager for Menu/ Класс управления окном Menu */
-  readonly menuWindow: MenuWindow
-
-  /** Click event helper to unify click emissions/ Вспомогательный класс кликов для унифицированной отправки событий */
-  readonly event: EventClickInclude
-
-  /** Data for binding to controls/ Данные для привязки к контролам */
-  readonly slotData: MenuControlBasic
-
-  /**
-   * 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: MenuProps,
-    protected readonly refs: ToRefs<MenuProps>,
-    protected readonly element: Ref<HTMLElement | undefined>,
-    protected readonly classDesign: string,
-    protected readonly className: string,
-    protected readonly components?: DesignComp<MenuComponents, MenuProps>,
-    protected readonly slots?: MenuSlots,
-    protected readonly emits?: ConstrEmit<MenuEmits>
-  ) {
-    this.request = new MenuRequest(this.props)
-    this.search = new MenuSearch(this.props)
-    this.value = new MenuValue(this.props, this.refs, this.emits)
-
-    this.data = new ListDataRef(
-      this.request.item,
-      undefined,
-      undefined,
-      undefined,
-      undefined,
-      this.value.selected,
-      this.refs.keyValue,
-      this.refs.keyLabel
-    )
-    this.go = new MenuGo(this.props, this.value, this.data)
-
-    this.bars = new BarsInclude(
-      this.props,
-      this.className,
-      this.components,
-      this.emits
-    )
-
-    this.menuWindow = new MenuWindow(this.props, this.request)
-    this.window = new WindowInclude(
-      this.props,
-      this.className,
-      this.components,
-      this.emits,
-      this.menuWindow.getExtra()
-    )
-
-    this.event = new EventClickInclude(undefined, undefined, this.emits)
-
-    this.slotData = {
-      loading: this.request.progress,
-
-      isSelected: this.data.isSelected,
-      selectedList: this.data.selectedList,
-      selectedNames: this.data.selectedNames,
-      selectedValues: this.data.selectedValues,
-
-      previous: this.go.previous,
-      next: this.go.next
-    }
-  }
-
-  /**
-   * Getting data for binding to the List component.
-   *
-   * Получение данных для привязки к компоненту List.
-   */
-  readonly binds = computed<ListPropsBasic>(() => {
-    return {
-      filterMode: this.props.filterMode,
-
-      liteThreshold: this.props.liteThreshold,
-      keyLabel: this.props.keyLabel,
-      keyValue: this.props.keyValue,
-      max: this.props.max,
-
-      tag: this.props.tag,
-      onClick: this.onClick,
-      onClose: this.window.expose.toClose,
-
-      itemAttrs: this.props.itemAttrs,
-
-      control: true
-    }
-  })
-
-  /**
-   * Getting data for binding to controls.
-   *
-   * Получение данных для привязки к контролам.
-   * @returns data for binding to controls/ данные для привязки к контролам
-   */
-  getControlBinds(): MenuControlBasic {
-    return this.slotData
-  }
-
-  /**
-   * Click handler.
-   *
-   * Обработчик клика.
-   * @param event event object/ объект события
-   * @param options data object/ объект с данными
-   */
-  readonly onClick = (
-    event: MouseEvent,
-    options?: EventClickValue
-  ): void => {
-    if (
-      options
-      && 'value' in options
-    ) {
-      this.value.setValue(options.value)
-    }
-
-    this.event.onClick(event, options)
-  }
-
-  /**
-   * Click on the slot handler.
-   *
-   * Обработчик клика по слоту.
-   * @param event event object/ объект события
-   */
-  readonly onClickSlot = (event: Event) => {
-    const element = event.target as HTMLElement
-    const item = element.closest<HTMLElement>('*[data-value]')
-
-    if (
-      item
-      && !element.closest(`.${this.className}__list`)
-    ) {
-      this.emits?.('clickSlot', item.dataset.value)
-    }
-  }
-}