@dxtmisha/constructor 0.30.1 → 0.39.5

package/src/constructors/Bars/BarsDesign.tsx

@@ -1,235 +0,0 @@
-import { h, type VNode } from 'vue'
-import {
-  type ConstrOptions,
-  type ConstrStyles,
-  DesignConstructorAbstract
-} from '@dxtmisha/functional'
-
-import { AriaStaticInclude } from '../../classes/AriaStaticInclude'
-import { Bars } from './Bars'
-
-import {
-  type BarsProps,
-  type BarsPropsBasic
-} from './props'
-import {
-  type BarsClasses,
-  type BarsComponents,
-  type BarsEmits,
-  type BarsExpose,
-  type BarsSlots
-} from './types'
-
-/**
- * BarsDesign
- */
-export class BarsDesign<
-  COMP extends BarsComponents,
-  EXPOSE extends BarsExpose,
-  CLASSES extends BarsClasses,
-  P extends BarsProps
-> extends DesignConstructorAbstract<
-    HTMLDivElement,
-    COMP,
-    BarsEmits,
-    EXPOSE,
-    BarsSlots,
-    CLASSES,
-    P
-  > {
-  protected readonly item: Bars
-
-  /**
-   * Constructor
-   * @param name class name/ название класса
-   * @param props properties/ свойства
-   * @param options list of additional parameters/ список дополнительных параметров
-   */
-  constructor(
-    name: string,
-    props: Readonly<P>,
-    options?: ConstrOptions<COMP, BarsEmits, P>
-  ) {
-    super(
-      name,
-      props,
-      options
-    )
-
-    this.item = new Bars(
-      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.label.expose,
-      ...this.item.description.expose
-    } as EXPOSE
-  }
-
-  /**
-   * Improvement of the obtained list of classes.
-   *
-   * Доработка полученного списка классов.
-   */
-  protected initClasses(): Partial<CLASSES> {
-    return {
-      main: {},
-      ...{
-        // :classes [!] System label / Системная метка
-        context: this.getSubClass('context'),
-        label: this.getSubClass('label'),
-        description: this.getSubClass('description')
-        // :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 h(
-      'div',
-      {
-        ...this.getAttrs(),
-        class: this.classes?.value.main,
-        ...AriaStaticInclude.live(this.props.action ? 'polite' : 'off')
-      },
-      [
-        ...this.renderBackButton(),
-        ...this.renderContext(),
-        ...this.renderBars(),
-        ...this.renderActionBars()
-      ]
-    )
-  }
-
-  /**
-   * Rendering the close button.
-   *
-   * Рендеринг кнопки закрытия.
-   */
-  readonly renderBackButton = (): VNode[] => {
-    if (
-      this.props.backHide
-      && (
-        !this.item.action.is.value
-        || this.props.backActionHide
-      )
-    ) {
-      return []
-    }
-
-    return [
-      this.components.renderOne(
-        'button',
-        {
-          label: this.item.backLabel.value,
-          selected: this.item.action.is.value,
-          ...this.item.backBinds.value
-        }
-      ) as VNode
-    ]
-  }
-
-  /**
-   * Rendering the content.
-   *
-   * Рендеринг контента.
-   */
-  readonly renderContext = (): VNode[] => {
-    return [
-      h(
-        'div',
-        {
-          class: this.classes?.value.context
-        },
-        [
-          ...this.item.label.render(),
-          ...this.item.description.render()
-        ]
-      )
-    ]
-  }
-
-  /**
-   * Rendering the control button.
-   *
-   * Рендеринг кнопки управления.
-   */
-  readonly renderBars = (): VNode[] => {
-    const children: any[] = []
-
-    if (this.item.action.is.value) {
-      return children
-    }
-
-    children.push(...this.renderList(this.item.barsBinds.value))
-    this.initSlot('bars', children)
-
-    return children
-  }
-
-  /**
-   * Rendering the control button.
-   *
-   * Рендеринг кнопки управления.
-   */
-  readonly renderActionBars = (): VNode[] => {
-    const children: any[] = []
-
-    if (this.item.action.is.value) {
-      children.push(...this.renderList(this.item.actionBarsBinds.value))
-      this.initSlot('actionBars', children)
-    }
-
-    return children
-  }
-
-  /**
-   * Rendering a list of buttons from the list.
-   *
-   * Рендеринг списка кнопок по списку.
-   * @param list list of data for the button/ список данных для кнопки
-   */
-  readonly renderList = (
-    list: BarsPropsBasic['bars']
-  ): VNode[] => {
-    const children: VNode[] = []
-
-    if (list) {
-      list.forEach(
-        item => this.components.renderAdd(children, 'button', item)
-      )
-    }
-
-    return children
-  }
-}

package/src/constructors/Bars/BarsInclude.ts

@@ -1,119 +0,0 @@
-import { computed, ref, type VNode } from 'vue'
-import {
-  type ConstrBind,
-  type ConstrEmit,
-  DesignComponents,
-  getRef,
-  type RefOrNormal,
-  toBinds
-} from '@dxtmisha/functional'
-
-import type { EventClickValue } from '../../types/eventClickTypes'
-
-import type { BarsComponentInclude, BarsEmitsInclude, BarsPropsInclude } from './basicTypes'
-import type { BarsExpose } from './types'
-import type { BarsProps } from './props'
-
-/**
- * BarsInclude class provides functionality for conditionally rendering bars components
- * within other components. It manages the logic for determining when to display bars
- * and configures the appropriate properties.
- *
- * Класс BarsInclude предоставляет функциональность для условного рендеринга компонентов
- * панелей действий внутри других компонентов. Он управляет логикой определения необходимости
- * отображения панелей и настраивает соответствующие свойства.
- */
-export class BarsInclude<
-  Props extends BarsPropsInclude = BarsPropsInclude,
-  PropsExtra extends ConstrBind<BarsProps> = ConstrBind<BarsProps>
-> {
-  readonly element = ref<BarsExpose>()
-
-  /**
-   * Constructor
-   * @param props input parameter/ входной параметр
-   * @param className class name/ название класса
-   * @param components object for working with components/ объект для работы с компонентами
-   * @param emits the function is called when an event is triggered/ функция вызывается, когда срабатывает событие
-   * @param extra additional parameter or property name/ дополнительный параметр или имя свойства
-   * @param index index identifier/ идентификатор индекса
-   */
-  constructor(
-    protected readonly props: Readonly<Props>,
-    protected readonly className: string,
-    protected readonly components?: DesignComponents<BarsComponentInclude, Props>,
-    protected readonly emits?: ConstrEmit<BarsEmitsInclude>,
-    protected readonly extra?: RefOrNormal<PropsExtra>,
-    protected readonly index?: string
-  ) {
-  }
-
-  /**
-   * Checks whether bars should be displayed/
-   * Проверяет, нужно ли отображать панели
-   */
-  readonly is = computed(() => Boolean(
-    this.props.barsLabel
-    || this.props.barsDescription
-    || this.props.barsBackHide !== true
-  ))
-
-  /** Computed bindings for the bars/ Вычисляемые привязки для панелей */
-  readonly binds = computed<PropsExtra>(() => {
-    const props = toBinds<PropsExtra>(
-      getRef(this.extra),
-      this.props.barsAttrs,
-      { class: `${this.className}__bars` }
-    )
-
-    return {
-      ...props,
-
-      label: this.props.barsLabel,
-      description: this.props.barsDescription,
-      backHide: this.props.barsBackHide,
-      bars: this.props.barsList
-    }
-  })
-
-  /**
-   * Render the Bars component
-   *
-   * Рендер компонента панелей
-   */
-  readonly render = (): VNode[] => {
-    if (
-      this.components
-      && !this.props.barsHide
-    ) {
-      return this.components.render(
-        'bars',
-        {
-          ref: this.element,
-          ...this.binds.value,
-          onClick: this.onClick
-        },
-        undefined,
-        this.index ?? 'bars'
-      )
-    }
-
-    return []
-  }
-
-  /**
-   * Handles click events from Bars and emits related events/
-   * Обрабатывает клики по панелям и испускает связанные события
-   *
-   * @param event native mouse event/ native событие мыши
-   * @param value payload with { type, value, detail }/ данные события с { type, value, detail }
-   */
-  protected readonly onClick = (event: MouseEvent, value: EventClickValue) => {
-    this.emits?.('bars', event, value)
-    this.emits?.('barsLite', value)
-
-    if (value.type === 'back') {
-      this.emits?.('barsBack', value)
-    }
-  }
-}

package/src/constructors/Bars/basicTypes.ts

@@ -1,40 +0,0 @@
-import type { ConstrBind } from '@dxtmisha/functional'
-
-import type { EventClickEmits } from '../../types/eventClickTypes'
-import type { BarsPropsBasic } from './props'
-
-/**
- * Component map for including the Bars component/
- * Карта компонентов для подключения компонента Bars
- */
-export type BarsComponentInclude = {
-  bars?: object
-}
-
-/** Available events for Bars/ Доступные события для Bars */
-export type BarsEmitsInclude = {
-  bars: EventClickEmits['click']
-  barsLite: EventClickEmits['clickLite']
-  barsBack: EventClickEmits['clickLite']
-}
-
-/**
- * Props used to include and configure the Bars component/
- * Свойства для подключения и настройки компонента Bars
- */
-export interface BarsPropsInclude<
-  Bars extends BarsPropsBasic = BarsPropsBasic
-> {
-  /** Bars label/ Метка панелей */
-  barsLabel?: string | number
-  /** Bars description/ Описание панелей */
-  barsDescription?: string
-  /** Hide back button/ Скрыть кнопку назад */
-  barsBackHide?: boolean
-  /** Hide bars/ Скрыть панели */
-  barsHide?: boolean
-  /** List of bar buttons/ Список кнопок панелей */
-  barsList?: Bars['bars']
-  /** Additional attributes for Bars component/ Дополнительные атрибуты для компонента Bars */
-  barsAttrs?: ConstrBind<Bars>
-}

package/src/constructors/Bars/index.ts

@@ -1,6 +0,0 @@
-export * from './Bars'
-export * from './BarsDesign'
-export * from './BarsInclude'
-export * from './props'
-export * from './types'
-export * from './basicTypes'

package/src/constructors/Bars/properties.json

@@ -1,6 +0,0 @@
-{
-  "#context": {},
-  "#label": {},
-  "#description": {},
-  "~action": {}
-}

package/src/constructors/Bars/props.ts

@@ -1,65 +0,0 @@
-import type { ConstrBind } from '@dxtmisha/functional'
-
-import type { IconPropsBasic, IconValue } from '../Icon'
-import type { ButtonPropsBasic } from '../Button'
-import type { SkeletonPropsInclude } from '../Skeleton'
-
-import type { LabelProps } from '../../types/labelTypes'
-import type { DescriptionProps } from '../../types/descriptionTypes'
-import type { TextClosePropsInclude } from '../../types/textTypes'
-
-interface BarsPropsToken {
-  // :type [!] System label / Системная метка
-  action?: boolean
-  // :type [!] System label / Системная метка
-}
-
-export interface BarsPropsBasic<
-  Icon extends IconPropsBasic = IconPropsBasic,
-  Button extends ButtonPropsBasic = ButtonPropsBasic
-> extends LabelProps,
-  DescriptionProps,
-  SkeletonPropsInclude,
-  TextClosePropsInclude
-{
-  // Value
-  'backButton'?: ConstrBind<Button>
-  'backHide'?: boolean
-  'backActionHide'?: boolean
-  'bars'?: ConstrBind<Button>[]
-
-  'actionLabel'?: LabelProps['label']
-  'actionDescription'?: DescriptionProps['description']
-  'actionBars'?: ConstrBind<Button>[]
-
-  // Style
-  'buttonAttrs'?: ConstrBind<Button>
-
-  'iconBack'?: IconValue<Icon>
-  'iconClose'?: IconValue<Icon>
-
-  // Event
-  'modelAction'?: boolean
-  'onUpdate:action'?: (value: boolean) => void
-  'onUpdate:modelAction'?: (value: boolean) => void
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface BarsProps extends BarsPropsBasic, BarsPropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsBars = {
-  ...{
-    // :default [!] System label / Системная метка
-    // :default [!] System label / Системная метка
-  }
-}

package/src/constructors/Bars/types.ts

@@ -1,58 +0,0 @@
-import type { ConstrClass } from '@dxtmisha/functional'
-
-import type { ButtonComponentInclude } from '../Button'
-import type { EventClickEmits } from '../../types/eventClickTypes'
-import type { LabelExpose, LabelSlots } from '../../types/labelTypes'
-import type { DescriptionExpose, DescriptionSlots } from '../../types/descriptionTypes'
-
-/**
- * Interface for describing which components need to be connected for work.
- *
- * Интерфейс для описания, какие компоненты надо подключить для работы.
- */
-export type BarsComponents = ButtonComponentInclude
-
-/**
- * Type describing available events.
- *
- * Тип, описывающий доступные события.
- */
-export type BarsEmits
-  = EventClickEmits
-    & {
-      'update:action': [value: boolean]
-      'update:modelAction': [value: boolean]
-    }
-
-/**
- * Type describing available properties.
- *
- * Тип, описывающий доступные свойства.
- */
-export interface BarsExpose extends LabelExpose, DescriptionExpose {
-}
-
-/**
- * Type describing available slots.
- *
- * Тип, описывающий доступные слоты.
- */
-export interface BarsSlots extends LabelSlots, DescriptionSlots {
-  bars?(props: any): any
-
-  actionBars?(props: any): any
-}
-
-/**
- * Type describing subclasses.
- *
- * Тип, описывающий подклассы.
- */
-export type BarsClasses = {
-  main: ConstrClass
-  // :classes [!] System label / Системная метка
-  context: string
-  label: string
-  description: string
-  // :classes [!] System label / Системная метка
-}

package/src/constructors/Block/Block.ts

@@ -1,105 +0,0 @@
-import { computed, type Ref, type ToRefs } from 'vue'
-import { type ConstrEmit, DesignComp } from '@dxtmisha/functional'
-
-import { LabelInclude } from '../../classes/LabelInclude'
-import { DescriptionInclude } from '../../classes/DescriptionInclude'
-import { CaptionInclude } from '../../classes/CaptionInclude'
-
-import { IconInclude } from '../Icon'
-
-import type { BlockComponents, BlockEmits, BlockSlots } from './types'
-import type { BlockProps } from './props'
-
-/**
- * Block
- */
-export class Block {
-  /**
-   * Object for working with label/
-   * Объект для работы с меткой
-   */
-  readonly label: LabelInclude
-  /**
-   * Object for working with description/
-   * Объект для работы с описанием
-   */
-  readonly description: DescriptionInclude
-  /**
-   * Object for working with caption/
-   * Объект для работы с подписью
-   */
-  readonly caption: CaptionInclude
-
-  /**
-   * Object for working with icon/
-   * Объект для работы с иконкой
-   */
-  readonly icon: IconInclude
-
-  /**
-   * 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: BlockProps,
-    protected readonly refs: ToRefs<BlockProps>,
-    protected readonly element: Ref<HTMLElement | undefined>,
-    protected readonly classDesign: string,
-    protected readonly className: string,
-    protected readonly components?: DesignComp<BlockComponents, BlockProps>,
-    protected readonly slots?: BlockSlots,
-    protected readonly emits?: ConstrEmit<BlockEmits>
-  ) {
-    this.label = new LabelInclude(
-      props,
-      className,
-      undefined,
-      slots,
-      undefined,
-      undefined,
-      true,
-      undefined,
-      computed(() => this.props.tagHeader || 'h3')
-    )
-    this.caption = new CaptionInclude(props, className, slots)
-    this.description = new DescriptionInclude(props, className, slots)
-
-    this.icon = new IconInclude(props, className, components)
-  }
-
-  /**
-   * Checks if the headline exists/
-   * Проверяет, существует ли заголовок
-   */
-  readonly isHeadline = computed<boolean>(() => {
-    return Boolean(
-      this.props.headline
-      || (this.slots && 'headline' in this.slots)
-    )
-  })
-
-  /**
-   * Checks if the header exists/
-   * Проверяет, существует ли шапка
-   */
-  readonly isHeader = computed<boolean>(() => {
-    return this.label.is.value
-      || this.caption.is.value
-      || this.description.is.value
-  })
-
-  /**
-   * Tag name/
-   * Название тега
-   */
-  readonly tag = computed<string>(() => {
-    return this.props.tag || 'div'
-  })
-}