@dxtmisha/constructor 0.30.1 → 0.39.3

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dxtmisha/constructor",
   "private": false,
-  "version": "0.30.1",
+  "version": "0.39.3",
   "type": "module",
   "description": "Vue component constructors for DXT UI design system - ready-to-use constructors with TypeScript support and SCSS styling",
   "keywords": [
@@ -36,97 +36,182 @@
     "build": "vue-tsc -b && vite build",
     "preview": "vite preview",
     "dxt-library": "dxt-library",
-    "dxt-constructor": "dxt-constructor tooltip"
+    "dxt-types": "dxt-types",
+    "dxt-constructor": "dxt-constructor",
+    "prepublishOnly": "npm run dxt-library && npm run build"
   },
   "files": [
-    "src/",
+    "dist/",
+    "src/library/style.scss",
+    "src/constructors/**/*.scss",
+    "ai-types.txt",
     "README.md",
     "package.json",
     "LICENSE"
   ],
-  "main": "./src/library.ts",
-  "module": "./src/library.ts",
-  "types": "./src/library.ts",
+  "main": "./dist/library.js",
+  "module": "./dist/library.js",
+  "types": "./dist/library.d.ts",
   "exports": {
-    ".": "./src/library.ts",
-    "./Accordion": "./src/constructors/Accordion/index.ts",
-    "./Accordion/style": "./src/constructors/Accordion/style.scss",
-    "./ActionSheet": "./src/constructors/ActionSheet/index.ts",
-    "./ActionSheet/style": "./src/constructors/ActionSheet/style.scss",
-    "./Actions": "./src/constructors/Actions/index.ts",
-    "./Actions/style": "./src/constructors/Actions/style.scss",
-    "./Anchor": "./src/constructors/Anchor/index.ts",
-    "./Anchor/style": "./src/constructors/Anchor/style.scss",
-    "./Badge": "./src/constructors/Badge/index.ts",
-    "./Badge/style": "./src/constructors/Badge/style.scss",
-    "./Bars": "./src/constructors/Bars/index.ts",
-    "./Bars/style": "./src/constructors/Bars/style.scss",
-    "./Block": "./src/constructors/Block/index.ts",
-    "./Block/style": "./src/constructors/Block/style.scss",
-    "./Button": "./src/constructors/Button/index.ts",
-    "./Button/style": "./src/constructors/Button/style.scss",
-    "./Cell": "./src/constructors/Cell/index.ts",
-    "./Cell/style": "./src/constructors/Cell/style.scss",
-    "./Chip": "./src/constructors/Chip/index.ts",
-    "./Chip/style": "./src/constructors/Chip/style.scss",
-    "./ChipGroup": "./src/constructors/ChipGroup/index.ts",
-    "./ChipGroup/style": "./src/constructors/ChipGroup/style.scss",
-    "./Dialog": "./src/constructors/Dialog/index.ts",
-    "./Dialog/style": "./src/constructors/Dialog/style.scss",
-    "./Field": "./src/constructors/Field/index.ts",
-    "./Field/style": "./src/constructors/Field/style.scss",
-    "./FieldCounter": "./src/constructors/FieldCounter/index.ts",
-    "./FieldCounter/style": "./src/constructors/FieldCounter/style.scss",
-    "./FieldLabel": "./src/constructors/FieldLabel/index.ts",
-    "./FieldLabel/style": "./src/constructors/FieldLabel/style.scss",
-    "./FieldMessage": "./src/constructors/FieldMessage/index.ts",
-    "./FieldMessage/style": "./src/constructors/FieldMessage/style.scss",
-    "./Icon": "./src/constructors/Icon/index.ts",
-    "./Icon/style": "./src/constructors/Icon/style.scss",
-    "./Image": "./src/constructors/Image/index.ts",
-    "./Image/style": "./src/constructors/Image/style.scss",
-    "./Input": "./src/constructors/Input/index.ts",
-    "./Input/style": "./src/constructors/Input/style.scss",
-    "./List": "./src/constructors/List/index.ts",
-    "./List/style": "./src/constructors/List/style.scss",
-    "./ListGroup": "./src/constructors/ListGroup/index.ts",
-    "./ListGroup/style": "./src/constructors/ListGroup/style.scss",
-    "./ListItem": "./src/constructors/ListItem/index.ts",
-    "./ListItem/style": "./src/constructors/ListItem/style.scss",
-    "./ListMenu": "./src/constructors/ListMenu/index.ts",
-    "./ListMenu/style": "./src/constructors/ListMenu/style.scss",
-    "./Mask": "./src/constructors/Mask/index.ts",
-    "./Mask/style": "./src/constructors/Mask/style.scss",
-    "./Menu": "./src/constructors/Menu/index.ts",
-    "./Menu/style": "./src/constructors/Menu/style.scss",
-    "./Modal": "./src/constructors/Modal/index.ts",
-    "./Modal/style": "./src/constructors/Modal/style.scss",
-    "./MotionTransform": "./src/constructors/MotionTransform/index.ts",
-    "./MotionTransform/style": "./src/constructors/MotionTransform/style.scss",
-    "./Motiontransform": "./src/constructors/Motiontransform/index.ts",
-    "./Motiontransform/style": "./src/constructors/Motiontransform/style.scss",
-    "./Progress": "./src/constructors/Progress/index.ts",
-    "./Progress/style": "./src/constructors/Progress/style.scss",
-    "./Ripple": "./src/constructors/Ripple/index.ts",
-    "./Ripple/style": "./src/constructors/Ripple/style.scss",
-    "./Scrollbar": "./src/constructors/Scrollbar/index.ts",
-    "./Scrollbar/style": "./src/constructors/Scrollbar/style.scss",
-    "./Section": "./src/constructors/Section/index.ts",
-    "./Section/style": "./src/constructors/Section/style.scss",
-    "./Select": "./src/constructors/Select/index.ts",
-    "./Select/style": "./src/constructors/Select/style.scss",
-    "./SelectValue": "./src/constructors/SelectValue/index.ts",
-    "./SelectValue/style": "./src/constructors/SelectValue/style.scss",
-    "./Skeleton": "./src/constructors/Skeleton/index.ts",
-    "./Skeleton/style": "./src/constructors/Skeleton/style.scss",
-    "./TextareaAutosize": "./src/constructors/TextareaAutosize/index.ts",
-    "./TextareaAutosize/style": "./src/constructors/TextareaAutosize/style.scss",
-    "./Window": "./src/constructors/Window/index.ts",
-    "./Window/style": "./src/constructors/Window/style.scss",
-    "./Arrow": "./src/constructors/Arrow/index.ts",
-    "./Arrow/style": "./src/constructors/Arrow/style.scss",
-    "./Tooltip": "./src/constructors/Tooltip/index.ts",
-    "./Tooltip/style": "./src/constructors/Tooltip/style.scss"
+    ".": "./dist/library.js",
+    "./Accordion": {
+      "import": "./dist/accordion.js",
+      "types": "./dist/constructors/Accordion/index.d.ts"
+    },
+    "./ActionSheet": {
+      "import": "./dist/actionSheet.js",
+      "types": "./dist/constructors/ActionSheet/index.d.ts"
+    },
+    "./Actions": {
+      "import": "./dist/actions.js",
+      "types": "./dist/constructors/Actions/index.d.ts"
+    },
+    "./Anchor": {
+      "import": "./dist/anchor.js",
+      "types": "./dist/constructors/Anchor/index.d.ts"
+    },
+    "./Arrow": {
+      "import": "./dist/arrow.js",
+      "types": "./dist/constructors/Arrow/index.d.ts"
+    },
+    "./Badge": {
+      "import": "./dist/badge.js",
+      "types": "./dist/constructors/Badge/index.d.ts"
+    },
+    "./Bars": {
+      "import": "./dist/bars.js",
+      "types": "./dist/constructors/Bars/index.d.ts"
+    },
+    "./Block": {
+      "import": "./dist/block.js",
+      "types": "./dist/constructors/Block/index.d.ts"
+    },
+    "./Button": {
+      "import": "./dist/button.js",
+      "types": "./dist/constructors/Button/index.d.ts"
+    },
+    "./Cell": {
+      "import": "./dist/cell.js",
+      "types": "./dist/constructors/Cell/index.d.ts"
+    },
+    "./Chip": {
+      "import": "./dist/chip.js",
+      "types": "./dist/constructors/Chip/index.d.ts"
+    },
+    "./ChipGroup": {
+      "import": "./dist/chipGroup.js",
+      "types": "./dist/constructors/ChipGroup/index.d.ts"
+    },
+    "./Dialog": {
+      "import": "./dist/dialog.js",
+      "types": "./dist/constructors/Dialog/index.d.ts"
+    },
+    "./Field": {
+      "import": "./dist/field.js",
+      "types": "./dist/constructors/Field/index.d.ts"
+    },
+    "./FieldCounter": {
+      "import": "./dist/fieldCounter.js",
+      "types": "./dist/constructors/FieldCounter/index.d.ts"
+    },
+    "./FieldLabel": {
+      "import": "./dist/fieldLabel.js",
+      "types": "./dist/constructors/FieldLabel/index.d.ts"
+    },
+    "./FieldMessage": {
+      "import": "./dist/fieldMessage.js",
+      "types": "./dist/constructors/FieldMessage/index.d.ts"
+    },
+    "./Icon": {
+      "import": "./dist/icon.js",
+      "types": "./dist/constructors/Icon/index.d.ts"
+    },
+    "./Image": {
+      "import": "./dist/image.js",
+      "types": "./dist/constructors/Image/index.d.ts"
+    },
+    "./Input": {
+      "import": "./dist/input.js",
+      "types": "./dist/constructors/Input/index.d.ts"
+    },
+    "./List": {
+      "import": "./dist/list.js",
+      "types": "./dist/constructors/List/index.d.ts"
+    },
+    "./ListGroup": {
+      "import": "./dist/listGroup.js",
+      "types": "./dist/constructors/ListGroup/index.d.ts"
+    },
+    "./ListItem": {
+      "import": "./dist/listItem.js",
+      "types": "./dist/constructors/ListItem/index.d.ts"
+    },
+    "./ListMenu": {
+      "import": "./dist/listMenu.js",
+      "types": "./dist/constructors/ListMenu/index.d.ts"
+    },
+    "./Mask": {
+      "import": "./dist/mask.js",
+      "types": "./dist/constructors/Mask/index.d.ts"
+    },
+    "./Menu": {
+      "import": "./dist/menu.js",
+      "types": "./dist/constructors/Menu/index.d.ts"
+    },
+    "./Modal": {
+      "import": "./dist/modal.js",
+      "types": "./dist/constructors/Modal/index.d.ts"
+    },
+    "./MotionTransform": {
+      "import": "./dist/motionTransform.js",
+      "types": "./dist/constructors/MotionTransform/index.d.ts"
+    },
+    "./Page": {
+      "import": "./dist/page.js",
+      "types": "./dist/constructors/Page/index.d.ts"
+    },
+    "./Progress": {
+      "import": "./dist/progress.js",
+      "types": "./dist/constructors/Progress/index.d.ts"
+    },
+    "./Ripple": {
+      "import": "./dist/ripple.js",
+      "types": "./dist/constructors/Ripple/index.d.ts"
+    },
+    "./Scrollbar": {
+      "import": "./dist/scrollbar.js",
+      "types": "./dist/constructors/Scrollbar/index.d.ts"
+    },
+    "./Section": {
+      "import": "./dist/section.js",
+      "types": "./dist/constructors/Section/index.d.ts"
+    },
+    "./Select": {
+      "import": "./dist/select.js",
+      "types": "./dist/constructors/Select/index.d.ts"
+    },
+    "./SelectValue": {
+      "import": "./dist/selectValue.js",
+      "types": "./dist/constructors/SelectValue/index.d.ts"
+    },
+    "./Skeleton": {
+      "import": "./dist/skeleton.js",
+      "types": "./dist/constructors/Skeleton/index.d.ts"
+    },
+    "./TextareaAutosize": {
+      "import": "./dist/textareaAutosize.js",
+      "types": "./dist/constructors/TextareaAutosize/index.d.ts"
+    },
+    "./Tooltip": {
+      "import": "./dist/tooltip.js",
+      "types": "./dist/constructors/Tooltip/index.d.ts"
+    },
+    "./Window": {
+      "import": "./dist/window.js",
+      "types": "./dist/constructors/Window/index.d.ts"
+    },
+    "./ai-types": "./ai-types.txt",
+    "./style.scss": "./src/library/style.scss"
   },
   "buildOptions": {
     "name": "@dxtmisha/constructor",

package/src/constructors/Block/style.scss

@@ -1,6 +1,8 @@
 @use "@dxtmisha/styles/properties" as ui;
 
 @mixin mixinBlock {
+  @include ui.flexStretchY;
+
   &__header {
     @include ui.flexX;
   }

package/src/constructors/Image/style.scss

@@ -74,6 +74,12 @@
         height: 100%;
       }
     }
