aloha-vue 1.2.248 → 1.2.250

package/docs/package.json

@@ -1,59 +1,59 @@
-{
-  "name": "aloha-vue-docs",
-  "description": "Aloha-vue docs",
-  "version": "1.0.0",
-  "author": "Ilia Brykin",
-  "scripts": {
-    "serve": "webpack serve --mode=development --devtool=eval",
-    "watch": "webpack --watch --mode=development --devtool=eval",
-    "watch-details": "webpack --watch --mode=development --devtool=eval-source-map",
-    "build-production": "webpack --mode=production --devtool=source-map",
-    "build-css": "node-sass --include-path scss styles/styles.scss dist/styles/styles.css"
-  },
-  "dependencies": {
-    "@floating-ui/vue": "1.0.2",
-    "aloha-css": "1.0.132",
-    "axios": "1.4.0",
-    "dompurify": "3.0.3",
-    "fecha": "4.2.3",
-    "highlight.js": "11.8.0",
-    "lodash-es": "4.17.21",
-    "moment": "2.29.4",
-    "tiny-emitter": "2.1.0",
-    "tinymce": "6.6.1",
-    "vue": "3.4.8",
-    "vue-router": "4.2.5"
-  },
-  "devDependencies": {
-    "@babel/core": "7.22.5",
-    "@babel/eslint-parser": "7.22.5",
-    "@babel/plugin-syntax-dynamic-import": "7.8.3",
-    "@webpack-cli/generators": "3.0.7",
-    "acorn": "8.9.0",
-    "acorn-jsx": "5.3.2",
-    "babel-loader": "9.1.2",
-    "clean-webpack-plugin": "4.0.0",
-    "copy-webpack-plugin": "11.0.0",
-    "css-loader": "6.8.1",
-    "eslint": "8.43.0",
-    "eslint-plugin-jest": "^27.6.1",
-    "eslint-plugin-vue": "9.15.0",
-    "eslint-webpack-plugin": "4.0.1",
-    "file-loader": "6.2.0",
-    "html-webpack-plugin": "5.5.3",
-    "loader-utils": "3.2.1",
-    "node-sass": "8.0.0",
-    "null-loader": "4.0.1",
-    "pug": "3.0.2",
-    "regenerator-runtime": "0.13.11",
-    "sass-loader": "13.3.2",
-    "source-map-loader": "4.0.1",
-    "style-loader": "3.3.3",
-    "vue-eslint-parser": "9.3.1",
-    "vue-loader": "17.2.2",
-    "vue-pug-loader": "1.1.29",
-    "webpack": "^5.88.2",
-    "webpack-cli": "5.1.4",
-    "webpack-dev-server": "4.15.1"
-  }
-}
+{
+  "name": "aloha-vue-docs",
+  "description": "Aloha-vue docs",
+  "version": "1.0.0",
+  "author": "Ilia Brykin",
+  "scripts": {
+    "serve": "webpack serve --mode=development --devtool=eval",
+    "watch": "webpack --watch --mode=development --devtool=eval",
+    "watch-details": "webpack --watch --mode=development --devtool=eval-source-map",
+    "build-production": "webpack --mode=production --devtool=source-map",
+    "build-css": "node-sass --include-path scss styles/styles.scss dist/styles/styles.css"
+  },
+  "dependencies": {
+    "@floating-ui/vue": "1.0.2",
+    "aloha-css": "1.0.134",
+    "axios": "1.4.0",
+    "dompurify": "3.0.3",
+    "fecha": "4.2.3",
+    "highlight.js": "11.8.0",
+    "lodash-es": "4.17.21",
+    "moment": "2.29.4",
+    "tiny-emitter": "2.1.0",
+    "tinymce": "6.6.1",
+    "vue": "3.4.8",
+    "vue-router": "4.2.5"
+  },
+  "devDependencies": {
+    "@babel/core": "7.22.5",
+    "@babel/eslint-parser": "7.22.5",
+    "@babel/plugin-syntax-dynamic-import": "7.8.3",
+    "@webpack-cli/generators": "3.0.7",
+    "acorn": "8.9.0",
+    "acorn-jsx": "5.3.2",
+    "babel-loader": "9.1.2",
+    "clean-webpack-plugin": "4.0.0",
+    "copy-webpack-plugin": "11.0.0",
+    "css-loader": "6.8.1",
+    "eslint": "8.43.0",
+    "eslint-plugin-jest": "^27.6.1",
+    "eslint-plugin-vue": "9.15.0",
+    "eslint-webpack-plugin": "4.0.1",
+    "file-loader": "6.2.0",
+    "html-webpack-plugin": "5.5.3",
+    "loader-utils": "3.2.1",
+    "node-sass": "8.0.0",
+    "null-loader": "4.0.1",
+    "pug": "3.0.2",
+    "regenerator-runtime": "0.13.11",
+    "sass-loader": "13.3.2",
+    "source-map-loader": "4.0.1",
+    "style-loader": "3.3.3",
+    "vue-eslint-parser": "9.3.1",
+    "vue-loader": "17.2.2",
+    "vue-pug-loader": "1.1.29",
+    "webpack": "^5.88.2",
+    "webpack-cli": "5.1.4",
+    "webpack-dev-server": "4.15.1"
+  }
+}

