@dxtmisha/constructor 0.30.1 → 0.39.3

package/src/classes/field/FieldValueInclude.ts

@@ -1,328 +0,0 @@
-import { computed, ref, type ToRefs, watch } from 'vue'
-import {
-  anyToString,
-  getRef,
-  isArray,
-  isFilled,
-  isObject,
-  type RefOrNormal,
-  setValues,
-  toArray,
-  toNumber
-} from '@dxtmisha/functional'
-
-import { FieldElementInclude } from './FieldElementInclude'
-
-import type { FieldValueProps } from '../../types/fieldTypes'
-
-/**
- * Class for working with input values.
- *
- * Класс для работы со значениями инпута.
- */
-export class FieldValueInclude<Value = any> {
-  /** Current value/ Текущее значение */
-  readonly item = ref<Value>()
-  /** Indicates if the value is complete/ Указывает, полное ли значение */
-  readonly isFull = ref<boolean>(true)
-
-  /** Indicates if there are temporary values/ Указывает, есть ли временные значения */
-  protected readonly hasEdit = ref<boolean>(false)
-
-  /**
-   * Constructor
-   * @param props input data /<br>входные данные
-   * @param refs input data in the form of reactive elements /<br>входные данные в виде реактивных элементов
-   * @param element object for working with the input element /<br>объект для работы с элементом ввода
-   * @param original original values /<br>оригинальные значения
-   */
-
-  constructor(
-    protected readonly props: FieldValueProps<Value>,
-    protected readonly refs: ToRefs<FieldValueProps<Value>>,
-    protected readonly element?: FieldElementInclude,
-    protected readonly original?: RefOrNormal<Value>
-  ) {
-    this.item.value = this.getOriginal()
-
-    watch([
-      refs.value,
-      refs.modelValue
-    ], this.update)
-  }
-
-  /** Checks if there are values or temporary values/ Проверяет, есть ли значения или временные значения */
-  readonly is = computed<boolean>(() => {
-    return this.hasEdit.value
-      || this.boolean.value
-      || Boolean(this.props.placeholder)
-  })
-
-  /** Checks if there are any values/ Проверяет, есть ли значения */
-  readonly isValue = computed<boolean>(() => this.hasEdit.value || this.boolean.value)
-
-  /** Returns the current value if isFull is true/ Возвращает текущее значение, если isFull истинно */
-  readonly itemByFull = computed<Value | undefined>(() => this.isFull.value ? this.item.value : undefined)
-
-  /**
-   * Returns the current value, converted to a number/
-   * Возвращает текущее значение, преобразованное в номер
-   */
-  readonly number = computed<number>(() => {
-    if (this.boolean.value) {
-      return toNumber(this.string.value)
-    }
-
-    return 0
-  })
-
-  /** Returns the current value of type string/ Возвращает текущее значение типа string */
-  readonly string = computed<string>(() => anyToString(this.item.value))
-
-  /** Returns the current value of type boolean/ Возвращает текущее значение типа boolean */
-  readonly boolean = computed<boolean>(() => isFilled(this.item.value))
-
-  /** Returns the length of the entered value/ Возвращает длину введенного значения */
-  readonly length = computed<number>(() => {
-    const value = this.item.value
-
-    if (isArray(value)) {
-      return value.length
-    }
-
-    if (isObject(value)) {
-      return Object.keys(value).length
-    }
-
-    return this.string.value.length ?? 0
-  })
-
-  /**
-   * Returns the current value.
-   *
-   * Возвращает текущее значение.
-   */
-  get(): Value | undefined {
-    return this.item.value
-  }
-
-  /**
-   * Returns the current value as an array.
-   *
-   * Возвращает текущее значение в виде массива.
-   */
-  getToArray(): Value[] {
-    return toArray(this.item.value) as Value[]
-  }
-
-  /**
-   * Changes the value.
-   *
-   * Изменяет значение.
-   * @param value changeable value/ изменяемое значение
-   */
-  set(value: any): this {
-    if (this.isDifference(value)) {
-      this.item.value = setValues(
-        this.item.value,
-        value,
-        {
-          multiple: this.props.multiple,
-          maxlength: toNumber(this.props.maxlength)
-        }
-      ) as Value
-
-      const element = this.element?.getElement()
-
-      if (
-        element
-        && element.value
-        && 'setValue' in element.value
-      ) {
-        element.value?.setValue(this.item.value)
-      }
-    }
-
-    return this
-  }
-
-  /**
-   * Changes the values by the selected element.
-   *
-   * Изменяет значения по выбранному элементу.
-   * @param event event object/ объект события
-   */
-  setByEvent(event: Event): this
-  setByEvent(value: Record<string, any>): this
-  setByEvent(value: any): this
-  setByEvent(eventValue: Event | Record<string, any> | any): this {
-    console.log('setByEvent')
-    switch (typeof eventValue) {
-      case 'object':
-        if (eventValue) {
-          if (
-            'value' in eventValue
-            && eventValue.value !== undefined
-          ) {
-            this.set(eventValue.value)
-          } else if ('target' in eventValue) {
-            this.setByTarget(eventValue.target as HTMLInputElement)
-          }
-
-          if ('hasEdit' in eventValue) {
-            this.setHasEdit(eventValue.hasEdit)
-          }
-
-          if ('isFull' in eventValue) {
-            this.setFull(eventValue.isFull)
-          }
-        }
-
-        break
-      default:
-        this.set(eventValue)
-        break
-    }
-
-    return this
-  }
-
-  /**
-   * Changes the values by the selected element.
-   *
-   * Изменяет значения по выбранному элементу.
-   * @param target selected elements/ выбранные элементы
-   */
-  setByTarget(target: HTMLInputElement): this {
-    return this.set(
-      this.isCheckbox(target)
-        ? target.checked
-        : target.value
-    )
-  }
-
-  /**
-   * Changes the value by the checked property.
-   *
-   * Изменяет значение по свойству checked.
-   * @param event event value/ значение события
-   */
-  setByChecked(event: Event): this {
-    const input = event.target as HTMLInputElement
-
-    return this.set(input.checked)
-  }
-
-  /**
-   * Changes the value for radio type.
-   *
-   * Изменяет значение для типа radio.
-   * @param event event object/ объект события
-   */
-  setByRadio(event: Event): this {
-    const input = event.target as HTMLInputElement
-    const value = input.checked ? input.value : ''
-
-    return this.set(value)
-  }
-
-  /**
-   * Sets the isFull value.
-   *
-   * Устанавливает значение isFull.
-   * @param isFull isFull value/ значение isFull
-   */
-  setFull(isFull: boolean) {
-    this.isFull.value = isFull
-  }
-
-  /**
-   * Sets the hasEdit value.
-   *
-   * Устанавливает значение hasEdit.
-   * @param hasEdit hasEdit value/ значение hasEdit
-   */
-  setHasEdit(hasEdit: boolean) {
-    this.hasEdit.value = hasEdit
-  }
-
-  /**
-   * Sets the value to the original one.
-   *
-   * Устанавливает значение на оригинальное.
-   */
-  setToOriginal(): this {
-    this.item.value = this.getOriginal()
-    return this
-  }
-
-  /**
-   * Clear all values to the original ones.
-   *
-   * Очисти все значения до оригинальных.
-   */
-  clear(): this {
-    this.item.value = getRef(this.original)
-    this.element?.clear()
-
-    this.hasEdit.value = false
-    this.isFull.value = true
-
-    return this
-  }
-
-  /**
-   * Is the selected type a checkbox.
-   *
-   * Является ли выбранный тип чекбокс.
-   * @param target selected elements/ выбранные элементы
-   */
-  protected isCheckbox(target: HTMLInputElement): boolean {
-    return target.type === 'checkbox'
-  }
-
-  /**
-   * Checks if the value has actually been changed.
-   *
-   * Проверяет, было ли значение действительно изменено.
-   * @param value value to check/ значение для проверки
-   */
-  protected isDifference(
-    value: any = this.getOriginal()
-  ): boolean {
-    return this.string.value !== anyToString(value)
-  }
-
-  /**
-   * Returns the original value.
-   *
-   * Возвращает оригинальное значение.
-   */
-  protected getOriginal(): any {
-    return this.props.value || this.props.modelValue || getRef(this.original)
-  }
-
-  /**
-   * Changes the values to the original ones.
-   *
-   * Изменяет значения на оригинальные.
-   */
-  protected readonly update = (): void => {
-    if (
-      this.isEdit(this.props.value)
-      || this.isEdit(this.props.modelValue)
-    ) {
-      this.setToOriginal()
-    }
-  }
-
-  /**
-   * Checks if the value is being edited.
-   *
-   * Проверяет, редактируется ли значение.
-   * @param value value to check/ значение для проверки
-   */
-  protected isEdit(value?: Value): boolean {
-    return value !== undefined && anyToString(value) !== this.string.value
-  }
-}

