@dxtmisha/constructor 0.30.1 → 0.39.3

package/src/constructors/Section/SectionDesign.tsx

@@ -1,127 +0,0 @@
-import { h, type VNode } from 'vue'
-import {
-  type ConstrOptions,
-  type ConstrStyles,
-  DesignConstructorAbstract
-} from '@dxtmisha/functional'
-
-import { Section } from './Section'
-
-import {
-  type SectionPropsBasic
-} from './props'
-import {
-  type SectionClasses,
-  type SectionComponents,
-  type SectionEmits,
-  type SectionExpose,
-  type SectionSlots
-} from './types'
-
-/**
- * SectionDesign
- */
-export class SectionDesign<
-  COMP extends SectionComponents,
-  EXPOSE extends SectionExpose,
-  CLASSES extends SectionClasses,
-  P extends SectionPropsBasic
-> extends DesignConstructorAbstract<
-    HTMLDivElement,
-    COMP,
-    SectionEmits,
-    EXPOSE,
-    SectionSlots,
-    CLASSES,
-    P
-  > {
-  protected readonly item: Section
-
-  /**
-   * Constructor
-   * @param name class name/ название класса
-   * @param props properties/ свойства
-   * @param options list of additional parameters/ список дополнительных параметров
-   */
-  constructor(
-    name: string,
-    props: Readonly<P>,
-    options?: ConstrOptions<COMP, SectionEmits, P>
-  ) {
-    super(
-      name,
-      props,
-      options
-    )
-
-    this.item = new Section(
-      this.props,
-      this.refs,
-      this.element,
-      this.getDesign(),
-      this.getName(),
-      this.components,
-      this.slots,
-      this.emits
-    )
-
-    // TODO: Method for initializing base objects
-    // TODO: Метод для инициализации базовых объектов
-
-    this.init()
-  }
-
-  /**
-   * Initialization of all the necessary properties for work
-   *
-   * Инициализация всех необходимых свойств для работы.
-   */
-  protected initExpose(): EXPOSE {
-    return {
-      // TODO: list of properties for export
-      // TODO: список свойств для экспорта
-    } as EXPOSE
-  }
-
-  /**
-   * Improvement of the obtained list of classes.
-   *
-   * Доработка полученного списка классов.
-   */
-  protected initClasses(): Partial<CLASSES> {
-    return {
-      main: {},
-      ...{
-        // :classes [!] System label / Системная метка
-        // :classes [!] System label / Системная метка
-      }
-    } as Partial<CLASSES>
-  }
-
-  /**
-   * Refinement of the received list of styles.
-   *
-   * Доработка полученного списка стилей.
-   */
-  protected initStyles(): ConstrStyles {
-    return {
-      // TODO: list of user styles
-      // TODO: список пользовательских стилей
-    }
-  }
-
-  /**
-   * A method for rendering.
-   *
-   * Метод для рендеринга.
-   */
-  protected initRender(): VNode {
-    // const children: any[] = []
-
-    return h('div', {
-      // ...this.getAttrs(),
-      ref: this.element,
-      class: this.classes?.value.main
-    })
-  }
-}

package/src/constructors/Section/index.ts

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

package/src/constructors/Section/properties.json

@@ -1,2 +0,0 @@
-{
-}

package/src/constructors/Section/props.ts