package/docs/src/components/TheMenu/compositionAPI/ComponentItemsAPI.js

@@ -26,30 +26,12 @@ export default function ComponentItemsAPI() {
         },
       },
       {
-        group: "Hola",
         id: "cloak",
         label: "Cloak",
         to: {
           name: "PageCloak",
         },
       },
-      {
-        group: "Hola",
-        id: "cloak2",
-        label: "Cloak disabled",
-        to: {
-          name: "PageCloak",
-        },
-        disabled: true,
-      },
-      {
-        group: "Hola",
-        id: "collapse",
-        label: "Collapse",
-        to: {
-          name: "PageCollapse",
-        },
-      },
       {
         id: "confirm",
         label: "Confirm",
@@ -99,9 +81,22 @@ export default function ComponentItemsAPI() {
           {
             id: "fieldset",
             label: "Fieldset",
-            to: {
-              name: "PageFieldset",
-            }
+            children: [
+              {
+                id: "fieldsetBasic",
+                label: "Fieldset",
+                to: {
+                  name: "PageFieldset",
+                },
+              },
+              {
+                id: "fieldsetChildren",
+                label: "Fieldset (children)",
+                to: {
+                  name: "PageFieldsetChildren",
+                },
+              },
+            ],
           },
           {
             id: "ui-child",
@@ -170,21 +165,21 @@ export default function ComponentItemsAPI() {
             label: "JSON",
             to: {
               name: "PageJson",
-            }
+            },
           },
           {
             id: "PageOneCheckbox",
             label: "One checkbox",
             to: {
               name: "PageOneCheckbox",
-            }
+            },
           },
           {
             id: "radio",
             label: "Radio",
             to: {
               name: "PageRadio",
-            }
+            },
           },
           {
             id: "rate",
@@ -198,21 +193,28 @@ export default function ComponentItemsAPI() {
             label: "Select",
             to: {
               name: "PageSelect",
-            }
+            },
           },
           {
             id: "PageSwitch",
             label: "Switch",
             to: {
               name: "PageSwitch",
-            }
+            },
           },
           {
             id: "PageTextarea",
             label: "Textarea",
             to: {
               name: "PageTextarea",
-            }
+            },
+          },
+          {
+            id: "PageTemplate",
+            label: "Template",
+            to: {
+              name: "PageTemplate",
+            },
           },
           {
             id: "tinyMce",
@@ -252,7 +254,6 @@ export default function ComponentItemsAPI() {
         },
       },
       {
-        group: "Hola",
         id: "loading",
         label: "Loading",
         to: {
@@ -314,7 +315,6 @@ export default function ComponentItemsAPI() {
         },
       },
       {
-        group: "Aloha",
         id: "spinner",
         label: "Spinner",
         to: {

package/docs/src/i18n/ar.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "الاستخدام الأساسي",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "كائن يحتوي على متغيرات لاستبدالها في قالب الترجمة. يُستخدم لاستبدال القيم في نصوص الترجمة بشكل ديناميكي. على سبيل المثال، إذا كانت سلسلة الترجمة تحتوي على عناصر نائبة مثل <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>، والتي تُترجم إلى <strong>\"مرحبًا <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>، يمكنك تمرير كائن مثل <strong>{ <span lang=\"en\">foo</span>: \"أبج\", bar: \"123\" }</strong>، وستكون النتيجة هي الترجمة <strong>\"مرحبًا أبج: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "معرّف فريد للمكون",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "يحدد ما إذا كان يجب تفسير التلميح على أنه <strong lang=\"en\">HTML</strong>. إذا تم تعيينه على <strong lang=\"en\">true</strong>، سيتم عرض محتوى التلميح مع تنسيق <strong lang=\"en\">HTML</strong>.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "يضبط نص التلميح الذي سيظهر عند التمرير فوق عنصر. يمكن تقديم التلميح كنص عادي أو ككائن لأجهزة مختلفة (مثل أجهزة الكمبيوتر المكتبية والأجهزة المحمولة).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "يحدد موضع التلميح بالنسبة إلى العنصر. يتم دعم مواضع مختلفة، مثل <strong lang=\"en\">top</strong>، <strong lang=\"en\">bottom</strong>، <strong lang=\"en\">left</strong>، <strong lang=\"en\">right</strong>، وغيرها. هذه الخاصية تعمل فقط إذا تم تعيين <strong lang=\"en\">isTitleHtml</strong> إلى <strong lang=\"en\">true</strong>.",

package/docs/src/i18n/de.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Grundlegende Verwendung",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "Ein Objekt, das Variablen für die Ersetzung im Übersetzungstemplate enthält. Es wird verwendet, um Werte in Übersetzungsstrings dynamisch zu ersetzen. Zum Beispiel, wenn der Übersetzungsstring Platzhalter wie <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong> enthält, was als <strong>\"Willkommen <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong> übersetzt wird, können Sie ein Objekt wie <strong>{ <span lang=\"en\">foo</span>: \"abc\", bar: \"123\" }</strong> übergeben, und das Ergebnis wird die Übersetzung <strong>\"Willkommen abc: 123\"</strong> sein.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Eindeutiger Bezeichner für die Komponente",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Legt fest, ob das Tooltip als <strong lang=\"en\">HTML</strong> interpretiert werden soll. Wenn auf <strong lang=\"en\">true</strong> gesetzt, wird der Inhalt des Tooltips mit <strong lang=\"en\">HTML</strong>-Formatierung angezeigt.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Legt den Text des Tooltips fest, der beim Überfahren eines Elements angezeigt wird. Das Tooltip kann als einfacher Text oder als Objekt für verschiedene Geräte (z.B. Desktops und Mobilgeräte) dargestellt werden.",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Gibt die Position des Tooltips relativ zum Element an. Verschiedene Positionen werden unterstützt, wie z.B. <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong> und andere. Diese Eigenschaft funktioniert nur, wenn <strong lang=\"en\">isTitleHtml</strong> auf <strong lang=\"en\">true</strong> gesetzt ist.",

package/docs/src/i18n/en.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Basic usage",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "An object that contains variables for substitution in the translation template. It is used for dynamically replacing values in translation strings. For example, if the translation string has placeholders like <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>, which is translated as <strong>\"Welcome <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>, you can pass an object like <strong>{ <span lang=\"en\">foo</span>: \"abc\", bar: \"123\" }</strong>, and the result will be the translation <strong>\"Welcome abc: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Unique identifier for the component",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Determines whether the tooltip should be interpreted as <strong lang=\"en\">HTML</strong>. If set to <strong lang=\"en\">true</strong>, the content of the tooltip will be displayed with <strong lang=\"en\">HTML</strong> formatting.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Sets the text of the tooltip that will appear when hovering over an element. The tooltip can be presented as plain text or an object for different devices (e.g., desktops and mobile devices).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Specifies the position of the tooltip relative to the element. Various positions are supported, such as <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong>, and others. This property only works if <strong lang=\"en\">isTitleHtml</strong> is set to <strong lang=\"en\">true</strong>.",

package/docs/src/i18n/es.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Uso básico",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "Un objeto que contiene variables para la sustitución en la plantilla de traducción. Se utiliza para reemplazar dinámicamente valores en las cadenas de traducción. Por ejemplo, si la cadena de traducción tiene marcadores de posición como <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>, que se traduce como <strong>\"Bienvenido <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>, puede pasar un objeto como <strong>{ <span lang=\"en\">foo</span>: \"abc\", bar: \"123\" }</strong>, y el resultado será la traducción <strong>\"Bienvenido abc: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Identificador único para el componente",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Determina si la herramienta debe interpretarse como <strong lang=\"en\">HTML</strong>. Si se establece en <strong lang=\"en\">true</strong>, el contenido de la herramienta se mostrará con formato <strong lang=\"en\">HTML</strong>.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Establece el texto de la herramienta que aparecerá al pasar el cursor sobre un elemento. La herramienta se puede presentar como texto simple o como un objeto para diferentes dispositivos (por ejemplo, escritorios y dispositivos móviles).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Especifica la posición de la herramienta en relación con el elemento. Se admiten varias posiciones, como <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong> y otras. Esta propiedad solo funciona si <strong lang=\"en\">isTitleHtml</strong> está configurado en <strong lang=\"en\">true</strong>.",

package/docs/src/i18n/fr.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Utilisation de base",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "Un objet qui contient des variables pour la substitution dans le modèle de traduction. Il est utilisé pour remplacer dynamiquement les valeurs dans les chaînes de traduction. Par exemple, si la chaîne de traduction contient des espaces réservés comme <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>, qui est traduit par <strong>\"Bienvenue <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>, vous pouvez passer un objet comme <strong>{ <span lang=\"en\">foo</span>: \"abc\", bar: \"123\" }</strong>, et le résultat sera la traduction <strong>\"Bienvenue abc: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Identifiant unique pour le composant",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Détermine si l'infobulle doit être interprétée comme <strong lang=\"en\">HTML</strong>. Si cette option est activée (<strong lang=\"en\">true</strong>), le contenu de l'infobulle sera affiché avec une mise en forme <strong lang=\"en\">HTML</strong>.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Définit le texte de l'infobulle qui apparaîtra lorsque vous survolerez un élément. L'infobulle peut être présentée sous forme de texte simple ou d'objet pour différents appareils (par exemple, les ordinateurs de bureau et les appareils mobiles).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Spécifie la position de l'infobulle par rapport à l'élément. Différentes positions sont prises en charge, telles que <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong>, et autres. Cette propriété fonctionne uniquement si <strong lang=\"en\">isTitleHtml</strong> est défini sur <strong lang=\"en\">true</strong>.",

package/docs/src/i18n/hr.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Osnovna uporaba",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "Objekt koji sadrži varijable za zamjenu u predlošku prijevoda. Koristi se za dinamičku zamjenu vrijednosti u prijevodnim nizovima. Na primjer, ako prijevodni niz ima rezervirane prostore poput <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>, što je prevedeno kao <strong>\"Dobrodošli <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>, možete proslijediti objekt poput <strong>{ <span lang=\"en\">foo</span>: \"abc\", bar: \"123\" }</strong>, a rezultat će biti prijevod <strong>\"Dobrodošli abc: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Jedinstveni identifikator za komponentu",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Određuje hoće li se alatna traka tumačiti kao <strong lang=\"en\">HTML</strong>. Ako je postavljeno na <strong lang=\"en\">true</strong>, sadržaj alatne trake će se prikazivati s <strong lang=\"en\">HTML</strong> formatiranjem.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Postavlja tekst alatne trake koji će se prikazivati pri prelasku mišem preko elementa. Alatna traka može biti prikazana kao običan tekst ili kao objekt za različite uređaje (npr. stolna računala i mobilni uređaji).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Određuje položaj alatne trake u odnosu na element. Podržane su različite pozicije, kao što su <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong> i druge. Ovo svojstvo radi samo ako je <strong lang=\"en\">isTitleHtml</strong> postavljeno na <strong lang=\"en\">true</strong>.",

package/docs/src/i18n/it.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Utilizzo di base",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "Un oggetto che contiene variabili per la sostituzione nel modello di traduzione. Viene utilizzato per sostituire dinamicamente i valori nelle stringhe di traduzione. Ad esempio, se la stringa di traduzione ha segnaposti come <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>, che viene tradotto come <strong>\"Benvenuto <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>, puoi passare un oggetto come <strong>{ <span lang=\"en\">foo</span>: \"abc\", bar: \"123\" }</strong>, e il risultato sarà la traduzione <strong>\"Benvenuto abc: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Identificatore univoco per il componente",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Determina se la tooltip debba essere interpretata come <strong lang=\"en\">HTML</strong>. Se impostato su <strong lang=\"en\">true</strong>, il contenuto della tooltip verrà visualizzato con formattazione <strong lang=\"en\">HTML</strong>.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Imposta il testo della tooltip che verrà visualizzata quando si passa il mouse su un elemento. La tooltip può essere presentata come testo semplice o come oggetto per diversi dispositivi (ad es., desktop e dispositivi mobili).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Specifica la posizione della tooltip rispetto all'elemento. Sono supportate varie posizioni, come <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong> e altre. Questa proprietà funziona solo se <strong lang=\"en\">isTitleHtml</strong> è impostato su <strong lang=\"en\">true</strong>.",

package/docs/src/i18n/ru.json

@@ -1,6 +1,7 @@
 {
   "_A_BASIC_USAGE_": "Основное использование",
   "_A_GLOBAL_PROPS_EXTRA_DESCRIPTION_": "Объект, который содержит переменные для подстановки в шаблон перевода. Используется для динамической замены значений в строках перевода. Например, если строка перевода имеет плейсхолдеры, такие как <strong lang=\"en\">\"_WELCOME_{{foo}}_{{bar}}_\"</strong>, это переведено как <strong>\"Добро пожаловать <span lang=\"en\">{{ foo }}</span>: <span lang=\"en\">{{ bar }}</span>\"</strong>, можно передать объект <strong>{ <span lang=\"en\">foo</span>: \"абв\", bar: \"123\" }</strong>, и в результате получится перевод <strong>\"Добро пожаловать абв: 123\"</strong>.",
+  "_A_GLOBAL_PROPS_ID_DESCRIPTION_": "Уникальный идентификатор для компонента",
   "_A_GLOBAL_PROPS_IS_TITLE_HTML_DESCRIPTION_": "Определяет, будет ли всплывающая подсказка интерпретироваться как <strong lang=\"en\">HTML</strong>. Если установлено в <strong lang=\"en\">true</strong>, содержимое подсказки будет отображаться с учетом <strong lang=\"en\">HTML</strong>-разметки.",
   "_A_GLOBAL_PROPS_TITLE_DESCRIPTION_": "Задает текст всплывающей подсказки, который будет отображаться при наведении на элемент. Подсказка может быть представлена как простым текстом, так и объектом для различных устройств (например, для десктопов и мобильных устройств).",
   "_A_GLOBAL_PROPS_TITLE_PLACEMENT_DESCRIPTION_": "Определяет расположение всплывающей подсказки относительно элемента. Поддерживаются различные позиции, такие как <strong lang=\"en\">top</strong>, <strong lang=\"en\">bottom</strong>, <strong lang=\"en\">left</strong>, <strong lang=\"en\">right</strong> и другие. Это свойство работает только в том случае, если <strong lang=\"en\">isTitleHtml</strong> установлено в <strong lang=\"en\">true</strong>.",

package/docs/src/mainTranslation.js

@@ -33,6 +33,7 @@ import PageProgressCircleI18n from "./views/Progress/PageProgressCircle/i18n/Pag
 import PageRadioI18n from "./views/Form/PageRadio/i18n/PageRadioI18n";
 import PageCheckboxI18n from "./views/Form/PageCheckbox/i18n/PageCheckboxI18n";
 import PageFieldsetI18n from "./views/Form/PageFieldset/i18n/PageFieldsetI18n";
+import PageFieldsetChildrenI18n from "./views/Form/PageFieldsetChildren/i18n/PageFieldsetChildrenI18n";
 import PageLinkCopyI18n from "./views/PageLinkCopy/i18n/PageLinkCopyI18n";
 import PageInputNumberRangeI18n from "./views/Form/PageInputNumberRange/i18n/PageInputNumberRangeI18n";
 import PageFiltersI18n from "./views/PageFilters/i18n/PageFiltersI18n";
@@ -75,6 +76,11 @@ import PageTextareaI18n from "./views/Form/PageTextarea/i18n/PageTextareaI18n";
 import PageInputI18n from "./views/Form/PageInput/i18n/PageInputI18n";
 import PageOneCheckboxI18n from "./views/Form/PageOneCheckbox/i18n/PageOneCheckboxI18n";
 import PageSwitchI18n from "./views/Form/PageSwitch/i18n/PageSwitchI18n";
+import PageTemplateI18n from "./views/Form/PageTemplate/i18n/PageTemplateI18n";
+import PageSpinnerI18n from "./views/PageSpinner/i18n/PageSpinnerI18n";
+import PageCloakI18n from "./views/PageCloak/i18n/PageCloakI18n";
+import PageLoadingI18n from "./views/PageLoading/i18n/PageLoadingI18n";
+import PageTabsI18n from "./views/PageTabs/i18n/PageTabsI18n";
 
 export const mainTranslation = {
   ar: {
@@ -104,6 +110,7 @@ export const mainTranslation = {
     ...PageRadioI18n.ar,
     ...PageCheckboxI18n.ar,
     ...PageFieldsetI18n.ar,
+    ...PageFieldsetChildrenI18n.ar,
     ...PageLinkCopyI18n.ar,
     ...PageInputNumberRangeI18n.ar,
     ...PageFiltersI18n.ar,
@@ -146,6 +153,11 @@ export const mainTranslation = {
     ...PageInputI18n.ar,
     ...PageOneCheckboxI18n.ar,
     ...PageSwitchI18n.ar,
+    ...PageTemplateI18n.ar,
+    ...PageSpinnerI18n.ar,
+    ...PageCloakI18n.ar,
+    ...PageLoadingI18n.ar,
+    ...PageTabsI18n.ar,
   },
   de: {
     ...allLanguages.de,
@@ -174,6 +186,7 @@ export const mainTranslation = {
     ...PageRadioI18n.de,
     ...PageCheckboxI18n.de,
     ...PageFieldsetI18n.de,
+    ...PageFieldsetChildrenI18n.de,
     ...PageLinkCopyI18n.de,
     ...PageInputNumberRangeI18n.de,
     ...PageFiltersI18n.de,
@@ -216,6 +229,11 @@ export const mainTranslation = {
     ...PageInputI18n.de,
     ...PageOneCheckboxI18n.de,
     ...PageSwitchI18n.de,
+    ...PageTemplateI18n.de,
+    ...PageSpinnerI18n.de,
+    ...PageCloakI18n.de,
+    ...PageLoadingI18n.de,
+    ...PageTabsI18n.de,
   },
   en: {
     ...allLanguages.en,
@@ -244,6 +262,7 @@ export const mainTranslation = {
     ...PageRadioI18n.en,
     ...PageCheckboxI18n.en,
     ...PageFieldsetI18n.en,
+    ...PageFieldsetChildrenI18n.en,
     ...PageLinkCopyI18n.en,
     ...PageInputNumberRangeI18n.en,
     ...PageFiltersI18n.en,
@@ -286,6 +305,11 @@ export const mainTranslation = {
     ...PageInputI18n.en,
     ...PageOneCheckboxI18n.en,
     ...PageSwitchI18n.en,
+    ...PageTemplateI18n.en,
+    ...PageSpinnerI18n.en,
+    ...PageCloakI18n.en,
+    ...PageLoadingI18n.en,
+    ...PageTabsI18n.en,
   },
   es: {
     ...allLanguages.es,
@@ -314,6 +338,7 @@ export const mainTranslation = {
     ...PageRadioI18n.es,
     ...PageCheckboxI18n.es,
     ...PageFieldsetI18n.es,
+    ...PageFieldsetChildrenI18n.es,
     ...PageLinkCopyI18n.es,
     ...PageInputNumberRangeI18n.es,
     ...PageFiltersI18n.es,
@@ -356,6 +381,11 @@ export const mainTranslation = {
     ...PageInputI18n.es,
     ...PageOneCheckboxI18n.es,
     ...PageSwitchI18n.es,
+    ...PageTemplateI18n.es,
+    ...PageSpinnerI18n.es,
+    ...PageCloakI18n.es,
+    ...PageLoadingI18n.es,
+    ...PageTabsI18n.es,
   },
   fr: {
     ...allLanguages.fr,
@@ -384,6 +414,7 @@ export const mainTranslation = {
     ...PageRadioI18n.fr,
     ...PageCheckboxI18n.fr,
     ...PageFieldsetI18n.fr,
+    ...PageFieldsetChildrenI18n.fr,
     ...PageLinkCopyI18n.fr,
     ...PageInputNumberRangeI18n.fr,
     ...PageFiltersI18n.fr,
@@ -426,6 +457,11 @@ export const mainTranslation = {
     ...PageInputI18n.fr,
     ...PageOneCheckboxI18n.fr,
     ...PageSwitchI18n.fr,
+    ...PageTemplateI18n.fr,
+    ...PageSpinnerI18n.fr,
+    ...PageCloakI18n.fr,
+    ...PageLoadingI18n.fr,
+    ...PageTabsI18n.fr,
   },
   hr: {
     ...allLanguages.hr,
@@ -454,6 +490,7 @@ export const mainTranslation = {
     ...PageRadioI18n.hr,
     ...PageCheckboxI18n.hr,
     ...PageFieldsetI18n.hr,
+    ...PageFieldsetChildrenI18n.hr,
     ...PageLinkCopyI18n.hr,
     ...PageInputNumberRangeI18n.hr,
     ...PageFiltersI18n.hr,
@@ -496,6 +533,11 @@ export const mainTranslation = {
     ...PageInputI18n.hr,
     ...PageOneCheckboxI18n.hr,
     ...PageSwitchI18n.hr,
+    ...PageTemplateI18n.hr,
+    ...PageSpinnerI18n.hr,
+    ...PageCloakI18n.hr,
+    ...PageLoadingI18n.hr,
+    ...PageTabsI18n.hr,
   },
   it: {
     ...allLanguages.it,
@@ -524,6 +566,7 @@ export const mainTranslation = {
     ...PageRadioI18n.it,
     ...PageCheckboxI18n.it,
     ...PageFieldsetI18n.it,
+    ...PageFieldsetChildrenI18n.it,
     ...PageLinkCopyI18n.it,
     ...PageInputNumberRangeI18n.it,
     ...PageFiltersI18n.it,
@@ -566,6 +609,11 @@ export const mainTranslation = {
     ...PageInputI18n.it,
     ...PageOneCheckboxI18n.it,
     ...PageSwitchI18n.it,
+    ...PageTemplateI18n.it,
+    ...PageSpinnerI18n.it,
+    ...PageCloakI18n.it,
+    ...PageLoadingI18n.it,
+    ...PageTabsI18n.it,
   },
   ru: {
     ...allLanguages.ru,
@@ -594,6 +642,7 @@ export const mainTranslation = {
     ...PageRadioI18n.ru,
     ...PageCheckboxI18n.ru,
     ...PageFieldsetI18n.ru,
+    ...PageFieldsetChildrenI18n.ru,
     ...PageLinkCopyI18n.ru,
     ...PageInputNumberRangeI18n.ru,
     ...PageFiltersI18n.ru,
@@ -636,5 +685,10 @@ export const mainTranslation = {
     ...PageInputI18n.ru,
     ...PageOneCheckboxI18n.ru,
     ...PageSwitchI18n.ru,
+    ...PageTemplateI18n.ru,
+    ...PageSpinnerI18n.ru,
+    ...PageCloakI18n.ru,
+    ...PageLoadingI18n.ru,
+    ...PageTabsI18n.ru,
   },
 };

package/docs/src/router/index.js

@@ -144,6 +144,11 @@ const ROUTES = [
     name: "PageFieldset",
     component: () => import(/* webpackChunkName: "PageFieldset" */ "../views/Form/PageFieldset/PageFieldset.vue"),
   },
+  {
+    path: "/fieldset-children",
+    name: "PageFieldsetChildren",
+    component: () => import(/* webpackChunkName: "PageFieldsetChildren" */ "../views/Form/PageFieldsetChildren/PageFieldsetChildren.vue"),
+  },
   {
     path: "/select",
     name: "PageSelect",
@@ -224,6 +229,11 @@ const ROUTES = [
     name: "PageInputCurrency",
     component: () => import(/* webpackChunkName: "PageInputNumber" */ "../views/Form/PageInputCurrency/PageInputCurrency.vue"),
   },
+  {
+    path: "/template",
+    name: "PageTemplate",
+    component: () => import(/* webpackChunkName: "PageTemplate" */ "../views/Form/PageTemplate/PageTemplate.vue"),
+  },
   {
     path: "/group-button-dropdown",
     name: "PageGroupButtonDropdown",

package/docs/src/views/Form/PageCheckbox/PageCheckbox.js

@@ -18,6 +18,7 @@ import PageCheckboxIsWidthAuto from "./PageCheckboxIsWidthAuto/PageCheckboxIsWid
 import PageCheckboxKeyDisabled from "./PageCheckboxKeyDisabled/PageCheckboxKeyDisabled.vue";
 import PageCheckboxKeyLabelCallback from "./PageCheckboxKeyLabelCallback/PageCheckboxKeyLabelCallback.vue";
 import PageCheckboxKeyTitle from "./PageCheckboxKeyTitle/PageCheckboxKeyTitle.vue";
+import PageCheckboxLabelScreenReader from "./PageCheckboxLabelScreenReader/PageCheckboxLabelScreenReader.vue";
 import PageCheckboxSearch from "./PageCheckboxSearch/PageCheckboxSearch.vue";
 import PageCheckboxSortOrder from "./PageCheckboxSortOrder/PageCheckboxSortOrder.vue";
 import PageCheckboxSortOrderGroup from "./PageCheckboxSortOrderGroup/PageCheckboxSortOrderGroup.vue";
@@ -52,6 +53,7 @@ export default {
     PageCheckboxKeyDisabled,
     PageCheckboxKeyLabelCallback,
     PageCheckboxKeyTitle,
+    PageCheckboxLabelScreenReader,
     PageCheckboxSearch,
     PageCheckboxSortOrder,
     PageCheckboxSortOrderGroup,

package/docs/src/views/Form/PageCheckbox/PageCheckbox.pug

@@ -17,6 +17,8 @@ aloha-page(
 
     page-checkbox-error
 
+    page-checkbox-label-screen-reader
+
     page-checkbox-group
 
     page-checkbox-search

package/docs/src/views/Form/PageCheckbox/PageCheckboxLabelScreenReader/PageCheckboxLabelScreenReader.js

@@ -0,0 +1,73 @@
+import {
+  ref,
+} from "vue";
+
+import ACheckbox from "../../../../../../src/ui/ACheckbox/ACheckbox";
+import AlohaExample from "../../../../global/components/AlohaExample/AlohaExample.vue";
+
+import HtmlAPI from "./compositionAPI/HtmlAPI";
+import JsAPI from "./compositionAPI/JsAPI";
+
+export default {
+  name: "PageCheckboxLabelScreenReader",
+  components: {
+    ACheckbox,
+    AlohaExample,
+  },
+  setup() {
+    const {
+      codeHtml,
+    } = HtmlAPI();
+
+    const {
+      codeJs,
+    } = JsAPI();
+
+    const data = [
+      {
+        label: "Aloha 0",
+        id: "aloha_0",
+      },
+      {
+        label: "Aloha 1",
+        id: "aloha_1",
+      },
+      {
+        label: "Aloha 2",
+        id: "aloha_2",
+      },
+      {
+        label: "Aloha 3",
+        id: "aloha_3",
+      },
+      {
+        label: "Aloha 4",
+        id: "aloha_4",
+      },
+      {
+        label: "Aloha 5",
+        id: "aloha_5",
+      },
+      {
+        label: "Aloha 6",
+        id: "aloha_6",
+      },
+      {
+        label: "Aloha 7",
+        id: "aloha_7",
+      },
+      {
+        label: "Aloha 8",
+        id: "aloha_8",
+      },
+    ];
+    const model = ref(undefined);
+
+    return {
+      codeHtml,
+      codeJs,
+      data,
+      model,
+    };
+  },
+};