@webitel/ui-sdk 24.12.75 → 24.12.78

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "24.12.75",
+  "version": "24.12.78",
   "private": false,
   "scripts": {
     "dev": "vite",
@@ -16,6 +16,7 @@
     "docs:dev": "vitepress dev docs --port 8080",
     "docs:build": "vitepress build docs",
     "docs:preview": "vitepress preview docs",
+    "tsc": "vue-tsc -p tsconfig.json",
     "update-node": "nvm install --lts && nvm alias default node"
   },
   "main": "./dist/@webitel/ui-sdk.mjs",

package/src/components/wt-empty/wt-empty.vue

@@ -131,8 +131,8 @@
 
 import { computed, useSlots } from 'vue';
 
-import ComponentSize from '../../enums/ComponentSize/ComponentSize.enum.js';
-import { greaterOrEqual, smallerOrEqual } from '../../scripts/compareSize.ts';
+import { ComponentSize } from '../../enums/ComponentSize/ComponentSize';
+import { greaterOrEqual, smallerOrEqual } from '../../scripts/compareSize';
 import WtImage from '../wt-image/wt-image.vue';
 
 const props = defineProps({

package/src/components/wt-popup/wt-popup.vue

@@ -4,20 +4,19 @@
     :class="[`wt-popup--size-${size}`, { 'wt-popup--overflow': overflow }]"
     class="wt-popup"
   >
-
-<!--    &lt;!&ndash;  @slot check source code for scoped bindings :( &ndash;&gt;-->
-<!--    <slot-->
-<!--      class="wt-popup-activator"-->
-<!--      name="activator"-->
-<!--      v-bind="{-->
-<!--    shown: wrapperShown,-->
-<!--    size,-->
-<!--    disabled,-->
-<!--    open: openPopup,-->
-<!--    close: closePopup,-->
-<!--    toggle: togglePopup,-->
-<!--  } as ActivatorSlotScope"-->
-<!--    />-->
+    <!--    &lt;!&ndash;  @slot check source code for scoped bindings :( &ndash;&gt;-->
+    <!--    <slot-->
+    <!--      class="wt-popup-activator"-->
+    <!--      name="activator"-->
+    <!--      v-bind="{-->
+    <!--    shown: wrapperShown,-->
+    <!--    size,-->
+    <!--    disabled,-->
+    <!--    open: openPopup,-->
+    <!--    close: closePopup,-->
+    <!--    toggle: togglePopup,-->
+    <!--  } as ActivatorSlotScope"-->
+    <!--    />-->
 
     <transition-slide :offset="[0, -1440 / 2]">
       <aside
@@ -54,10 +53,10 @@
 </template>
 
 <script lang="ts" setup>
-import {TransitionSlide} from '@morev/vue-transitions';
-import {computed, defineEmits, defineProps, ref, watch} from 'vue';
+import { TransitionSlide } from '@morev/vue-transitions';
+import { computed, defineEmits, defineProps, ref, watch } from 'vue';
 
-import {ComponentSize} from "../../enums/ComponentSize/ComponentSize.enum.ts";
+import { ComponentSize } from '../../enums/ComponentSize/ComponentSize';
 
 interface Props {
   /**
@@ -80,7 +79,7 @@ interface Props {
 }
 
 const props = withDefaults(defineProps<Props>(), {
-  shown: true,  // TODO: change me to false after refactor
+  shown: true, // TODO: change me to false after refactor
   size: ComponentSize.MD,
   overflow: false,
   disabled: false,
@@ -109,10 +108,9 @@ const slots = defineSlots<{
 }>();
 const activatorMode = !!slots.activator;
 
-const wrapperShown = ref(false);
+const wrapperShown = ref(props.shown);
 const isCloseAnimationPlaying = ref(false);
 
-
 const openPopup = () => {
   wrapperShown.value = true;
 };
@@ -142,7 +140,6 @@ const showPopupComponent = computed(() => {
 watch(
   () => props.shown,
   (value) => {
-
     /*
      * prop shown default value =true is used to allow backwards compatibility with
      * older wt-popup API, when popup visibility was controlled simply by v-if
@@ -153,14 +150,12 @@ watch(
      */
     if (activatorMode) return;
 
-
     if (value) {
       openPopup();
     } else {
       closePopup();
     }
   },
-  {immediate: true}
 );
 
 watch(wrapperShown, (value) => {
@@ -170,7 +165,6 @@ watch(wrapperShown, (value) => {
     emit('popup:closed');
   }
 });
-
 </script>
 
 <style lang="scss">

package/src/components/wt-tree/types/WtTreeMode.ts

@@ -0,0 +1,6 @@
+export const WtTreeMode = {
+  Tree: 'tree',
+  List: 'list',
+} as const;
+
+export type WtTreeMode = (typeof WtTreeMode)[keyof typeof WtTreeMode];

package/src/components/wt-tree/wt-tree.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="wt-tree">
     <div
-      v-if="mode === WtTreeMode.TREE"
+      v-if="mode === WtTreeMode.Tree"
       class="wt-tree__content"
     >
       <wt-tree-line
@@ -16,7 +16,7 @@
       />
     </div>
     <div
-      v-if="mode === WtTreeMode.LIST"
+      v-if="mode === WtTreeMode.List"
       class="wt-tree__list-content"
     >
       <span
@@ -46,7 +46,7 @@ import deepEqual from 'deep-equal';
 import { computed } from 'vue';
 
 import WtTreeLine from '../wt-tree-line/wt-tree-line.vue';
-import { WtTreeMode } from './types/wt-tree-mode.ts';
+import { WtTreeMode } from './types/WtTreeMode';
 
 const props = withDefaults(
   defineProps<{
@@ -78,7 +78,7 @@ const props = withDefaults(
   }>(),
   {
     childrenProp: 'children',
-    mode: WtTreeMode.TREE,
+    mode: WtTreeMode.Tree,
   },
 );
 

package/src/components/wt-tree-table/wt-tree-table.vue

@@ -92,9 +92,9 @@
 <script setup lang="ts">
 import { computed, withDefaults } from 'vue';
 
-import { useWtTable } from '../../composables/useWtTable/useWtTable.ts';
+import { useWtTable } from '../../composables/useWtTable/useWtTable';
 import { getNextSortOrder } from '../../scripts/sortQueryAdapters';
-import { WtTableHeader } from '../wt-table/types/WtTable.type.ts';
+import type { WtTableHeader } from '../wt-table/types/WtTable.d.ts';
 import WtTreeTableRow from '../wt-tree-table-row/wt-tree-table-row.vue';
 
 const props = withDefaults(

package/src/components/wt-tree-table-row/wt-tree-table-row.vue

@@ -114,7 +114,7 @@ import { computed, onMounted, ref } from 'vue';
 
 import WtCheckbox from '../wt-checkbox/wt-checkbox.vue';
 import WtIconBtn from '../wt-icon-btn/wt-icon-btn.vue';
-import { WtTableHeader } from "../wt-table/types/WtTable.type.ts";
+import type { WtTableHeader } from '../wt-table/types/WtTable.d.ts';
 
 const props = withDefaults(
   defineProps<{

package/src/composables/useWtTable/useWtTable.ts

@@ -1,7 +1,7 @@
 import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
 
-import { WtTableHeader } from '../../components/wt-table/types/WtTable.type.ts';
+import type { WtTableHeader } from '../../components/wt-table/types/WtTable.d.ts';
 
 export const useWtTable = ({ headers }) => {
   const { t } = useI18n();

package/src/css/styleguide/placeholder/_placeholder.scss

@@ -1,7 +1,7 @@
 // https://stackoverflow.com/a/17181946/17782185
 // https://stackoverflow.com/a/49192800/17782185
 @use "sass:selector";
-
+///піу
 //@mixin optional-at-root($sel) {
 //  @at-root #{if(not &, $sel, selector-append(&, $sel))} {
 //    @content;

package/src/enums/ComponentSize/ComponentSize.js

@@ -0,0 +1,11 @@
+export const ComponentSize = {
+    XXXS: '3xs',
+    XXS: '2xs',
+    XS: 'xs',
+    SM: 'sm',
+    MD: 'md',
+    LG: 'lg',
+    XL: 'xl',
+    XXL: '2xl',
+    XXXL: '3xl',
+};

package/src/enums/ComponentSize/ComponentSize.ts

@@ -0,0 +1,13 @@
+export const ComponentSize = {
+  XXXS: '3xs',
+  XXS: '2xs',
+  XS: 'xs',
+  SM: 'sm',
+  MD: 'md',
+  LG: 'lg',
+  XL: 'xl',
+  XXL: '2xl',
+  XXXL: '3xl',
+} as const;
+
+export type ComponentSize = (typeof ComponentSize)[keyof typeof ComponentSize];

package/src/enums/WebitelApplications/AdminSections.enum.js

@@ -1,54 +1,13 @@
-const AdminSections = Object.freeze({
-  // DIRECTORY
-  LICENSE: 'license', // permissions: add
-  USERS: 'users', // scope: users
-  DEVICES: 'devices', // scope: devices
-
-  // ROUTING
-  FLOW: 'flow', // scope: flow
-  DIALPLAN: 'dialplan', // scope: acr_routing
-  GATEWAYS: 'gateways', // scope: gateways
-  CHATPLAN: 'chatplan', // scope: acr_routing
-  CHAT_GATEWAYS: 'chat-gateways', // scope: chats
-
-  // LOOKUPS
-  BLACKLIST: 'blacklist', // scope: cc_list
-  REGIONS: 'regions', // scope: lookups
-  CALENDARS: 'calendars', // scope: calendars
-  COMMUNICATIONS: 'communications', // scope: lookups
-  PAUSE_CAUSE: 'pause-cause', // scope: lookups
-  MEDIA: 'media', // scope: media_file
-  SHIFT_TEMPLATES: 'shift-templates', // scope: shift_templates
-  PAUSE_TEMPLATES: 'pause-templates', //scope: pause_templates
-  WORKING_CONDITIONS: 'working-conditions', //scope: working_conditions
-
-  // CONTACT CENTER
-  SKILLS: 'skills', // scope: lookups
-  AGENTS: 'agents', // scope: cc_agent
-  BUCKETS: 'buckets', // scope: cc_bucket
-  QUEUES: 'queues', // scope: cc_queue
-  MEMBERS: 'members', // scope: cc_queue
-  RESOURCE_GROUPS: 'resource-groups', // scope: cc_resource_group
-  RESOURCES: 'resources', // scope: cc_resource
-  TEAMS: 'teams', // scope: cc_team
-
-  // INTEGRATIONS
-  STORAGE: 'storage', // scope: storage_profile
-  STORAGE_POLICIES: 'storage-policies', // scope: storage_policies_profile
-  COGNITIVE_PROFILES: 'cognitive-profiles', // scope: cognitive_profile
-  EMAIL_PROFILES: 'email-profiles', // scope: email_profile
-  SINGLE_SIGN_ON: 'single-sign-on', // scope: single-sign-on
-  IMPORT_CSV: 'import-csv',
-  TRIGGERS: 'triggers',
-
-  // PERMISSIONS
-  OBJECTS: 'objects', // permissions: add
-  ROLES: 'roles', // scope: roles
-
-  // SYSTEM
-  CHANGELOGS: 'changelogs',
-  CONFIGURATION: 'configuration',
-  GLOBAL_VARIABLES: 'global-variables',
-});
-
-export default AdminSections;
+import { AdminSections } from './AdminSections';
+
+/**
+ * @deprecated
+ * default export is for backward compatibility,
+ * use ts enum instead (and don't forget to compile it)
+ */
+export default Object.fromEntries(
+  Object.entries(AdminSections).map(([key, value]) => [
+    key.toUpperCase(),
+    value,
+  ]),
+);

package/src/enums/WebitelApplications/AdminSections.ts

@@ -0,0 +1,46 @@
+/**
+ * @augments WtApplication
+ * represents ui sections in Admin WtApplication
+ * without any relation to WtObjects (?)
+ */
+export const AdminSections = {
+  Agents: 'agents',
+  Blacklist: 'blacklist',
+  Buckets: 'buckets',
+  Calendars: 'calendars',
+  Changelogs: 'changelogs',
+  ChatGateways: 'chat-gateways',
+  Chatplan: 'chatplan',
+  CognitiveProfiles: 'cognitive-profiles',
+  Communications: 'communications',
+  Configuration: 'configuration',
+  Dialplan: 'dialplan',
+  Devices: 'devices',
+  EmailProfiles: 'email-profiles',
+  Flow: 'flow',
+  Gateways: 'gateways',
+  GlobalVariables: 'global-variables',
+  ImportCsv: 'import-csv',
+  License: 'license',
+  Media: 'media',
+  Members: 'members',
+  Objects: 'objects',
+  PauseCause: 'pause-cause',
+  PauseTemplates: 'pause-templates',
+  Queues: 'queues',
+  Regions: 'regions',
+  ResourceGroups: 'resource-groups',
+  Resources: 'resources',
+  Roles: 'roles',
+  ShiftTemplates: 'shift-templates',
+  SingleSignOn: 'single-sign-on',
+  Skills: 'skills',
+  Storage: 'storage',
+  StoragePolicies: 'storage-policies',
+  Teams: 'teams',
+  Triggers: 'triggers',
+  Users: 'users',
+  WorkingConditions: 'working-conditions',
+} as const;
+
+export type AdminSections = (typeof AdminSections)[keyof typeof AdminSections];

package/src/enums/WebitelApplications/AuditorSections.enum.js

@@ -1,5 +1,13 @@
-const AuditorSections = Object.freeze({
-  SCORECARDS: 'scorecards',
-});
+import { AuditorSections } from './AuditorSections';
 
-export default AuditorSections;
+/**
+ * @deprecated
+ * default export is for backward compatibility,
+ * use ts enum instead (and don't forget to compile it)
+ */
+export default Object.fromEntries(
+  Object.entries(AuditorSections).map(([key, value]) => [
+    key.toUpperCase(),
+    value,
+  ]),
+);

package/src/enums/WebitelApplications/AuditorSections.ts

@@ -0,0 +1,6 @@
+export const AuditorSections = {
+  Scorecards: 'scorecards',
+} as const;
+
+export type AuditorSections =
+  (typeof AuditorSections)[keyof typeof AuditorSections];

package/src/enums/WebitelApplications/CrmSections.enum.js

@@ -1,17 +1,10 @@
-const CrmSections = Object.freeze({
-  CONTACTS: 'contacts',
-  CASES: 'cases',
+import { CrmSections } from './CrmSections';
 
-  // CONFIGURATION - LOOKUPS
-  SLAS: 'slas',
-  SERVICE_CATALOGS: 'service-catalogs',
-  PRIORITIES: 'priorities',
-  STATUSES: 'statuses',
-  SOURCES: 'sources',
-  CLOSE_REASON_GROUPS: 'close-reason-groups',
-  CONTACT_GROUPS: 'contact-groups',
-  CASE_SOURCES: 'case-sources',
-  CUSTOM_LOOKUPS: 'custom-lookups',
-});
-
-export default CrmSections;
+/**
+ * @deprecated
+ * default export is for backward compatibility,
+ * use ts enum instead (and don't forget to compile it)
+ */
+export default Object.fromEntries(
+  Object.entries(CrmSections).map(([key, value]) => [key.toUpperCase(), value]),
+);

package/src/enums/WebitelApplications/CrmSections.ts

@@ -0,0 +1,17 @@
+export const CrmSections = {
+    Contacts: 'contacts',
+    Cases: 'cases',
+
+    // CONFIGURATION - LOOKUPS
+    Slas: 'slas',
+    ServiceCatalogs: 'service-catalogs',
+    Priorities: 'priorities',
+    Statuses: 'statuses',
+    Sources: 'sources',
+    CloseReasonGroups: 'close-reason-groups',
+    ContactGroups: 'contact-groups',
+    CaseSources: 'case-sources',
+    CustomLookups: 'custom-lookups',
+} as const;
+
+export type CrmSections = typeof CrmSections[keyof typeof CrmSections];

package/src/enums/WebitelApplications/SupervisorSections.enum.js

@@ -1,7 +1,13 @@
-const SupervisorSections = Object.freeze({
-  QUEUES: 'queues',
-  AGENTS: 'agents',
-  ACTIVE_CALLS: 'activeCalls',
-});
+import { SupervisorSections } from './SupervisorSections';
 
-export default SupervisorSections;
+/**
+ * @deprecated
+ * default export is for backward compatibility,
+ * use ts enum instead (and don't forget to compile it)
+ */
+export default Object.fromEntries(
+  Object.entries(SupervisorSections).map(([key, value]) => [
+    key.toUpperCase(),
+    value,
+  ]),
+);

package/src/enums/WebitelApplications/SupervisorSections.ts

@@ -0,0 +1,8 @@
+export const SupervisorSections = {
+  Queues: 'queues',
+  Agents: 'agents',
+  ActiveCalls: 'activeCalls',
+} as const;
+
+export type SupervisorSections =
+  (typeof SupervisorSections)[keyof typeof SupervisorSections];

package/src/enums/WebitelApplications/WebitelApplications.enum.js

@@ -1,11 +1,13 @@
-const WebitelApplications = Object.freeze({
-  ADMIN: 'admin',
-  AGENT: 'agent',
-  SUPERVISOR: 'supervisor',
-  HISTORY: 'history',
-  AUDIT: 'audit',
-  ANALYTICS: 'grafana',
-  CRM: 'crm',
-});
+import { WtApplication } from './WtApplication';
 
-export default WebitelApplications;
+/**
+ * @deprecated
+ * default export is for backward compatibility,
+ * use ts enum instead (and don't forget to compile it)
+ */
+export default Object.fromEntries(
+  Object.entries(WtApplication).map(([key, value]) => [
+    key.toUpperCase(),
+    value,
+  ]),
+);

package/src/enums/WebitelApplications/WtApplication.ts

@@ -0,0 +1,11 @@
+export const WtApplication = {
+  Admin: 'admin',
+  Agent: 'agent',
+  Supervisor: 'supervisor',
+  History: 'history',
+  Audit: 'audit',
+  Analytics: 'grafana',
+  Crm: 'crm',
+} as const;
+
+export type WtApplication = (typeof WtApplication)[keyof typeof WtApplication];

package/src/enums/WtObject/WtObject.ts

@@ -0,0 +1,11 @@
+/**
+ * Represents existing Webitel entities
+ */
+export const WtObject = {
+  Agent: 'agent',
+  Queue: 'queue',
+  Contact: 'contact',
+  Regions: 'regions',
+} as const;
+
+export type WtObject = (typeof WtObject)[keyof typeof WtObject];

package/src/enums/index.js

@@ -1,31 +1,29 @@
 import AbstractUserStatus from './AbstractUserStatus/AbstractUserStatus.enum.js';
 import AgentStatus from './AgentStatus/AgentStatus.enum.js';
 import ChatGatewayProvider from './ChatGatewayProvider/ChatGatewayProvider.enum.js';
-import ComponentSize from './ComponentSize/ComponentSize.enum.js';
+import { ComponentSize } from './ComponentSize/ComponentSize';
 import IconAction from './IconAction/IconAction.enum.js';
 import QueueType from './QueueType/QueueType.enum.js';
 import TypesExportedSettings from './TypesExportedSettings/TypesExportedSettings.enum.js';
-
-// Webitel Applications group
-import AdminSections from './WebitelApplications/AdminSections.enum.js';
+import { AdminSections } from './WebitelApplications/AdminSections';
 import AuditorSections from './WebitelApplications/AuditorSections.enum.js';
 import CrmSections from './WebitelApplications/CrmSections.enum.js';
 import SupervisorSections from './WebitelApplications/SupervisorSections.enum.js';
 import WebitelApplications from './WebitelApplications/WebitelApplications.enum.js';
+import { WtObject } from './WtObject/WtObject';
 
 export {
   AbstractUserStatus,
+  AdminSections,
   AgentStatus,
+  AuditorSections,
   ChatGatewayProvider,
   ComponentSize,
+  CrmSections,
   IconAction,
   QueueType,
-  TypesExportedSettings,
-
-  // Webitel Applications group
-  AdminSections,
-  AuditorSections,
-  CrmSections,
   SupervisorSections,
+  TypesExportedSettings,
   WebitelApplications,
+  WtObject,
 };

package/src/locale/en/en.js

@@ -80,6 +80,7 @@ export default {
   },
   // yak zhe ya zaebalsya povtoriaty odni i ti sami slova!!!!
   vocabulary: {
+    apply: 'Apply',
     language: 'Language',
     voice: 'Voice',
     format: 'Format',
@@ -90,7 +91,7 @@ export default {
     login: 'Login',
     host: 'Host',
     time: 'Time',
-    channel: 'Channel',
+    channel: 'Channel | Channels',
     file: 'File',
     logout: 'Logout',
     priority: 'Priority | Priorities',
@@ -266,6 +267,7 @@ export default {
         [AdminSections.RESOURCE_GROUPS]: 'Resource groups',
         [AdminSections.QUEUES]: 'Queues',
         [AdminSections.STORAGE]: 'Storage',
+        [AdminSections.STORAGE_POLICIES]: 'Storage policies',
         [AdminSections.COGNITIVE_PROFILES]: 'Cognitive profiles',
         [AdminSections.EMAIL_PROFILES]: 'Email profiles',
         [AdminSections.SINGLE_SIGN_ON]: 'Single Sign-on',
@@ -300,6 +302,8 @@ export default {
     domainValidator: 'Incorrect domain',
     decimalValidator:
       'Decimal precision should be no more than { count } places',
+    latinWithNumber:
+      'The code must contain only letters (A-Z, a-z) and numbers (0-9)',
     integer: 'The field should contain only whole numbers',
   },
   webitelUI: {

package/src/locale/ru/ru.js

@@ -79,6 +79,7 @@ export default {
     draggable: 'Перетащить',
   },
   vocabulary: {
+    apply: 'Применить',
     language: 'Язык',
     voice: 'Голос',
     format: 'Формат',
@@ -89,7 +90,7 @@ export default {
     login: 'Логин',
     host: 'Хост',
     time: 'Время',
-    channel: 'Канал',
+    channel: 'Канал | Каналы',
     file: 'Файл',
     logout: 'Выйти',
     priority: 'Приоритет | Приоритеты',
@@ -265,6 +266,7 @@ export default {
         [AdminSections.RESOURCE_GROUPS]: 'Группы ресурсов',
         [AdminSections.QUEUES]: 'Очереди',
         [AdminSections.STORAGE]: 'Хранилища',
+        [AdminSections.STORAGE_POLICIES]: 'Политики хранения файлов',
         [AdminSections.COGNITIVE_PROFILES]: 'Голосовые профили',
         [AdminSections.EMAIL_PROFILES]: 'Email профили',
         [AdminSections.SINGLE_SIGN_ON]: 'Single Sign-on',
@@ -298,6 +300,8 @@ export default {
     domainValidator: 'Неправильный домен',
     decimalValidator:
       'Количество десятичных знаков не должно быть больше { count }',
+    latinWithNumber:
+      'Код должен содержать только буквы (A-Z, a-z) и цифры (0-9)',
     integer: 'Поле должно содержать только целые числа',
   },
   webitelUI: {

package/src/locale/ua/ua.js

@@ -80,6 +80,7 @@ export default {
     draggable: 'Перетягнути',
   },
   vocabulary: {
+    apply: 'Застосувати',
     language: 'Мова',
     voice: 'Голос',
     format: 'Формат',
@@ -90,7 +91,7 @@ export default {
     login: 'Логін',
     host: 'Хост',
     time: 'Час',
-    channel: 'Канал',
+    channel: 'Канал | Канали',
     file: 'Файл',
     logout: 'Вийти',
     priority: 'Пріоритет | Пріоритети',
@@ -265,6 +266,7 @@ export default {
         [AdminSections.RESOURCE_GROUPS]: 'Групи ресурсів',
         [AdminSections.QUEUES]: 'Черги',
         [AdminSections.STORAGE]: 'Сховища',
+        [AdminSections.STORAGE_POLICIES]: 'Політики збереження файлів',
         [AdminSections.COGNITIVE_PROFILES]: 'Голосові профілі',
         [AdminSections.EMAIL_PROFILES]: 'Email профілі',
         [AdminSections.SINGLE_SIGN_ON]: 'Single Sign-on',
@@ -298,6 +300,8 @@ export default {
     domainValidator: 'Невірний домен',
     decimalValidator:
       'Кількість десяткових знаків не повинна бути більше { count }',
+    latinWithNumber:
+      'Код повинен містити лише літери (A-Z, a-z) та цифри (0-9)',
     integer: 'Поле повинно містити лише цілі числа',
   },
   webitelUI: {

package/src/scripts/compareSize.ts

@@ -1,4 +1,4 @@
-import {ComponentSize} from '../enums/ComponentSize/ComponentSize.enum.ts';
+import { ComponentSize } from '../enums/ComponentSize/ComponentSize';
 
 const numerics = Object.values(ComponentSize).reduce((nums, size, index) => {
   return {