+
+    &--flag-compressed {
+      > * {
+        @include ui.absolute;
+      }
+    }
   }
 
   &--size {

package/src/constructors/Page/style.scss

@@ -0,0 +1,6 @@
+@use "@dxtmisha/styles/properties" as ui;
+@use "../Block/style" as block;
+
+@mixin mixinPage {
+  @include block.mixinBlock;
+}

package/src/constructors/Section/style.scss

@@ -1,5 +1,6 @@
 @use "@dxtmisha/styles/properties" as ui;
+@use "../Block/style" as block;
 
 @mixin mixinSection {
-
+  @include block.mixinBlock;
 }

package/src/library/style.scss

@@ -0,0 +1,39 @@
+@forward "../constructors/Accordion/style";
+@forward "../constructors/ActionSheet/style";
+@forward "../constructors/Actions/style";
+@forward "../constructors/Anchor/style";
+@forward "../constructors/Arrow/style";
+@forward "../constructors/Badge/style";
+@forward "../constructors/Bars/style";
+@forward "../constructors/Block/style";
+@forward "../constructors/Button/style";
+@forward "../constructors/Cell/style";
+@forward "../constructors/Chip/style";
+@forward "../constructors/ChipGroup/style";
+@forward "../constructors/Dialog/style";
+@forward "../constructors/Field/style";
+@forward "../constructors/FieldCounter/style";
+@forward "../constructors/FieldLabel/style";
+@forward "../constructors/FieldMessage/style";
+@forward "../constructors/Icon/style";
+@forward "../constructors/Image/style";
+@forward "../constructors/Input/style";
+@forward "../constructors/List/style";
+@forward "../constructors/ListGroup/style";
+@forward "../constructors/ListItem/style";
+@forward "../constructors/ListMenu/style";
+@forward "../constructors/Mask/style";
+@forward "../constructors/Menu/style";
+@forward "../constructors/Modal/style";
+@forward "../constructors/MotionTransform/style";
+@forward "../constructors/Page/style";
+@forward "../constructors/Progress/style";
+@forward "../constructors/Ripple/style";
+@forward "../constructors/Scrollbar/style";
+@forward "../constructors/Section/style";
+@forward "../constructors/Select/style";
+@forward "../constructors/SelectValue/style";
+@forward "../constructors/Skeleton/style";
+@forward "../constructors/TextareaAutosize/style";
+@forward "../constructors/Tooltip/style";
+@forward "../constructors/Window/style";

package/src/classes/AriaStaticInclude.ts

@@ -1,269 +0,0 @@
-import type { AriaList, AriaTrueOrFalse } from '../types/ariaTypes'
-import type { RoleType } from '../types/roleTypes'
-import { isString } from '@dxtmisha/functional'
-
-/**
- * The class returns static ARIA attributes.
- *
- * Класс возвращает статические ARIA атрибуты.
- */
-export class AriaStaticInclude {
-  /**
-   * Get role by props.
-   *
-   * Получить роль по пропсам.
-   * @param role ARIA role type/ Тип ARIA роли
-   */
-  static role(role?: RoleType): AriaList {
-    return {
-      role
-    }
-  }
-
-  /**
-   * Get ARIA atomic attribute.
-   *
-   * Получить атрибут ARIA atomic.
-   * @param isAtomic is atomic/ является атомарным
-   */
-  static atomic(isAtomic?: boolean): AriaList {
-    return {
-      'aria-atomic': this.isTrueOrFalse(isAtomic)
-    }
-  }
-
-  /**
-   * Get ARIA checked attribute.
-   *
-   * Получить атрибут ARIA checked.
-   * @param isChecked is checked/ является отмеченным
-   */
-  static checked(isChecked?: boolean): AriaList {
-    return {
-      'aria-checked': this.isTrueOrFalse(isChecked)
-    }
-  }
-
-  /**
-   * Get ARIA current attribute.
-   *
-   * Получить атрибут ARIA current.
-   * @param value ARIA current attribute/ Атрибут ARIA current
-   */
-  static current(value?: AriaList['aria-current']): AriaList {
-    const current = isString(value)
-      ? value
-      : this.isTrueOrFalse(value)
-
-    return this.isDataToData('aria-current', current)
-  }
-
-  /**
-   * Get ARIA busy attribute.
-   *
-   * Получить атрибут ARIA busy.
-   * @param isBusy is busy/ является занятым
-   */
-  static busy(isBusy?: boolean): AriaList {
-    return {
-      'aria-busy': this.isTrueOrFalse(isBusy)
-    }
-  }
-
-  /**
-   * Get ARIA describedby attribute.
-   *
-   * Получить атрибут ARIA describedby.
-   * @param id Element ID/ Идентификатор элемента
-   */
-  static describedby(id?: string): AriaList {
-    return this.isDataToData('aria-describedby', id)
-  }
-
-  /**
-   * Get ARIA disabled attribute.
-   *
-   * Получить атрибут ARIA disabled.
-   * @param isDisabled is disabled/ является отключенным
-   */
-  static disabled(isDisabled: boolean = true): AriaList {
-    return {
-      'aria-disabled': this.isTrueOrFalse(isDisabled)
-    }
-  }
-
-  /**
-   * Get ARIA expanded attribute.
-   *
-   * Получить атрибут ARIA expanded.
-   * @param isExpanded is expanded/ является расширенным
-   */
-  static expanded(isExpanded?: boolean): AriaList {
-    return {
-      'aria-expanded': this.isTrueOrFalse(isExpanded)
-    }
-  }
-
-  /**
-   * Get ARIA haspopup attribute.
-   *
-   * Получить атрибут ARIA haspopup.
-   * @param haspopup ARIA haspopup attribute/ Атрибут ARIA haspopup
-   */
-  static haspopup(haspopup?: AriaList['aria-haspopup']): AriaList {
-    return this.isDataToData('aria-haspopup', haspopup)
-  }
-
-  /**
-   * Get ARIA label.
-   *
-   * Получить ARIA label.
-   * @param label ARIA label/ ARIA метка
-   */
-  static label(label?: string): AriaList {
-    return this.isDataToData('aria-label', label)
-  }
-
-  /**
-   * Get ARIA labelledby attribute.
-   *
-   * Получить атрибут ARIA labelledby.
-   * @param id Element ID/ Идентификатор элемента
-   */
-  static labelledby(id?: string): AriaList {
-    return this.isDataToData('aria-labelledby', id)
-  }
-
-  /**
-   * Get ARIA invalid attribute.
-   *
-   * Получить атрибут ARIA invalid.
-   * @param isInvalid is invalid/ является недействительным
-   */
-  static invalid(isInvalid: boolean = true): AriaList {
-    return {
-      'aria-invalid': this.isTrueOrFalse(isInvalid)
-    }
-  }
-
-  /**
-   * Get control role.
-   *
-   * Получить роль управления.
-   * @param id Element ID/ Идентификатор элемента
-   * @param controls ARIA controls attribute/ Атрибут ARIA controls
-   * @param haspopup ARIA haspopup attribute/ Атрибут ARIA haspopup
-   * @param expanded ARIA expanded state/ Состояние ARIA expanded
-   */
-  static control(
-    id?: string,
-    controls?: string,
-    haspopup?: AriaList['aria-haspopup'],
-    expanded?: boolean
-  ): AriaList {
-    return {
-      id,
-      'aria-controls': controls,
-      ...this.haspopup(haspopup),
-      ...this.expanded(expanded)
-    }
-  }
-
-  /**
-   * Get ARIA hidden attribute.
-   *
-   * Получить атрибут ARIA hidden.
-   * @param isHidden is hidden/ является скрытым
-   */
-  static hidden(
-    isHidden: boolean = true
-  ): AriaList {
-    return {
-      'aria-hidden': this.isTrueOrFalse(isHidden)
-    }
-  }
-
-  /**
-   * Get ARIA live attribute.
-   *
-   * Получить атрибут ARIA live.
-   * @param live ARIA live attribute/ Атрибут ARIA live
-   */
-  static live(
-    live?: AriaList['aria-live']
-  ): AriaList {
-    return {
-      'aria-live': live
-    }
-  }
-
-  /**
-   * Get modal role.
-   *
-   * Получить модальную роль.
-   * @param isModal is modal/ является модальным
-   * @param ariaLabelledby ARIA labelledby attribute/ Атрибут ARIA labelledby
-   * @param ariaDescribedby ARIA describedby attribute/ Атрибут ARIA describedby
-   */
-  static modal(
-    isModal: boolean = true,
-    ariaLabelledby?: string,
-    ariaDescribedby?: string
-  ): AriaList {
-    return {
-      ...this.isDataToData('aria-modal', isModal),
-      ...this.labelledby(ariaLabelledby),
-      ...this.describedby(ariaDescribedby)
-    }
-  }
-
-  /**
-   * Returns ARIA value now, min and max.
-   *
-   * Возвращает ARIA value now, min и max.
-   * @param value Current value/ Текущее значение
-   * @param min Minimum value/ Минимальное значение
-   * @param max Maximum value/ Максимальное значение
-   */
-  static valueMinMax(
-    value?: string | number,
-    min?: string | number,
-    max?: string | number
-  ): AriaList {
-    return {
-      'aria-valuenow': value,
-      'aria-valuemin': min,
-      'aria-valuemax': max
-    }
-  }
-
-  /**
-   * Returns 'true' or 'false' based on the boolean value.
-   *
-   * Возвращает 'true' или 'false' в зависимости от булевого значения.
-   * @param value boolean value/ булевое значение
-   */
-  static isTrueOrFalse(value?: boolean): AriaTrueOrFalse | undefined {
-    return value ? 'true' : 'false'
-  }
-
-  /**
-   * Returns data as ARIA attribute.
-   *
-   * Возвращает данные в виде ARIA атрибута.
-   * @param name attribute name/ имя атрибута
-   * @param value attribute value/ значение атрибута
-   */
-  protected static isDataToData<V>(
-    name: string,
-    value?: V
-  ): AriaList {
-    if (value) {
-      return {
-        [name]: value
-      }
-    }
-
-    return {}
-  }
-}