@dxtmisha/constructor 0.23.0 → 0.39.3

package/src/constructors/Button/ButtonDesign.tsx

@@ -1,136 +0,0 @@
-import { h, type VNode } from 'vue'
-import {
-  type ConstrOptions,
-  type ConstrStyles,
-  DesignConstructorAbstract
-} from '@dxtmisha/functional'
-
-import { Button } from './Button'
-
-import {
-  type ButtonPropsBasic
-} from './props'
-import {
-  type ButtonClasses,
-  type ButtonComponents,
-  type ButtonEmits,
-  type ButtonExpose,
-  type ButtonSlots
-} from './types'
-
-/**
- * ButtonDesign
- */
-export class ButtonDesign<
-  COMP extends ButtonComponents,
-  EXPOSE extends ButtonExpose,
-  CLASSES extends ButtonClasses,
-  P extends ButtonPropsBasic
-> extends DesignConstructorAbstract<
-    HTMLDivElement,
-    COMP,
-    ButtonEmits,
-    EXPOSE,
-    ButtonSlots,
-    CLASSES,
-    P
-  > {
-  protected readonly item: Button
-
-  /**
-   * Constructor
-   * @param name class name/ название класса
-   * @param props properties/ свойства
-   * @param options list of additional parameters/ список дополнительных параметров
-   */
-  constructor(
-    name: string,
-    props: Readonly<P>,
-    options?: ConstrOptions<COMP, ButtonEmits, P>
-  ) {
-    super(
-      name,
-      props,
-      options
-    )
-
-    this.item = new Button(
-      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.event.expose
-    } as EXPOSE
-  }
-
-  /**
-   * Improvement of the obtained list of classes.
-   *
-   * Доработка полученного списка классов.
-   */
-  protected initClasses(): Partial<CLASSES> {
-    return {
-      main: this.item.classes.value,
-      ...{
-        // :classes [!] System label / Системная метка
-        label: this.getSubClass('label'),
-        icon: this.getSubClass('icon'),
-        trailing: this.getSubClass('trailing'),
-        loading: this.getSubClass('loading')
-        // :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(
-      this.props.tag || 'button',
-      {
-        ...this.getAttrs(),
-        ref: this.element,
-
-        class: this.classes?.value.main,
-        style: this.styles?.value,
-
-        disabled: this.item.enabled.isDisabledOrUndefined.value,
-        onClick: this.item.event.onClick
-      },
-      [
-        ...this.item.progress.render(),
-        ...this.item.label.render(),
-        ...this.item.icon.render(),
-        ...this.item.ripple.render()
-      ]
-    )
-  }
-}

package/src/constructors/Button/ButtonInclude.ts

@@ -1,80 +0,0 @@
-import { computed, type VNode } from 'vue'
-import { type ConstrBind, DesignComponents, getBind, getRef, type RefOrNormal } from '@dxtmisha/functional'
-
-import type { ButtonComponentInclude, ButtonPropsInclude } from './basicTypes'
-import type { ButtonPropsBasic } from './props'
-
-/**
- * ButtonInclude class provides functionality for conditionally rendering button components
- * within other components. It manages the logic for determining when to display a button
- * and configures the appropriate properties.
- *
- * Класс ButtonInclude предоставляет функциональность для условного рендеринга компонентов
- * кнопки внутри других компонентов. Он управляет логикой определения необходимости
- * отображения кнопки и настраивает соответствующие свойства.
- *
- * @template Props - Properties interface extending ButtonPropsInclude
- */
-export class ButtonInclude<Props extends ButtonPropsInclude = ButtonPropsInclude> {
-  /**
-   * Constructor
-   * @param props input parameter/ входной параметр
-   * @param className class name/ название класса
-   * @param components object for working with components/ объект для работы с компонентами
-   * @param extra additional parameter/ дополнительный параметр
-   * @param index index identifier/ идентификатор индекса
-   */
-  constructor(
-    protected readonly props: Readonly<Props>,
-    protected readonly className: string,
-    protected readonly components?: DesignComponents<ButtonComponentInclude, Props>,
-    protected readonly extra?: RefOrNormal<ConstrBind<ButtonPropsBasic>>,
-    protected readonly index?: string
-  ) {
-  }
-
-  /**
-   * Computed bindings for the button/ Вычисляемые привязки для кнопки
-   */
-  readonly binds = computed(
-    () => getBind(
-      getRef(this.props),
-      getRef(this.extra),
-      'label'
-    )
-  )
-
-  /**
-   * Renders the button component with provided properties and configuration.
-   * Returns an array of VNode elements representing the rendered button, or an empty
-   * array if the component cannot be rendered.
-   *
-   * Обрисовывает компонент кнопки с предоставленными свойствами и конфигурацией.
-   * Возвращает массив VNode элементов, представляющих отрисованную кнопку, или пустой
-   * массив, если компонент не может быть отрисованы.
-   *
-   * @param props additional properties/ дополнительные свойства
-   */
-  readonly render = (props?: RefOrNormal<ConstrBind<ButtonPropsBasic>>): VNode[] => {
-    if (
-      this.components
-      && (
-        ('label' in this.binds.value)
-        || ('icon' in this.binds.value)
-        || ('iconTrailing' in this.binds.value)
-      )
-    ) {
-      return this.components.render(
-        'button',
-        {
-          ...this.binds.value,
-          ...getRef(props)
-        },
-        undefined,
-        this.index ?? 'button'
-      )
-    }
-
-    return []
-  }
-}

package/src/constructors/Button/basicTypes.ts

@@ -1,12 +0,0 @@
-import type { ConstrBind } from '@dxtmisha/functional'
-import type { ButtonPropsBasic } from './props'
-
-export type ButtonComponentInclude = {
-  button?: object
-}
-
-export interface ButtonPropsInclude<
-  Button extends ButtonPropsBasic = ButtonPropsBasic
-> {
-  buttonAttrs?: ConstrBind<Button>
-}

package/src/constructors/Button/index.ts

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

package/src/constructors/Button/properties.json

@@ -1,84 +0,0 @@
-{
-  "padding": {
-    "_type": "var"
-  },
-  "border-radius": "0",
-  "transition-property": "grid-template-columns, background-color, background-image, border, box-shadow",
-  "transition-duration": "{d.sys.transitionDuration.fade.enter}",
-  "transition-function": "{d.sys.transitionFunction.standard}",
-  "#label": {},
-  "#icon": {},
-  "#trailing": {},
-  "#loading": {
-    "color-opacity": {
-      "_type": "var"
-    }
-  },
-  "focus": {},
-  "hover": {
-    "transition-duration": "{d.sys.transitionDuration.sm}"
-  },
-  "active": {
-    "transition-duration": "{d.sys.transitionDuration.sm}"
-  },
-  "selected": {
-    "_type": "state"
-  },
-  "readonly": {
-    "_type": "state"
-  },
-  "disabled": {
-    "transition-duration": "{d.sys.transitionDuration.sm}"
-  },
-  "~adaptive": {
-    "~iconAlways": {
-      "justify-content": "flex-start",
-      "& > .??__icon": {
-        "padding": {
-          "value": "calc((var(--sys-height) - {?icon-_width}) / 2)",
-          "_important": true
-        }
-      },
-      "& > *:not(.??__icon)": {
-        "display": "none"
-      }
-    },
-    "~block": {
-      "width": "100%"
-    },
-    "~auto": {
-      "width": "fit-content"
-    },
-    "group|icon": {
-      "link|adaptive-icon": "{??adaptive.iconAlways}",
-      "_type": "media-group"
-    },
-    "group|full": {
-      "link|adaptive-icon": "{??adaptive.iconAlways}",
-      "_type": "media-max-group"
-    }
-  },
-  "container": {
-    "group|icon": {
-      "link|adaptive-icon": "{??adaptive.iconAlways}",
-      "_type": "container-group"
-    },
-    "group|full": {
-      "link|adaptive-icon": "{??adaptive.iconAlways}",
-      "_type": "container-max-group"
-    }
-  },
-  "~inverse": {},
-  "~grid": {},
-  "~textAlign": {
-    "left": {
-      "justify-content": "flex-start",
-      "text-align": "left"
-    },
-    "center": {},
-    "right": {
-      "justify-content": "flex-end",
-      "text-align": "right"
-    }
-  }
-}

package/src/constructors/Button/props.ts

@@ -1,55 +0,0 @@
-import type { IconPropsBasic, IconTrailingPropsInclude } from '../Icon'
-import type { ProgressPropsBasic, ProgressPropsInclude } from '../Progress'
-import type { SkeletonPropsInclude } from '../Skeleton'
-
-import type { LabelProps } from '../../types/labelTypes'
-import type { EnabledProps } from '../../types/enabledTypes'
-import type { EventClickProps } from '../../types/eventClickTypes'
-
-interface ButtonPropsToken {
-  // :type [!] System label / Системная метка
-  focus?: boolean
-  disabled?: boolean
-  selected?: boolean
-  readonly?: boolean
-  adaptive?: 'iconAlways' | 'block' | 'auto'
-  container?: boolean
-  inverse?: boolean
-  grid?: boolean
-  textAlign?: 'left' | 'center' | 'right'
-  // :type [!] System label / Системная метка
-}
-
-export interface ButtonPropsBasic<
-  Icon extends IconPropsBasic = IconPropsBasic,
-  Progress extends ProgressPropsBasic = ProgressPropsBasic
-> extends LabelProps,
-  EnabledProps,
-  IconTrailingPropsInclude<Icon>,
-  ProgressPropsInclude<Progress>,
-  SkeletonPropsInclude,
-  EventClickProps {
-  // Style
-  tag?: 'button' | 'a' | 'span' | string
-}
-
-/**
- * Type describing incoming properties.
- *
- * Тип, описывающий входящие свойства.
- */
-export interface ButtonProps extends ButtonPropsBasic, ButtonPropsToken {
-}
-
-/**
- * Default value for property.
- *
- * Значение по умолчанию для свойства.
- */
-export const defaultsButton = {
-  tag: 'button',
-  ...{
-    // :default [!] System label / Системная метка
-    // :default [!] System label / Системная метка
-  }
-}

package/src/constructors/Button/types.ts

@@ -1,56 +0,0 @@
-import type { ConstrClass } from '@dxtmisha/functional'
-
-import type { IconComponentInclude } from '../Icon'
-import type { ProgressComponentInclude } from '../Progress'
-import type { RippleComponentsInclude } from '../Ripple'
-
-import type { EventClickEmits, EventClickExpose } from '../../types/eventClickTypes'
-import type { LabelSlots } from '../../types/labelTypes'
-
-/**
- * Interface for describing which components need to be connected for work.
- *
- * Интерфейс для описания, какие компоненты надо подключить для работы.
- */
-export type ButtonComponents
-  = IconComponentInclude
-    & ProgressComponentInclude
-    & RippleComponentsInclude
-
-/**
- * Type describing available events.
- *
- * Тип, описывающий доступные события.
- */
-export type ButtonEmits = EventClickEmits
-
-/**
- * Type describing available properties.
- *
- * Тип, описывающий доступные свойства.
- */
-export interface ButtonExpose extends EventClickExpose {
-}
-
-/**
- * Type describing available slots.
- *
- * Тип, описывающий доступные слоты.
- */
-export interface ButtonSlots extends LabelSlots {
-}
-
-/**
- * Type describing subclasses.
- *
- * Тип, описывающий подклассы.
- */
-export type ButtonClasses = {
-  main: ConstrClass
-  // :classes [!] System label / Системная метка
-  label: string
-  icon: string
-  trailing: string
-  loading: string
-  // :classes [!] System label / Системная метка
-}

package/src/constructors/Cell/Cell.ts

@@ -1,127 +0,0 @@
-import { computed, type Ref, type ToRefs } from 'vue'
-import {
-  type ConstrClass,
-  type ConstrEmit,
-  DesignComp
-} from '@dxtmisha/functional'
-import { getClassTegAStatic } from '../../functions/getClassTegAStatic'
-
-import { LabelInclude } from '../../classes/LabelInclude'
-import { CaptionInclude } from '../../classes/CaptionInclude'
-import { DescriptionInclude } from '../../classes/DescriptionInclude'
-import { EnabledInclude } from '../../classes/EnabledInclude'
-
-import { IconTrailingInclude } from '../Icon'
-import { ProgressInclude } from '../Progress'
-import { RippleInclude } from '../Ripple'
-import { SkeletonInclude } from '../Skeleton'
-
-import { EventClickInclude } from '../../classes/EventClickInclude'
-
-import type { CellComponents, CellEmits, CellSlots } from './types'
-import type { CellPropsBasic } from './props'
-import type { CellClassesSub } from './basicTypes'
-
-/**
- * Cell
- */
-export class Cell {
-  readonly progress: ProgressInclude
-  readonly skeleton: SkeletonInclude
-
-  readonly label: LabelInclude
-  readonly description: DescriptionInclude
-  readonly caption: CaptionInclude
-  readonly enabled: EnabledInclude
-
-  readonly icon: IconTrailingInclude
-  readonly ripple: RippleInclude
-
-  readonly event: EventClickInclude
-
-  /**
-   * 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: CellPropsBasic,
-    protected readonly refs: ToRefs<CellPropsBasic>,
-    protected readonly element: Ref<HTMLElement | undefined>,
-    protected readonly classDesign: string,
-    protected readonly className: string,
-    protected readonly components?: DesignComp<CellComponents, CellPropsBasic>,
-    protected readonly slots?: CellSlots,
-    protected readonly emits?: ConstrEmit<CellEmits>
-  ) {
-    const progress = new ProgressInclude(
-      props,
-      className,
-      components,
-      {
-        inverse: true,
-        position: 'bottom'
-      }
-    )
-
-    this.skeleton = new SkeletonInclude(
-      props,
-      classDesign,
-      ['classTextVariant']
-    )
-
-    this.label = new LabelInclude(
-      props,
-      className,
-      undefined,
-      slots,
-      undefined,
-      undefined,
-      undefined,
-      this.skeleton
-    )
-    this.caption = new CaptionInclude(props, className, slots)
-    this.description = new DescriptionInclude(props, className, slots, this.skeleton)
-    this.enabled = new EnabledInclude(props, progress)
-
-    this.icon = new IconTrailingInclude(props, className, components)
-    this.progress = progress
-    this.ripple = new RippleInclude(className, components, this.enabled)
-
-    this.event = new EventClickInclude(
-      props,
-      this.enabled,
-      emits
-    )
-  }
-
-  /**
-   * Computed CSS classes for the cell component.
-   *
-   * Вычисляемые CSS классы для компонента ячейки.
-   */
-  readonly classes = computed<ConstrClass>(() => ({
-    [`${this.className}--description`]: this.description.is.value,
-    [getClassTegAStatic(this.classDesign)]: true
-  }))
-
-  /**
-   * Returns a list of sub-element CSS classes for the cell component.
-   *
-   * Возвращает список CSS классов для под-элементов компонента ячейки.
-   */
-  getClassesSub(): CellClassesSub {
-    return {
-      label: `${this.className}__label`,
-      description: `${this.className}__description`,
-      caption: `${this.className}__caption`,
-      trailing: `${this.className}__trailing`
-    }
-  }
-}