package/src/classes/field/FieldVisibilityInclude.ts

@@ -1,21 +0,0 @@
-import { ref } from 'vue'
-
-/**
- * Class for working with data visualization. This is for working with the password type.
- *
- * Класс для работы с визуализацией данных. Это для работы с типом пароля.
- */
-export class FieldVisibilityInclude {
-  readonly item = ref<boolean>(false)
-
-  /**
-   * Toggles the values.
-   *
-   * Переключает значения.
-   */
-  toggle(): this {
-    this.item.value = !this.item.value
-
-    return this
-  }
-}

package/src/constructors/Accordion/Accordion.ts

@@ -1,68 +0,0 @@
-import { computed, ref, type Ref, type ToRefs } from 'vue'
-import { type ConstrEmit, DesignComp } from '@dxtmisha/functional'
-
-import { EventClickInclude } from '../../classes/EventClickInclude'
-import { MotionTransformInclude } from '../MotionTransform'
-import { ModelInclude } from '../../classes/ModelInclude'
-
-import type { CellExpose } from '../Cell'
-import type { AccordionComponents, AccordionEmits, AccordionSlots } from './types'
-import type { AccordionProps } from './props'
-
-/**
- * Accordion
- */
-export class Accordion {
-  readonly motionTransform: MotionTransformInclude
-
-  readonly event: EventClickInclude
-
-  readonly open = ref<boolean>(false)
-  readonly model: ModelInclude<boolean>
-
-  readonly elementHead = ref<CellExpose>()
-
-  /**
-   * 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: AccordionProps,
-    protected readonly refs: ToRefs<AccordionProps>,
-    protected readonly element: Ref<HTMLElement | undefined>,
-    protected readonly classDesign: string,
-    protected readonly className: string,
-    protected readonly components?: DesignComp<AccordionComponents, AccordionProps>,
-    protected readonly slots?: AccordionSlots,
-    protected readonly emits?: ConstrEmit<AccordionEmits>
-  ) {
-    this.motionTransform = new MotionTransformInclude(
-      this.props,
-      this.className,
-      this.components,
-      this.emits,
-      computed(() => ({
-        section: true,
-        adaptive: 'planeAlways',
-        inDom: true,
-        ariaLabelledby: this.elementHead.value?.labelId,
-        ariaDescribedby: this.elementHead.value?.descriptionId
-      }))
-    )
-
-    this.event = new EventClickInclude(
-      undefined,
-      undefined,
-      emits
-    )
-
-    this.model = new ModelInclude('open', this.emits, this.open)
-  }
-}

package/src/constructors/Accordion/AccordionDesign.tsx

@@ -1,192 +0,0 @@
-import { h, type VNode } from 'vue'
-import {
-  type ConstrOptions,
-  type ConstrStyles,
-  DesignConstructorAbstract,
-  toBinds
-} from '@dxtmisha/functional'
-
-import { Accordion } from './Accordion'
-
-import type { MotionTransformControlItem } from '../MotionTransform'
-import {
-  type AccordionProps
-} from './props'
-import {
-  type AccordionClasses,
-  type AccordionComponents,
-  type AccordionEmits,
-  type AccordionExpose,
-  type AccordionSlots
-} from './types'
-
-/**
- * AccordionDesign
- */
-export class AccordionDesign<
-  COMP extends AccordionComponents,
-  EXPOSE extends AccordionExpose,
-  CLASSES extends AccordionClasses,
-  P extends AccordionProps
-> extends DesignConstructorAbstract<
-    HTMLDivElement,
-    COMP,
-    AccordionEmits,
-    EXPOSE,
-    AccordionSlots,
-    CLASSES,
-    P
-  > {
-  protected readonly item: Accordion
-
-  /**
-   * Constructor
-   * @param name class name/ название класса
-   * @param props properties/ свойства
-   * @param options list of additional parameters/ список дополнительных параметров
-   */
-  constructor(
-    name: string,
-    props: Readonly<P>,
-    options?: ConstrOptions<COMP, AccordionEmits, P>
-  ) {
-    super(
-      name,
-      props,
-      options
-    )
-
-    this.item = new Accordion(
-      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.motionTransform.expose
-    } as EXPOSE
-  }
-
-  /**
-   * Improvement of the obtained list of classes.
-   *
-   * Доработка полученного списка классов.
-   */
-  protected initClasses(): Partial<CLASSES> {
-    return {
-      main: {},
-      ...{
-        // :classes [!] System label / Системная метка
-        head: this.getSubClass('head'),
-        body: this.getSubClass('body')
-        // :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.motionTransform.render(
-      {
-        head: this.renderHead,
-        body: this.renderBody
-      },
-      {
-        ...this.getAttrs(),
-        'class': this.classes?.value.main,
-        'data-divider': this.props.divider ? 'divider' : undefined,
-        ...this.item.model.getBinds()
-      }
-    )
-  }
-
-  /**
-   * Generates data for the header.
-   *
-   * Генерирует данные для заголовка.
-   * @param open open status/ статус открытия
-   */
-  protected readonly renderHead = (
-    { isOpen, binds }: MotionTransformControlItem
-  ): VNode | undefined => {
-    const slots: Record<string, any> = {}
-
-    if (this.slots) {
-      if ('label' in this.slots) {
-        slots.label = (props: any) => this.initSlot('label', undefined, props)
-      }
-      if ('description' in this.slots) {
-        slots.description = (props: any) => this.initSlot('description', undefined, props)
-      }
-      if ('caption' in this.slots) {
-        slots.caption = (props: any) => this.initSlot('caption', undefined, props)
-      }
-      if ('trailing' in this.slots) {
-        slots.trailing = (props: any) => this.initSlot('trailing', undefined, props)
-      }
-      if ('body' in this.slots) {
-        slots.body = (props: any) => this.initSlot('body', undefined, props)
-      }
-    }
-
-    return this.components.renderOne(
-      'cell',
-      toBinds(
-        {
-          ref: this.item.elementHead,
-          icon: this.props.icon,
-          iconTrailing: this.props.iconArrowDown,
-          iconTurn: isOpen.value,
-          label: this.props.label,
-          description: this.props.description,
-          class: this.classes?.value.head,
-          dynamic: true,
-          onClick: this.item.event.onClick,
-          ...binds
-        },
-        this.props.cellAttrs
-      ),
-      slots
-    )
-  }
-
-  /**
-   * Generates data for the body.
-   *
-   * Генерирует данные для тела.
-   */
-  protected readonly renderBody = (props: any): VNode => {
-    return h(
-      'div',
-      { class: this.classes?.value.body },
-      this.initSlot('default', undefined, props)
-    )
-  }
-}

package/src/constructors/Accordion/index.ts

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

package/src/constructors/Accordion/properties.json

@@ -1,16 +0,0 @@
-{
-  "border-width": {
-    "_type": "var"
-  },
-  "border-color": {
-    "_type": "var"
-  },
-  "border-opacity": {
-    "_type": "var"
-  },
-  "#head": {},
-  "#body": {},
-  "~divider": {
-    "_default": true
-  }
-}

package/src/constructors/Accordion/props.ts

@@ -1,55 +0,0 @@
-import type { ConstrBind } from '@dxtmisha/functional'
-
-import type { LabelProps } from '../../types/labelTypes'
-import type { DescriptionProps } from '../../types/descriptionTypes'
-
-import type { IconLitePropsInclude, IconPropsBasic, IconValue } from '../Icon'
-import type { CellPropsBasic } from '../Cell'
-import type { MotionTransformPropsBasic, MotionTransformPropsInclude } from '../MotionTransform'
-
-interface AccordionPropsToken {
-  // :type [!] System label / Системная метка
-  divider?: boolean
-  // :type [!] System label / Системная метка
-}
-
-export interface AccordionPropsBasic<
-  Icon extends IconPropsBasic = IconPropsBasic,
-  Cell extends CellPropsBasic = CellPropsBasic,
-  MotionTransform extends MotionTransformPropsBasic = MotionTransformPropsBasic
-> extends LabelProps,
-  DescriptionProps,
-  IconLitePropsInclude<Icon>,
-  MotionTransformPropsInclude<MotionTransform> {
-  // Style
-  'cellAttrs'?: ConstrBind<Cell>
-  'iconArrowDown'?: IconValue<Icon>
-
-  // Event
-  'modelOpen'?: boolean
-  'onUpdate:open'?: (value: boolean) => void
-  'onUpdate:modelOpen'?: (value: boolean) => void
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface AccordionProps extends AccordionPropsBasic, AccordionPropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsAccordion = {
-  clickOpen: true,
-  autoClose: true,
-  ...{
-    // :default [!] System label / Системная метка
-    divider: true
-    // :default [!] System label / Системная метка
-  }
-}