@@ -1,29 +0,0 @@
-interface SectionPropsToken {
-  // :type [!] System label / Системная метка
-  // :type [!] System label / Системная метка
-}
-
-export interface SectionPropsBasic {
-  // TODO: Location for a custom property / Место для пользовательского свойства
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface SectionProps extends SectionPropsBasic, SectionPropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsSection = {
-  // TODO: Location for a user-defined default value / Место для пользовательского значения по умолчанию
-  ...{
-    // :default [!] System label / Системная метка
-    // :default [!] System label / Системная метка
-  }
-}

package/src/constructors/Section/types.ts

@@ -1,47 +0,0 @@
-import type { ConstrClass } from '@dxtmisha/functional'
-
-/**
- * Interface for describing which components need to be connected for work.
- *
- * Интерфейс для описания, какие компоненты надо подключить для работы.
- */
-export type SectionComponents = {
-  // componentName: object
-}
-
-/**
- * Type describing available events.
- *
- * Тип, описывающий доступные события.
- */
-export type SectionEmits = {
-  // load: [value: string]
-}
-
-/**
- * Type describing available properties.
- *
- * Тип, описывающий доступные свойства.
- */
-export interface SectionExpose {
-}
-
-/**
- * Type describing available slots.
- *
- * Тип, описывающий доступные слоты.
- */
-export interface SectionSlots {
-  // default? (props: any): any
-}
-
-/**
- * Type describing subclasses.
- *
- * Тип, описывающий подклассы.
- */
-export type SectionClasses = {
-  main: ConstrClass
-  // :classes [!] System label / Системная метка
-  // :classes [!] System label / Системная метка
-}

package/src/constructors/Select/Select.ts

@@ -1,172 +0,0 @@
-import { computed, type Ref, type ToRefs } from 'vue'
-import { type ConstrEmit, DesignComp, executeFunction, isFilled } from '@dxtmisha/functional'
-
-import { FieldElementInclude } from '../../classes/field/FieldElementInclude'
-import { FieldChangeInclude } from '../../classes/field/FieldChangeInclude'
-import { FieldValueInclude } from '../../classes/field/FieldValueInclude'
-import { FieldCodeInclude } from '../../classes/field/FieldCodeInclude'
-import { FieldValidationInclude } from '../../classes/field/FieldValidationInclude'
-import { FieldAttributesInclude } from '../../classes/field/FieldAttributesInclude'
-import { FieldEventInclude } from '../../classes/field/FieldEventInclude'
-
-import { MenuInclude } from '../Menu'
-import { FieldInclude } from '../Field/FieldInclude'
-
-import { SelectInput } from './SelectInput'
-import { SelectFilter } from './SelectFilter'
-
-import type { SelectComponents, SelectEmits, SelectSlots } from './types'
-import type { SelectProps } from './props'
-import type { IconValue } from '../Icon'
-
-/**
- * Select
- */
-export class Select {
-  readonly attributes: FieldAttributesInclude
-
-  readonly elementItem: FieldElementInclude
-  readonly change: FieldChangeInclude
-
-  readonly value: FieldValueInclude
-
-  readonly code: FieldCodeInclude
-  readonly validation: FieldValidationInclude
-  readonly event: FieldEventInclude
-
-  readonly field: FieldInclude
-  readonly menu: MenuInclude
-  readonly input: SelectInput
-
-  readonly filter: SelectFilter
-
-  /**
-   * 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: SelectProps,
-    protected readonly refs: ToRefs<SelectProps>,
-    protected readonly element: Ref<HTMLElement | undefined>,
-    protected readonly classDesign: string,
-    protected readonly className: string,
-    protected readonly components?: DesignComp<SelectComponents, SelectProps>,
-    protected readonly slots?: SelectSlots,
-    protected readonly emits?: ConstrEmit<SelectEmits>
-  ) {
-    this.attributes = new FieldAttributesInclude(this.props)
-
-    this.change = new FieldChangeInclude(this.props)
-    this.elementItem = new FieldElementInclude(
-      this.props,
-      this.element
-    )
-
-    this.value = new FieldValueInclude(
-      this.props,
-      this.refs,
-      this.elementItem
-    )
-
-    this.code = new FieldCodeInclude(this.props)
-    this.validation = new FieldValidationInclude(
-      this.props,
-      this.attributes,
-      this.value,
-      this.change,
-      this.code
-    )
-    this.event = new FieldEventInclude(
-      this.props,
-      this.change,
-      this.value,
-      this.validation,
-      this.emits
-    )
-
-    this.field = new FieldInclude(
-      this.props,
-      this.value,
-      this.components,
-      this.event,
-      undefined,
-      undefined,
-      () => this.menu.getElement()?.toggle,
-      () => this.menu.getElement()?.next(),
-      () => this.menu.getElement()?.previous(),
-      computed(() => ({
-        iconTrailing: this.iconTrailing.value,
-        maxlength: this.props.max,
-        cancel: this.props.cancel ?? (this.props.multiple ? 'auto' : 'none')
-      }))
-    )
-    this.menu = new MenuInclude(
-      this.props,
-      this.className,
-      this.components,
-      computed(() => ({
-        windowAttrs: {
-          hide: !isFilled(props.option) && !this.isSlot.value,
-          widthMatch: true
-        },
-        tag: 'span',
-        barsLabel: props.label,
-        barsDescription: props.helperMessage,
-        disabled: props.disabled || props.readonly,
-        autoClose: !props.multiple,
-        list: executeFunction(props.option),
-        max: this.props.max,
-        filterMode: this.props.filterMode,
-        hideList: props.hideList,
-        onClick: this.event.onSelect,
-        onClickSlot: this.onClick,
-        onUpdateValue: this.isArrow() ? this.event.onValue : undefined,
-        isSelectedByValue: true,
-        roleItem: this.props.multiple ? 'menuitemcheckbox' : 'menuitemradio'
-      }))
-    )
-    this.input = new SelectInput(this.props, this.attributes, this.value, this.event)
-
-    this.filter = new SelectFilter()
-  }
-
-  /** Checks whether there are slots for context areas/ Проверяет, есть ли слоты для контекстных областей */
-  protected readonly isSlot = computed<boolean>(() => {
-    return Boolean(
-      this.slots?.contextTop
-      || this.slots?.contextBottom
-    )
-  })
-
-  /** Computes the trailing icon value/ Вычисляет значение иконки трейлинга */
-  protected readonly iconTrailing = computed<IconValue | undefined>(() => {
-    if (!this.props.disabled && !this.isArrow()) {
-      return this.props.iconTrailing ?? this.props.iconArrowDown
-    }
-
-    return undefined
-  })
-
-  /** Handles click on option in slot/ Обрабатывает клик по опции в слоте */
-  protected readonly onClick = (value?: string) => {
-    if (value) {
-      this.value.set(value)
-    }
-  }
-
-  /**
-   * Checks whether arrow is set.
-   *
-   * Проверяет, установлена ли стрелка.
-   */
-  protected isArrow(): boolean {
-    return Boolean(this.props.arrow) && this.props.arrow !== 'none'
-  }
-}

package/src/constructors/Select/SelectDesign.tsx

@@ -1,288 +0,0 @@
-import { h, type VNode } from 'vue'
-import {
-  type ConstrOptions,
-  type ConstrStyles,
-  DesignConstructorAbstract,
-  toBinds
-} from '@dxtmisha/functional'
-
-import { Select } from './Select'
-
-import type { MenuControlItem } from '../Menu'
-import type { FieldControl } from '../Field'
-import {
-  type SelectPropsBasic
-} from './props'
-import {
-  type SelectClasses,
-  type SelectComponents,
-  type SelectEmits,
-  type SelectExpose,
-  type SelectSlots
-} from './types'
-
-/**
- * SelectDesign
- */
-export class SelectDesign<
-  COMP extends SelectComponents,
-  EXPOSE extends SelectExpose,
-  CLASSES extends SelectClasses,
-  P extends SelectPropsBasic
-> extends DesignConstructorAbstract<
-    HTMLDivElement,
-    COMP,
-    SelectEmits,
-    EXPOSE,
-    SelectSlots,
-    CLASSES,
-    P
-  > {
-  protected readonly item: Select
-
-  /**
-   * Constructor
-   * @param name class name/ название класса
-   * @param props properties/ свойства
-   * @param options list of additional parameters/ список дополнительных параметров
-   */
-  constructor(
-    name: string,
-    props: Readonly<P>,
-    options?: ConstrOptions<COMP, SelectEmits, P>
-  ) {
-    super(
-      name,
-      props,
-      options
-    )
-
-    this.item = new Select(
-      this.props,
-      this.refs,
-      this.element,
-      this.getDesign(),
-      this.getName(),
-      this.components,
-      this.slots,
-      this.emits
-    )
-
-    this.init()
-  }
-
-  /**
-   * Initialization of all the necessary properties for work
-   *
-   * Инициализация всех необходимых свойств для работы.
-   */
-  protected initExpose(): EXPOSE {
-    return {
-      ...this.item.menu.expose,
-      value: this.item.value.item,
-      checkValidity: this.item.validation.checkValidity,
-      validationMessage: this.item.validation.message
-    } as EXPOSE
-  }
-
-  /**
-   * Improvement of the obtained list of classes.
-   *
-   * Доработка полученного списка классов.
-   */
-  protected initClasses(): Partial<CLASSES> {
-    return {
-      main: {},
-      ...{
-        // :classes [!] System label / Системная метка
-        input: this.getSubClass('input')
-        // :classes [!] System label / Системная метка
-      }
-    } as Partial<CLASSES>
-  }
-
-  /**
-   * Refinement of the received list of styles.
-   *
-   * Доработка полученного списка стилей.
-   */
-  protected initStyles(): ConstrStyles {
-    return {}
-  }
-
-  /**
-   * A method for rendering.
-   *
-   * Метод для рендеринга.
-   */
-  protected initRender(): VNode[] {
-    return this.item.field.render(
-      {
-        default: this.renderMenu
-      },
-      {
-        ...this.getAttrs(),
-        iconTurn: this.item.menu.expose.open.value,
-        class: this.classes?.value.main,
-        validationMessage: this.item.validation.message.value
-      }
-    )
-  }
-
-  /**
-   * Rendering the menu element.
-   *
-   * Рендер элемента меню.
-   * @param input data for the input element/ данные для элемента ввода
-   */
-  protected readonly renderMenu = (input: FieldControl): VNode[] => {
-    return this.item.menu.render(
-      {
-        control: (props: MenuControlItem) => this.renderMenuControl(input, props),
-        title: props => this.renderTitle(props),
-        footer: props => this.initSlot('footer', undefined, props),
-        contextTop: props => this.initSlot('contextTop', undefined, props),
-        contextBottom: props => this.initSlot('contextBottom', undefined, props)
-      },
-      {
-        selected: this.item.value.item.value,
-        highlight: this.item.filter.get()
-      }
-    )
-  }
-
-  /**
-   * Render menu control.
-   *
-   * Рендер элемента управления меню.
-   * @param input data for the input element/ данные для элемента ввода
-   * @param props data for the transferable property/ данные для передаваемого свойства
-   */
-  protected readonly renderMenuControl = (
-    input: FieldControl,
-    props: MenuControlItem
-  ): VNode | VNode[] => {
-    const children: any[] = []
-
-    if (!this.item.input.isEdit.value) {
-      children.push(this.renderMenuControlValue(input, props))
-    }
-
-    children.push(
-      this.renderMenuControlInput(input, props)
-    )
-
-    return children
-  }
-
-  /**
-   * Render input element.
-   *
-   * Рендер элемента ввода.
-   * @param input data for the input element/ данные для элемента ввода
-   * @param props data for the transferable property/ данные для передаваемого свойства
-   */
-  protected readonly renderMenuControlInput = (
-    input: FieldControl,
-    props: MenuControlItem
-  ): VNode => {
-    const isEdit = this.item.input.isEdit.value
-    const className = isEdit ? input.className : input.classForFocus
-    const menuControl = {
-    }
-
-    return h(
-      'input',
-      toBinds(
-        this.item.input.binds.value,
-        props.binds,
-        {
-          ref: this.element,
-          id: input.id,
-          value: this.item.value.get(),
-          class: [
-            props.classesWindow.controlOpenOnly,
-            className
-          ]
-        },
-        isEdit ? undefined : menuControl
-      )
-    )
-  }
-
-  /**
-   * Render menu control in static mode.
-   *
-   * Рендер элемента управления меню в статическом режиме.
-   * @param input data for the input element/ данные для элемента ввода
-   * @param props data for the transferable property/ данные для передаваемого свойства
-   */
-  protected readonly renderMenuControlValue = (
-    input: FieldControl,
-    props: MenuControlItem
-  ): VNode => {
-    return this.components.renderOne(
-      'selectValue',
-      toBinds(
-        props.binds,
-        {
-          class: input.className,
-          disabled: this.props.disabled,
-          value: props.selectedList.value,
-          multiple: this.props.multiple,
-          placeholder: this.props.placeholder,
-          onClick: this.item.event.onSelect
-        }
-      )
-    ) as VNode
-  }
-
-  /**
-   * Render title element.
-   *
-   * Рендер элемента заголовка.
-   * @param props data for the transferable property/ данные для передаваемого свойства
-   */
-  protected readonly renderTitle = (props: MenuControlItem) => {
-    const children: any[] = []
-
-    if (this.props.showSearch) {
-      children.push(this.renderFilterInput(props))
-    }
-
-    this.initSlot('title', children, props)
-
-    return children
-  }
-
-  /**
-   * Render filter input.
-   *
-   * Рендер фильтра ввода.
-   * @param props data for the transferable property/ данные для передаваемого свойства
-   */
-  protected readonly renderFilterInput = (props: MenuControlItem): VNode => {
-    return h(
-      'div',
-      {
-        class: [
-          this.classes?.value.input,
-          props.classesWindow.static
-        ]
-      },
-      this.components.renderOne(
-        'input',
-        toBinds(
-          {
-            icon: this.props.iconSearch,
-            onInputLite: this.item.filter.onInput,
-            inputAttrs: {
-              'data-menu-control': '1'
-            }
-          },
-          this.props.inputSearchAttrs
-        )
-      )
-    )
-  }
-}