bfg-common 1.5.215 → 1.5.216

package/CODE_STYLE.md

@@ -1,109 +1,109 @@
-![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
-## Javascript
-
-### Название переменных
-
-Используем camelCase:
-```javascript
-const theExample = 0
-```
-
-Название переменных должно быть содержательным:
-```javascript
-const desc = 'some description' // Плохо
-
-const description = 'some description' // Хорошо
-```
-
-Если переменная типа boolean, используем префиксы is или has:
-```javascript
-const isDisabled = true
-
-const hasName = false
-```
-
-Приоритетно используем стрелочные функции:
-```javascript
-const example = () => {...}
-```
-
----
-
-![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white)
-## Typescript
-
-### Interface
-Название интерфейсов начинаем с префикса **I_** (также есть **API_**, **UI_**, подробно об этом написано в файле PROJECT_STRUCTURE.md):
-```typescript
-interface I_Example
-```
-
-### Type
-Название типов начинаем с префикса **T_**:
-```typescript
-type T_Example
-```
-
-### Enum
-Название enum начинаем с префикса **E_**:
-```typescript
-enum E_Example
-```
-
-P.S. Нужно писать как можно более понятные типы.
-
----
-
-![Vue.js](https://img.shields.io/badge/Vue.js-35495E?style=for-the-badge&logo=vue.js&logoColor=4FC08D)
-## Vue
-
-### Название тегов
-Используем kebab-case:
-```html
-<the-button>Button</the-button>
-```
-
-### Название тега
-Название тега не должно состоять из одного слова:
-```html
-<example></example> // Плохо
-
-<the-example></the-example> // Хорошо
-```
-
-### Использование "the" в названии тега 
-Если название тега, к примеру, icon, должно быть так:
-```html
-<the-icon></the-icon>
-```
-
-### Использование самозакрывающихся тегов
-Если в тег ничего не передаем, то используем его как самозакрывающийся:
-```html
-<the-icon/>
-```
-
-### Props / Emits
-Props пишем в kebab-case:
-```html
-<the-example my-name="Name"/>
-```
-
-Emits пишем в kebab-case, ключ первого аргумента всегда "event", а второго - "value":
-```javascript
-const emits = defineEmits<{
-  (event: 'change-name', value: string): void
-}>()
-``` 
-
-### Composition API
-Так как у нас используется Composition API, нужно весь код группировать по блокам:
-```javascript
-const isShowModal = ref<boolean>(false)
-const toggleModal = (): void => isShowModal.value = !isShowModal.value
-
-const errors = ref<string[]>([])
-const updateErrors = (newErrors: string[]): void => {
-    errors.value = newErrors
-}
-``` 
+![JavaScript](https://img.shields.io/badge/JavaScript-F7DF1E?style=for-the-badge&logo=javascript&logoColor=black)
+## Javascript
+
+### Название переменных
+
+Используем camelCase:
+```javascript
+const theExample = 0
+```
+
+Название переменных должно быть содержательным:
+```javascript
+const desc = 'some description' // Плохо
+
+const description = 'some description' // Хорошо
+```
+
+Если переменная типа boolean, используем префиксы is или has:
+```javascript
+const isDisabled = true
+
+const hasName = false
+```
+
+Приоритетно используем стрелочные функции:
+```javascript
+const example = () => {...}
+```
+
+---
+
+![TypeScript](https://img.shields.io/badge/TypeScript-007ACC?style=for-the-badge&logo=typescript&logoColor=white)
+## Typescript
+
+### Interface
+Название интерфейсов начинаем с префикса **I_** (также есть **API_**, **UI_**, подробно об этом написано в файле PROJECT_STRUCTURE.md):
+```typescript
+interface I_Example
+```
+
+### Type
+Название типов начинаем с префикса **T_**:
+```typescript
+type T_Example
+```
+
+### Enum
+Название enum начинаем с префикса **E_**:
+```typescript
+enum E_Example
+```
+
+P.S. Нужно писать как можно более понятные типы.
+
+---
+
+![Vue.js](https://img.shields.io/badge/Vue.js-35495E?style=for-the-badge&logo=vue.js&logoColor=4FC08D)
+## Vue
+
+### Название тегов
+Используем kebab-case:
+```html
+<the-button>Button</the-button>
+```
+
+### Название тега
+Название тега не должно состоять из одного слова:
+```html
+<example></example> // Плохо
+
+<the-example></the-example> // Хорошо
+```
+
+### Использование "the" в названии тега 
+Если название тега, к примеру, icon, должно быть так:
+```html
+<the-icon></the-icon>
+```
+
+### Использование самозакрывающихся тегов
+Если в тег ничего не передаем, то используем его как самозакрывающийся:
+```html
+<the-icon/>
+```
+
+### Props / Emits
+Props пишем в kebab-case:
+```html
+<the-example my-name="Name"/>
+```
+
+Emits пишем в kebab-case, ключ первого аргумента всегда "event", а второго - "value":
+```javascript
+const emits = defineEmits<{
+  (event: 'change-name', value: string): void
+}>()
+``` 
+
+### Composition API
+Так как у нас используется Composition API, нужно весь код группировать по блокам:
+```javascript
+const isShowModal = ref<boolean>(false)
+const toggleModal = (): void => isShowModal.value = !isShowModal.value
+
+const errors = ref<string[]>([])
+const updateErrors = (newErrors: string[]): void => {
+    errors.value = newErrors
+}
+``` 

package/assets/localization/local_be.json

@@ -1349,7 +1349,7 @@
     "selectSwitch": "Выберыце перамыкач",
     "selectTargetDevice": "Выберыце мэтавае прылада",
     "selectTargetDeviceForNewConnection": "Выберыце мэтавае прылада для новага падключэння.",
-    "selectValidClusterOrHostDestination": "Выберыце кластар, хост або пул рэсурсаў у якасці месца прызначэння.",
+    "selectValidClusterOrHostDestination": "Абярыце кластар, вузел і пул рэсурсаў.",
     "selectValidDestinationStorage": "Выберыце сапраўднае сховішча прызначэння.",
     "selectVmKernelAdapter": "Выберыце адаптар VMkernel",
     "send": "Адправіць",
@@ -1752,7 +1752,7 @@
     "commands": "Каманда",
     "perc": "Пярко",
     "bytes": "Байт",
-    "vmNameValidationDescription": "Імя павінна ўтрымліваць лацінскія літары, лічбы, '-', '_', '.' і павінна ўтрымліваць ад 5 да 54 знакаў. Калі прапусціць дадзены крок, сістэма згенеруе імя аўтаматычна.",
+    "vmNameValidationDescription": "Імя павінна ўтрымліваць лацінскія літары, лічбы, '-','_','.'і павінна ўтрымліваць ад 5 да 54 знакаў. Калі прапусціць дадзены крок, сістэма згенеруе імя аўтаматычна",
     "tokens": "Tokens",
     "deleteToken": "Выдаліць маркер",
     "deleteTokenDesc": "Вы хочаце выдаліць выбраны токен?",

package/assets/localization/local_en.json

@@ -329,7 +329,7 @@
     "custom": "Custom",
     "customAttributes": "Custom Attributes",
     "customerImprovementProgram": "Customer Experience Improvement Program",
-    "customizeHardware": "Customize Hardware",
+    "customizeHardware": "Customize hardware",
     "daemon": "Daemon",
     "datacenter": "Datacenter",
     "dataCenter": "DataCenter",
@@ -1311,11 +1311,11 @@
     "selectCompatibility": "Select compatibility",
     "selectCompatibilityVirtualMachineDependingHostsYourEnvironment": "Select compatibility for this virtual machine depending on the host in your environment",
     "selectCompatibilityVmDependingHostsEnvironment": "Select compatibility for this virtual machine depending on the host in your environment",
-    "selectComputeResource": "Select a Compute Resource",
+    "selectComputeResource": "Select a compute resource",
     "selectConfiguration": "select a configuration",
     "selectConnectionType": "Select connection type",
     "selectConnectionTypeToCreate": "Select a connection type to create.",
-    "selectCreationType": "Select a Creation Type",
+    "selectCreationType": "Select a creation type",
     "selectDatastoreClusterDatastore": "Select a datastore cluster or datastore",
     "selectDatastoreName": "Select a name",
     "selectDestination": "Select Destination",
@@ -1328,7 +1328,7 @@
     "selectExistingSwitch": "Select an existing switch",
     "selectFeedbackType": "Select a feedback type first",
     "selectFile": "Select File",
-    "selectGuestOS": "Select a Guest OS",
+    "selectGuestOS": "Select a guest OS",
     "selectGuestOSMachineType": "Select a guest OS and Machine Type",
     "selectHardware": "Select Hardware",
     "selectHost": "Select a host",
@@ -1339,16 +1339,16 @@
     "selectLocationForVirtualMachines": "Select a location for this host's virtual machines.",
     "selectLocationVirtualMachine": "Select a location for the virtual machine.",
     "selectName": "Select a name",
-    "selectNameFolder": "Select a Name and Folder",
+    "selectNameFolder": "Select a name and folder",
     "selectNetwork": "Select Network",
     "selectNfsVersion": "Select the NFS version.",
     "selectPhysicalNetworkAdapterFromListToViewItsDetails": "Select a physical network adapter from the list to view its details.",
-    "selectStorage": "Select Storage",
+    "selectStorage": "Select storage",
     "selectStorageConfigurationDiskFiles": "Select the storage for the configuration and disk files",
     "selectSwitch": "Select Switch",
     "selectTargetDevice": "Select target device",
     "selectTargetDeviceForNewConnection": "Select a target device for the new connection.",
-    "selectValidClusterOrHostDestination": "Select a cluster, host or resource pool as destination.",
+    "selectValidClusterOrHostDestination": "Select a cluster, host, resource pool.",
     "selectValidDestinationStorage": "Select a valid destination storage.",
     "selectVmKernelAdapter": "Select VMkernel adapter",
     "send": "Send",
@@ -1414,7 +1414,7 @@
     "specifyServerName": "The server name cannot be empty. Enter a name.",
     "specifyUniqueName": "Specify a unique name",
     "specifyUniqueNameTargetLocation": "Specify a unique name and target location",
-    "specifyValidClusterOrHostDestination": "Specify a valid cluster, host or resource pool as destination.",
+    "specifyValidClusterOrHostDestination": "Specify a valid cluster, host, resource pool.",
     "specifyVMkernelIPv4Settings": "Specify VMkernel IPv4 settings.",
     "specifyVMkernelPortSettings": "Specify port settings.",
     "sphere": "Sphere",
@@ -1751,7 +1751,7 @@
     "commands": "Commands",
     "perc": "Perc",
     "bytes": "Bytes",
-    "vmNameValidationDescription": "The name must contain Latin letters and numbers, '-', '_', '.' and it must contain from 5 to 54 characters. If you skip this step, the system will generate the name automatically.",
+    "vmNameValidationDescription": "The name must contain Latin letters and numbers, '-','_','.' and it must contain from 5 to 54 characters. If you skip this step, the system will generate the name automatically",
     "tokens": "Tokens",
     "deleteToken": "Delete Token",
     "deleteTokenDesc": "Do you want to delete the selected Token?",

package/assets/localization/local_hy.json

@@ -1348,7 +1348,7 @@
     "selectSwitch": "Ընտրեք անջատիչ",
     "selectTargetDevice": "Ընտրեք թիրախային սարքը",
     "selectTargetDeviceForNewConnection": "Ընտրեք թիրախային սարքը նոր կապի համար:",
-    "selectValidClusterOrHostDestination": "Ընտրեք կլաստեր, հոսթ կամ ռեսուրսների փուլ՝ որպես նշանակության վայր։",
+    "selectValidClusterOrHostDestination": "Որպես նպատակակետ ընտրեք կլաստեր, հոսթ, ռեսուրսների լողավազան:",
     "selectValidDestinationStorage": "Ընտրեք վավեր նպատակային պահեստ:",
     "selectVmKernelAdapter": "Ընտրեք VMkernel ադապտեր",
     "send": "Ուղարկել",
@@ -1751,7 +1751,7 @@
     "commands": "Հրամաններ",
     "perc": "Պերկ",
     "bytes": "Բայթ",
-    "vmNameValidationDescription": "Անունը պետք է պարունակի լատինական տառեր, թվեր, '-', '_', '.' և պետք է պարունակի 5-ից 54 նիշ: Եթե բաց թողնենք այս քայլը, համակարգը ինքնաբերաբար կստեղծի անուն:",
+    "vmNameValidationDescription": "Անունը պետք է պարունակի լատինական տառեր, թվեր, '-','_','.'և պետք է պարունակի 5-ից 54 նիշ: Եթե բաց թողնենք այս քայլը, համակարգը ինքնաբերաբար կստեղծի անուն",
     "tokens": "Tokens",
     "deleteToken": "Ջնջել Token",
     "deleteTokenDesc": "Ցանկանու՞մ եք ջնջել ընտրված Token:",

package/assets/localization/local_kk.json

@@ -1348,7 +1348,7 @@
     "selectSwitch": "Ауыстырғышты таңдаңыз",
     "selectTargetDevice": "Мақсатты құрылғыны таңдаңыз",
     "selectTargetDeviceForNewConnection": "Жаңа қосылым үшін мақсатты құрылғыны таңдаңыз.",
-    "selectValidClusterOrHostDestination": "Кластерді, хостты немесе курортты тек тағайындау ретінде таңдаңыз.",
+    "selectValidClusterOrHostDestination": "Кластерді, торапты және ресурстар пулын таңдаңыз.",
     "selectValidDestinationStorage": "Жарамды мақсатты жадты таңдаңыз.",
     "selectVmKernelAdapter": "Vmkernel адаптерін таңдаңыз",
     "send": "Жіберу",
@@ -1751,7 +1751,7 @@
     "commands": "Командалар",
     "perc": "Жеңілдік",
     "bytes": "Байттар",
-    "vmNameValidationDescription": "Атауында латын әріптері, сандары болуы керек, '-', '_', '.' және 5-тен 54 таңбаға дейін болуы керек. Егер сіз бұл қадамды өткізіп жіберсеңіз, жүйе автоматты түрде атау жасайды.",
+    "vmNameValidationDescription": "Атауында латын әріптері, сандары болуы керек, '-','_','.'және 5-тен 54 таңбаға дейін болуы керек. Егер сіз бұл қадамды өткізіп жіберсеңіз, жүйе автоматты түрде атау жасайды",
     "tokens": "Tokens",
     "deleteToken": "Токенді жою",
     "deleteTokenDesc": "Таңдалған таңбалауышты жою керек пе?",

package/assets/localization/local_ru.json

@@ -1348,7 +1348,7 @@
     "selectSwitch": "Выберите коммутатор",
     "selectTargetDevice": "Выберите целевое устройство.",
     "selectTargetDeviceForNewConnection": "Выберите целевое устройство для нового подключения.",
-    "selectValidClusterOrHostDestination": "Выберите кластер, хост или пул ресурсов в качестве назначения.",
+    "selectValidClusterOrHostDestination": "Выберите кластер, узел, пул ресурсов.",
     "selectValidDestinationStorage": "Выберите действительное целевое хранилище.",
     "selectVmKernelAdapter": "Выберите адаптер VMkernel",
     "send": "Отправить",
@@ -1751,7 +1751,7 @@
     "commands": "Команды",
     "perc": "Перк",
     "bytes": "Байты",
-    "vmNameValidationDescription": "Имя должно содержать латинские буквы, цифры, '-', '_', '.' и должно содержать от 5 до 54 символов. Если пропустить данный шаг, система сгенерирует имя автоматически.",
+    "vmNameValidationDescription": "Имя должно содержать латинские буквы, цифры, '-','_','.' и должно содержать от 5 до 54 символов. Если пропустить данный шаг, система сгенерирует имя автоматически",
     "tokens": "Токены",
     "deleteToken": "Удалить токен",
     "deleteTokenDesc": "Вы хотите удалить выбранный токен?",

package/assets/localization/local_zh.json

@@ -1347,7 +1347,7 @@
     "selectSwitch": "选择开关",
     "selectTargetDevice": "选择目标设备",
     "selectTargetDeviceForNewConnection": "为新连接选择目标设备。",
-    "selectValidClusterOrHostDestination": "选择一个集群、主机或资源池作为目标位置。",
+    "selectValidClusterOrHostDestination": "请选择集群、节点和资源池",
     "selectValidDestinationStorage": "选择一个有效的目标存储。",
     "selectVmKernelAdapter": "选择VMkernel适配器",
     "send": "发送",
@@ -1750,7 +1750,7 @@
     "commands": "命令",
     "perc": "全氯乙烯",
     "bytes": "字节",
-    "vmNameValidationDescription": "名称必须包含拉丁字母、数字、'-' 、'_' 、'.' 。 并且必须包含 5 到 54 个字符。 如果跳过此步骤，系统会自动生成一个名称。",
+    "vmNameValidationDescription": "名称必须包含拉丁字母、数字、'-'、'_'、'.'。 并且必须包含 5 到 54 个字符。 如果跳过此步骤，系统会自动生成一个名称",
     "tokens": "Tokens",
     "deleteToken": "删除令牌",
     "deleteTokenDesc": "您想删除选定的令牌吗？",

package/assets/scss/common/normalize.scss

@@ -320,7 +320,6 @@ li {
     min-width: 30ch;
   }
 }
-//TODO remove with old design
 .description {
   color: var(--global-font-color) !important;
 }

package/components/atoms/TheIcon3.vue

@@ -1,50 +1,50 @@
-<template>
-  <template v-if="props.name === 'zabbix'">
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="80"
-      height="22"
-      viewBox="0 0 80 22"
-      fill="none"
-    >
-      <g clip-path="url(#clip0_2691_29714)">
-        <path d="M0 0.522461H80V21.477H0V0.522461Z" fill="#D40000" />
-        <path
-          d="M3.42089 3.71582H14.9889V5.2187L5.6782 16.625H15.2164V18.2836H3.19336V16.7807L12.504 5.37438H3.42089V3.71582ZM23.0402 5.65779L20.3378 12.9087H25.7526L23.0402 5.65779ZM21.9145 3.71582H24.1738L29.7862 18.2836H27.7145L26.3753 14.5473H19.735L18.3938 18.2836H16.2922L21.9145 3.71582ZM33.9176 11.326V16.663H37.113C38.1848 16.663 38.9791 16.4434 39.496 16.0043C40.013 15.5652 40.2704 14.8926 40.2704 13.9905C40.2704 13.0804 40.013 12.4078 39.496 11.9747C38.9791 11.5436 38.1848 11.326 37.113 11.326H33.9176ZM33.9176 5.33446V9.72535H36.8675C37.8415 9.72535 38.566 9.54373 39.043 9.18447C39.52 8.82322 39.7575 8.27237 39.7575 7.5319C39.7575 6.79743 39.518 6.24657 39.043 5.88332C38.566 5.52008 37.8415 5.33646 36.8675 5.33646H33.9176V5.33446ZM31.9257 3.71582H37.0152C38.534 3.71582 39.7056 4.02717 40.5259 4.65188C41.3482 5.27658 41.7573 6.16474 41.7573 7.31635C41.7573 8.2065 41.5478 8.91703 41.1266 9.44393C40.7055 9.97084 40.0868 10.3002 39.2725 10.4299C40.2525 10.6375 41.0129 11.0706 41.5558 11.7312C42.0986 12.3918 42.3701 13.2161 42.3701 14.2041C42.3701 15.5054 41.923 16.5093 41.0289 17.2198C40.1347 17.9283 38.8614 18.2836 37.2128 18.2836H31.9257V3.71582ZM47.5573 11.326V16.663H50.7547C51.8265 16.663 52.6208 16.4434 53.1357 16.0043C53.6527 15.5652 53.9101 14.8926 53.9101 13.9905C53.9101 13.0804 53.6527 12.4078 53.1357 11.9747C52.6188 11.5436 51.8245 11.326 50.7547 11.326H47.5573ZM47.5573 5.33446V9.72535H50.5072C51.4812 9.72535 52.2057 9.54373 52.6827 9.18447C53.1597 8.82322 53.3972 8.27237 53.3972 7.5319C53.3972 6.79743 53.1597 6.24657 52.6827 5.88332C52.2057 5.52008 51.4812 5.33646 50.5072 5.33646H47.5573V5.33446ZM45.5654 3.71582H50.6549C52.1737 3.71582 53.3453 4.02717 54.1656 4.65188C54.9879 5.27658 55.399 6.16474 55.399 7.31635C55.399 8.2065 55.1895 8.91703 54.7683 9.44393C54.3472 9.97084 53.7285 10.3002 52.9142 10.4299C53.8942 10.6375 54.6546 11.0706 55.1975 11.7312C55.7403 12.3918 56.0118 13.2161 56.0118 14.2041C56.0118 15.5054 55.5647 16.5093 54.6706 17.2198C53.7764 17.9283 52.503 18.2836 50.8545 18.2836H45.5654V3.71582ZM64.9732 3.71582H67.1646L70.6274 8.94697L74.1242 3.71582H76.2418L71.6833 10.5397L76.8086 18.2836H74.6172L70.5835 12.1882L66.51 18.2836H64.3924L69.5297 10.5955L64.9732 3.71582ZM59.2031 3.71582H61.195V18.2836H59.2031V3.71582Z"
-          fill="white"
-        />
-      </g>
-      <defs>
-        <clipPath id="clip0_2691_29714">
-          <rect
-            width="80"
-            height="20.96"
-            fill="white"
-            transform="translate(0 0.519531)"
-          />
-        </clipPath>
-      </defs>
-    </svg>
-  </template>
-  <template v-else><span></span></template>
-</template>
-
-<script setup lang="ts">
-const props = withDefaults(
-  defineProps<{
-    name: string
-    type?: string
-    color?: string
-    width?: string
-    height?: string
-  }>(),
-  {
-    type: '',
-    color: 'currentColor',
-    width: '24',
-    height: '24',
-  }
-)
-</script>
-
-<style scoped lang="scss"></style>
+<template>
+  <template v-if="props.name === 'zabbix'">
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="80"
+      height="22"
+      viewBox="0 0 80 22"
+      fill="none"
+    >
+      <g clip-path="url(#clip0_2691_29714)">
+        <path d="M0 0.522461H80V21.477H0V0.522461Z" fill="#D40000" />
+        <path
+          d="M3.42089 3.71582H14.9889V5.2187L5.6782 16.625H15.2164V18.2836H3.19336V16.7807L12.504 5.37438H3.42089V3.71582ZM23.0402 5.65779L20.3378 12.9087H25.7526L23.0402 5.65779ZM21.9145 3.71582H24.1738L29.7862 18.2836H27.7145L26.3753 14.5473H19.735L18.3938 18.2836H16.2922L21.9145 3.71582ZM33.9176 11.326V16.663H37.113C38.1848 16.663 38.9791 16.4434 39.496 16.0043C40.013 15.5652 40.2704 14.8926 40.2704 13.9905C40.2704 13.0804 40.013 12.4078 39.496 11.9747C38.9791 11.5436 38.1848 11.326 37.113 11.326H33.9176ZM33.9176 5.33446V9.72535H36.8675C37.8415 9.72535 38.566 9.54373 39.043 9.18447C39.52 8.82322 39.7575 8.27237 39.7575 7.5319C39.7575 6.79743 39.518 6.24657 39.043 5.88332C38.566 5.52008 37.8415 5.33646 36.8675 5.33646H33.9176V5.33446ZM31.9257 3.71582H37.0152C38.534 3.71582 39.7056 4.02717 40.5259 4.65188C41.3482 5.27658 41.7573 6.16474 41.7573 7.31635C41.7573 8.2065 41.5478 8.91703 41.1266 9.44393C40.7055 9.97084 40.0868 10.3002 39.2725 10.4299C40.2525 10.6375 41.0129 11.0706 41.5558 11.7312C42.0986 12.3918 42.3701 13.2161 42.3701 14.2041C42.3701 15.5054 41.923 16.5093 41.0289 17.2198C40.1347 17.9283 38.8614 18.2836 37.2128 18.2836H31.9257V3.71582ZM47.5573 11.326V16.663H50.7547C51.8265 16.663 52.6208 16.4434 53.1357 16.0043C53.6527 15.5652 53.9101 14.8926 53.9101 13.9905C53.9101 13.0804 53.6527 12.4078 53.1357 11.9747C52.6188 11.5436 51.8245 11.326 50.7547 11.326H47.5573ZM47.5573 5.33446V9.72535H50.5072C51.4812 9.72535 52.2057 9.54373 52.6827 9.18447C53.1597 8.82322 53.3972 8.27237 53.3972 7.5319C53.3972 6.79743 53.1597 6.24657 52.6827 5.88332C52.2057 5.52008 51.4812 5.33646 50.5072 5.33646H47.5573V5.33446ZM45.5654 3.71582H50.6549C52.1737 3.71582 53.3453 4.02717 54.1656 4.65188C54.9879 5.27658 55.399 6.16474 55.399 7.31635C55.399 8.2065 55.1895 8.91703 54.7683 9.44393C54.3472 9.97084 53.7285 10.3002 52.9142 10.4299C53.8942 10.6375 54.6546 11.0706 55.1975 11.7312C55.7403 12.3918 56.0118 13.2161 56.0118 14.2041C56.0118 15.5054 55.5647 16.5093 54.6706 17.2198C53.7764 17.9283 52.503 18.2836 50.8545 18.2836H45.5654V3.71582ZM64.9732 3.71582H67.1646L70.6274 8.94697L74.1242 3.71582H76.2418L71.6833 10.5397L76.8086 18.2836H74.6172L70.5835 12.1882L66.51 18.2836H64.3924L69.5297 10.5955L64.9732 3.71582ZM59.2031 3.71582H61.195V18.2836H59.2031V3.71582Z"
+          fill="white"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_2691_29714">
+          <rect
+            width="80"
+            height="20.96"
+            fill="white"
+            transform="translate(0 0.519531)"
+          />
+        </clipPath>
+      </defs>
+    </svg>
+  </template>
+  <template v-else><span></span></template>
+</template>
+
+<script setup lang="ts">
+const props = withDefaults(
+  defineProps<{
+    name: string
+    type?: string
+    color?: string
+    width?: string
+    height?: string
+  }>(),
+  {
+    type: '',
+    color: 'currentColor',
+    width: '24',
+    height: '24',
+  }
+)
+</script>
+
+<style scoped lang="scss"></style>

package/components/atoms/perPage/PerPage.vue

@@ -1,58 +1,58 @@
-<template>
-  <div class="page-size">
-    {{ selectLabel }}
-
-    <div class="clr-select-wrapper">
-      <select
-        :id="`${props.testId}-select`"
-        v-development="props.development"
-        :data-id="`${props.testId}-select`"
-        :value="props.pageSize"
-        class="clr-page-size-select"
-        @change="change"
-      >
-        <option
-          v-for="(item, key) in props.options"
-          :key="key"
-          :value="item.value"
-        >
-          {{ item.text }}
-        </option>
-      </select>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import type { UI_I_Localization } from '~/lib/models/interfaces'
-import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
-
-const props = withDefaults(
-  defineProps<{
-    pageSize: number
-    options: UI_I_OptionItem[]
-    label?: string
-    testId?: string
-    development?: boolean
-  }>(),
-  {
-    testId: 'ui-per-page',
-    label: 'itemsPerPage',
-    development: false,
-  }
-)
-const emits = defineEmits<{
-  (event: 'change', value: number): void
-}>()
-
-const localization = computed<UI_I_Localization>(() => useLocal())
-const selectLabel = computed<string>(
-  () => localization.value.common[props.label]
-)
-
-const change = (event: InputEvent): void => {
-  emits('change', +(event.target as HTMLInputElement).value)
-}
-</script>
-
-<style scoped></style>
+<template>
+  <div class="page-size">
+    {{ selectLabel }}
+
+    <div class="clr-select-wrapper">
+      <select
+        :id="`${props.testId}-select`"
+        v-development="props.development"
+        :data-id="`${props.testId}-select`"
+        :value="props.pageSize"
+        class="clr-page-size-select"
+        @change="change"
+      >
+        <option
+          v-for="(item, key) in props.options"
+          :key="key"
+          :value="item.value"
+        >
+          {{ item.text }}
+        </option>
+      </select>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { UI_I_Localization } from '~/lib/models/interfaces'
+import type { UI_I_OptionItem } from '~/components/atoms/lib/models/interfaces'
+
+const props = withDefaults(
+  defineProps<{
+    pageSize: number
+    options: UI_I_OptionItem[]
+    label?: string
+    testId?: string
+    development?: boolean
+  }>(),
+  {
+    testId: 'ui-per-page',
+    label: 'itemsPerPage',
+    development: false,
+  }
+)
+const emits = defineEmits<{
+  (event: 'change', value: number): void
+}>()
+
+const localization = computed<UI_I_Localization>(() => useLocal())
+const selectLabel = computed<string>(
+  () => localization.value.common[props.label]
+)
+
+const change = (event: InputEvent): void => {
+  emits('change', +(event.target as HTMLInputElement).value)
+}
+</script>
+
+<style scoped></style>