aloha-vue 1.0.337 → 1.0.339

package/README.md

@@ -1,7 +1,10 @@
+![npm (scoped)](https://img.shields.io/npm/v/aloha-vue?label=NPM)
+![NPM](https://img.shields.io/npm/l/aloha-vue?label=License)
+![npm](https://img.shields.io/npm/dt/aloha-vue?label=Downloads)
 
-![Aloha Framework logo](./static/aloha_logo.png)
-# aloha-vue 
-v1.0.337
+# aloha-vue
+
+![Aloha Framework logo](.images/aloha_logo.png)
 
 ---
 
@@ -31,6 +34,9 @@ The documentation can be found in the docs/ directory. Each component has a dedi
 
 Aloha documentation is available in English, German, Spanish, French, Arabic, Italian, Russian and Croatian.
 
+## Sponsor / Support
+
+[PROUNIX](https://prounix.de/)
 
 ## License
 aloha-vue is released under [MIT](https://github.com/ilia-brykin/aloha/blob/master/LICENSE) license.

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

@@ -99,6 +99,14 @@ export default {
             },
           ],
         },
+        {
+          id: "disclosure",
+          label: "Disclosure",
+          to: {
+            name: "PageDisclosure",
+          },
+          icon: "ChevronBarExpand",
+        },
         {
           id: "dropdown",
           label: "Dropdown",
@@ -146,7 +154,7 @@ export default {
           to: {
             name: "PageModal",
           },
-          icon: "Lock",
+          icon: "Window",
         },
         {
           id: "notification",
@@ -178,7 +186,7 @@ export default {
           to: {
             name: "PageShowMore",
           },
-          icon: "ChevronDown",
+          icon: "ChevronBarExpand",
         },
         {
           group: "Aloha",
@@ -241,12 +249,12 @@ export default {
           icon: "SegmentedNav",
         },
         {
-          id: "title",
-          label: "Title",
+          id: "tooltip",
+          label: "Tooltip",
           to: {
             name: "PageTitle",
           },
-          icon: "Dnd",
+          icon: "ChatSquareTextFill",
           titleHtml: "PageTitle PageTitle PageTitle PageTitle PageTitle PageTitle",
         },
         {
@@ -263,7 +271,7 @@ export default {
           to: {
             name: "PageWizard",
           },
-          icon: "Dnd",
+          icon: "ArrowRightCircleFill",
         },
         {
           id: "ui",

package/docs/src/mainIcons.js

@@ -1,7 +1,10 @@
+import ArrowRightCircleFill from "../../src/AIcon/Icons/bootstrap-1-9-1/ArrowRightCircleFill";
 import ArrowsCollapse from "../../src/AIcon/Icons/bootstrap-1-9-1/ArrowsCollapse";
 import Bell from "../../src/AIcon/Icons/bootstrap-1-9-1/Bell";
 import BoxArrowUpRight from "../../src/AIcon/Icons/bootstrap-1-9-1/BoxArrowUpRight";
+import ChatSquareTextFill from "../../src/AIcon/Icons/bootstrap-1-9-1/ChatSquareTextFill";
 import CheckLg from "../../src/AIcon/Icons/bootstrap-1-9-1/CheckLg";
+import ChevronBarExpand from "../../src/AIcon/Icons/bootstrap-1-9-1/ChevronBarExpand";
 import ChevronDown from "../../src/AIcon/Icons/bootstrap-1-9-1/ChevronDown";
 import ChevronExpand from "../../src/AIcon/Icons/bootstrap-1-9-1/ChevronExpand";
 import ChevronRight from "../../src/AIcon/Icons/bootstrap3/ChevronRight";
@@ -25,12 +28,16 @@ import Reception2 from "../../src/AIcon/Icons/bootstrap-1-9-1/Reception2";
 import SegmentedNav from "../../src/AIcon/Icons/bootstrap-1-9-1/SegmentedNav";
 import Table from "../../src/AIcon/Icons/bootstrap-1-9-1/Table";
 import Translate from "../../src/AIcon/Icons/bootstrap-1-9-1/Translate";
+import Window from "../../src/AIcon/Icons/bootstrap-1-9-1/Window";
 
 export default {
+  ArrowRightCircleFill,
   ArrowsCollapse,
   Bell,
   BoxArrowUpRight,
+  ChatSquareTextFill,
   CheckLg,
+  ChevronBarExpand,
   ChevronDown,
   ChevronExpand,
   ChevronRight,
@@ -54,4 +61,5 @@ export default {
   SegmentedNav,
   Table,
   Translate,
+  Window,
 };

package/docs/src/mainTranslation.js

@@ -19,6 +19,8 @@ import PageTableSimpleI18n from "./views/PageTable/PageTableSimple/i18n/PageTabl
 import PageTablePaginationI18n from "./views/PageTable/PageTablePagination/i18n/PageTablePaginationI18n";
 import PageTableSortI18n from "./views/PageTable/PageTableSort/i18n/PageTableSortI18n";
 import PageAOnHooksI18n from "./views/PageDirectives/PageOnHooks/i18n/PageAOnHooksI18n";
+import PageDisclosureI18n from "./views/PageDisclosure/i18n/PageDisclosureI18n";
+import PageTooltipI18n from "./views/PageTooltip/i18n/PageTooltipI18n";
 
 export const mainTranslation = {
   ar: {
@@ -34,6 +36,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.ar,
     ...PageTableSortI18n.ar,
     ...PageAOnHooksI18n.ar,
+    ...PageDisclosureI18n.ar,
+    ...PageTooltipI18n.ar,
   },
   de: {
     ...allLanguages.de,
@@ -48,6 +52,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.de,
     ...PageTableSortI18n.de,
     ...PageAOnHooksI18n.de,
+    ...PageDisclosureI18n.de,
+    ...PageTooltipI18n.de,
   },
   en: {
     ...allLanguages.en,
@@ -62,6 +68,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.en,
     ...PageTableSortI18n.en,
     ...PageAOnHooksI18n.en,
+    ...PageDisclosureI18n.en,
+    ...PageTooltipI18n.en,
   },
   es: {
     ...allLanguages.es,
@@ -76,6 +84,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.es,
     ...PageTableSortI18n.es,
     ...PageAOnHooksI18n.es,
+    ...PageDisclosureI18n.es,
+    ...PageTooltipI18n.es,
   },
   fr: {
     ...allLanguages.fr,
@@ -90,6 +100,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.fr,
     ...PageTableSortI18n.fr,
     ...PageAOnHooksI18n.fr,
+    ...PageDisclosureI18n.fr,
+    ...PageTooltipI18n.fr,
   },
   hr: {
     ...allLanguages.hr,
@@ -104,6 +116,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.hr,
     ...PageTableSortI18n.hr,
     ...PageAOnHooksI18n.hr,
+    ...PageDisclosureI18n.hr,
+    ...PageTooltipI18n.hr,
   },
   it: {
     ...allLanguages.it,
@@ -118,6 +132,8 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.it,
     ...PageTableSortI18n.it,
     ...PageAOnHooksI18n.it,
+    ...PageDisclosureI18n.it,
+    ...PageTooltipI18n.it,
   },
   ru: {
     ...allLanguages.ru,
@@ -132,5 +148,7 @@ export const mainTranslation = {
     ...PageTablePaginationI18n.ru,
     ...PageTableSortI18n.ru,
     ...PageAOnHooksI18n.ru,
+    ...PageDisclosureI18n.ru,
+    ...PageTooltipI18n.ru,
   },
 };

package/docs/src/router/index.js

@@ -152,7 +152,7 @@ const ROUTES = [
   {
     path: "/title",
     name: "PageTitle",
-    component: () => import(/* webpackChunkName: "PageTitle" */ "../views/PageTitle/PageTitle.vue"),
+    component: () => import(/* webpackChunkName: "PageTitle" */ "../views/PageTooltip/PageTooltip.vue"),
   },
   {
     path: "/svg",
@@ -204,6 +204,11 @@ const ROUTES = [
     name: "PageOnHooks",
     component: () => import(/* webpackChunkName: "PageOnHooks" */ "../views/PageDirectives/PageOnHooks/PageOnHooks.vue"),
   },
+  {
+    path: "/disclosure",
+    name: "PageDisclosure",
+    component: () => import(/* webpackChunkName: "PageDisclosure" */ "../views/PageDisclosure/PageDisclosure.vue"),
+  },
   {
     // If the routing configuration '*' reports an error, replace it with '/: catchAll(. *)'
     // caught Error: Catch all routes ("*") must now be defined using a param with a custom regexp

package/docs/src/views/PageDisclosure/PageDisclosure.js

@@ -0,0 +1,83 @@
+import AlohaPage from "../../global/components/AlohaPage/AlohaPage.vue";
+import AlohaTableProps from "../../global/components/AlohaTableProps/AlohaTableProps.vue";
+import AlohaTableTranslate from "../../global/components/AlohaTableTranslate/AlohaTableTranslate.vue";
+import ATranslation from "../../../../src/ATranslation/ATranslation";
+import PageDisclosureBasic from "./PageDisclosureBasic/PageDisclosureBasic.vue";
+import PageDisclosureBtnClass from "./PageDisclosureBtnClass/PageDisclosureBtnClass.vue";
+import PageDisclosureBtnIcons from "./PageDisclosureBtnIcons/PageDisclosureBtnIcons.vue";
+import PageDisclosureBtnTexts from "./PageDisclosureBtnTexts/PageDisclosureBtnTexts.vue";
+import PageDisclosureBtnTitle from "./PageDisclosureBtnTitle/PageDisclosureBtnTitle.vue";
+import PageDisclosureBtnTitleHtml from "./PageDisclosureBtnTitleHtml/PageDisclosureBtnTitleHtml.vue";
+import PageDisclosureDisabled from "./PageDisclosureDisabled/PageDisclosureDisabled.vue";
+import PageDisclosureEvents from "./PageDisclosureEvents/PageDisclosureEvents.vue";
+import PageDisclosureExposes from "./PageDisclosureExposes/PageDisclosureExposes.vue";
+import PageDisclosureHtml from "./PageDisclosureHtml/PageDisclosureHtml.vue";
+import PageDisclosureNotLess from "./PageDisclosureNotLess/PageDisclosureNotLess.vue";
+import PageDisclosureOpenDefault from "./PageDisclosureOpenDefault/PageDisclosureOpenDefault.vue";
+import PageDisclosureSafeHtml from "./PageDisclosureSafeHtml/PageDisclosureSafeHtml.vue";
+import PageDisclosureSlots from "./PageDisclosureSlots/PageDisclosureSlots.vue";
+
+import EventsAPI from "./compositionAPI/EventsAPI";
+import ExposesAPI from "./compositionAPI/ExposesAPI";
+import PageTitleAPI from "./compositionAPI/PageTitleAPI";
+import PropsAPI from "./compositionAPI/PropsAPI";
+import SlotsAPI from "./compositionAPI/SlotsAPI";
+import TranslateAPI from "./compositionAPI/TranslateAPI";
+
+export default {
+  name: "PageDisclosure",
+  components: {
+    AlohaPage,
+    AlohaTableProps,
+    AlohaTableTranslate,
+    ATranslation,
+    PageDisclosureBasic,
+    PageDisclosureBtnClass,
+    PageDisclosureBtnIcons,
+    PageDisclosureBtnTexts,
+    PageDisclosureBtnTitle,
+    PageDisclosureBtnTitleHtml,
+    PageDisclosureDisabled,
+    PageDisclosureEvents,
+    PageDisclosureExposes,
+    PageDisclosureHtml,
+    PageDisclosureNotLess,
+    PageDisclosureOpenDefault,
+    PageDisclosureSafeHtml,
+    PageDisclosureSlots,
+  },
+  setup() {
+    const {
+      pageTitle,
+    } = PageTitleAPI();
+
+    const {
+      dataProps,
+    } = PropsAPI();
+
+    const {
+      dataSlots,
+    } = SlotsAPI();
+
+    const {
+      dataEvents,
+    } = EventsAPI();
+
+    const {
+      dataExposes,
+    } = ExposesAPI();
+
+    const {
+      dataTranslate,
+    } = TranslateAPI();
+
+    return {
+      dataEvents,
+      dataExposes,
+      dataProps,
+      dataSlots,
+      dataTranslate,
+      pageTitle,
+    };
+  },
+};

package/docs/src/views/PageDisclosure/PageDisclosure.pug

@@ -0,0 +1,64 @@
+aloha-page(
+  :page-title="pageTitle"
+)
+  template(
+    v-slot:body
+  )
+    a-translation(
+      tag="p"
+      html="_A_DISCLOSURE_COMPONENT_DESCRIPTION_"
+    )
+
+    page-disclosure-basic
+
+    page-disclosure-disabled
+
+    page-disclosure-html
+
+    page-disclosure-safe-html
+
+    page-disclosure-not-less
+
+    page-disclosure-btn-class
+
+    page-disclosure-btn-icons
+
+    page-disclosure-btn-title
+
+    page-disclosure-btn-title-html
+
+    page-disclosure-btn-texts
+
+    page-disclosure-open-default
+
+    page-disclosure-slots
+
+    page-disclosure-events
+
+    page-disclosure-exposes
+
+    aloha-table-props(
+      :data="dataProps"
+    )
+
+    aloha-table-props(
+      table-label="Slots"
+      :data="dataSlots"
+      :columns="['name', 'description']"
+    )
+
+    aloha-table-props(
+      table-label="Events"
+      :data="dataEvents"
+      :columns="['name', 'type', 'description']"
+    )
+
+    aloha-table-props(
+      table-label="Exposes"
+      :data="dataExposes"
+      :columns="['name', 'type', 'description']"
+    )
+
+    aloha-table-translate(
+      :data="dataTranslate"
+    )

package/docs/src/views/PageDisclosure/PageDisclosure.vue

@@ -0,0 +1,2 @@
+<template lang="pug" src="./PageDisclosure.pug"></template>
+<script src="./PageDisclosure.js"></script>

package/docs/src/views/PageDisclosure/PageDisclosureBasic/PageDisclosureBasic.js

@@ -0,0 +1,42 @@
+import AlohaExample from "../../../global/components/AlohaExample/AlohaExample.vue";
+import ADisclosure from "../../../../../src/ADisclosure/ADisclosure";
+
+import HtmlAPI from "./compositionAPI/HtmlAPI";
+import JsAPI from "./compositionAPI/JsAPI";
+
+export default {
+  name: "PageDisclosureBasic",
+  components: {
+    AlohaExample,
+    ADisclosure,
+  },
+  setup() {
+    const {
+      codeHtml,
+    } = HtmlAPI();
+
+    const {
+      codeJs,
+    } = JsAPI();
+
+    const textLess = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus.";
+    const textMore = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, 
+pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus. 
+Donec scelerisque sollicitudin enim eu venenatis. Duis tincidunt laoreet ex, 
+in pretium orci vestibulum eget. Class aptent taciti sociosqu ad litora torquent
+per conubia nostra, per inceptos himenaeos. Duis pharetra luctus lacus ut 
+vestibulum. Maecenas ipsum lacus, lacinia quis posuere ut, pulvinar vitae dolor.
+Integer eu nibh at nisi ullamcorper sagittis id vel leo. Integer feugiat 
+faucibus libero, at maximus nisl suscipit posuere. Morbi nec enim nunc. 
+Phasellus bibendum turpis ut ipsum egestas, sed sollicitudin elit convallis. 
+Cras pharetra mi tristique sapien vestibulum lobortis. Nam eget bibendum metus, 
+non dictum mauris. Nulla at tellus sagittis, viverra est a, bibendum metus.`;
+
+    return {
+      codeHtml,
+      codeJs,
+      textLess,
+      textMore,
+    };
+  },
+};

package/docs/src/views/PageDisclosure/PageDisclosureBasic/PageDisclosureBasic.pug

@@ -0,0 +1,12 @@
+aloha-example(
+  :code-html="codeHtml"
+  :code-js="codeJs"
+  header="_A_BASIC_USAGE_"
+  :props="['text-less', 'text-more']"
+)
+  .a_columns.a_columns_count_12
+    .a_column.a_column_4.a_column_12_tablet
+      a-disclosure(
+        :text-less="textLess"
+        :text-more="textMore"
+      )

package/docs/src/views/PageDisclosure/PageDisclosureBasic/PageDisclosureBasic.vue

@@ -0,0 +1,2 @@
+<template lang="pug" src="./PageDisclosureBasic.pug"></template>
+<script src="./PageDisclosureBasic.js"></script>

package/docs/src/views/PageDisclosure/PageDisclosureBasic/compositionAPI/HtmlAPI.js

@@ -0,0 +1,10 @@
+export default function HtmlAPI() {
+  const codeHtml = `<a-disclosure
+  :text-less="textLess"
+  :text-more="textMore"
+></a-disclosure>`;
+
+  return {
+    codeHtml,
+  };
+}

package/docs/src/views/PageDisclosure/PageDisclosureBasic/compositionAPI/JsAPI.js

@@ -0,0 +1,33 @@
+export default function JsAPI() {
+  const codeJs = `import ADisclosure from "aloha-vue/src/ADisclosure/ADisclosure";
+    
+export default {
+  name: "PageDisclosureBasic",
+  components: {
+    ADisclosure,
+  },
+  setup() {
+    const textLess = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus.";
+    const textMore = \`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, 
+pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus. 
+Donec scelerisque sollicitudin enim eu venenatis. Duis tincidunt laoreet ex, 
+in pretium orci vestibulum eget. Class aptent taciti sociosqu ad litora torquent
+per conubia nostra, per inceptos himenaeos. Duis pharetra luctus lacus ut 
+vestibulum. Maecenas ipsum lacus, lacinia quis posuere ut, pulvinar vitae dolor.
+Integer eu nibh at nisi ullamcorper sagittis id vel leo. Integer feugiat 
+faucibus libero, at maximus nisl suscipit posuere. Morbi nec enim nunc. 
+Phasellus bibendum turpis ut ipsum egestas, sed sollicitudin elit convallis. 
+Cras pharetra mi tristique sapien vestibulum lobortis. Nam eget bibendum metus, 
+non dictum mauris. Nulla at tellus sagittis, viverra est a, bibendum metus.\`;
+
+    return {
+      textLess,
+      textMore,
+    };
+  },
+};`;
+
+  return {
+    codeJs,
+  };
+}

package/docs/src/views/PageDisclosure/PageDisclosureBtnClass/PageDisclosureBtnClass.js

@@ -0,0 +1,42 @@
+import AlohaExample from "../../../global/components/AlohaExample/AlohaExample.vue";
+import ADisclosure from "../../../../../src/ADisclosure/ADisclosure";
+
+import HtmlAPI from "./compositionAPI/HtmlAPI";
+import JsAPI from "./compositionAPI/JsAPI";
+
+export default {
+  name: "PageDisclosureBtnClass",
+  components: {
+    AlohaExample,
+    ADisclosure,
+  },
+  setup() {
+    const {
+      codeHtml,
+    } = HtmlAPI();
+
+    const {
+      codeJs,
+    } = JsAPI();
+
+    const textLess = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus.";
+    const textMore = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, 
+pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus. 
+Donec scelerisque sollicitudin enim eu venenatis. Duis tincidunt laoreet ex, 
+in pretium orci vestibulum eget. Class aptent taciti sociosqu ad litora torquent
+per conubia nostra, per inceptos himenaeos. Duis pharetra luctus lacus ut 
+vestibulum. Maecenas ipsum lacus, lacinia quis posuere ut, pulvinar vitae dolor.
+Integer eu nibh at nisi ullamcorper sagittis id vel leo. Integer feugiat 
+faucibus libero, at maximus nisl suscipit posuere. Morbi nec enim nunc. 
+Phasellus bibendum turpis ut ipsum egestas, sed sollicitudin elit convallis. 
+Cras pharetra mi tristique sapien vestibulum lobortis. Nam eget bibendum metus, 
+non dictum mauris. Nulla at tellus sagittis, viverra est a, bibendum metus.`;
+
+    return {
+      codeHtml,
+      codeJs,
+      textLess,
+      textMore,
+    };
+  },
+};

package/docs/src/views/PageDisclosure/PageDisclosureBtnClass/PageDisclosureBtnClass.pug

@@ -0,0 +1,15 @@
+aloha-example(
+  :code-html="codeHtml"
+  :code-js="codeJs"
+  header="_A_DISCLOSURE_GROUP_BTN_CLASS_HEADER_"
+  description="_A_DISCLOSURE_GROUP_BTN_CLASS_DESCRIPTION_"
+  :props="['btn-class', 'btn-parent-class']"
+)
+  .a_columns.a_columns_count_12
+    .a_column.a_column_4.a_column_12_tablet
+      a-disclosure(
+        :text-less="textLess"
+        :text-more="textMore"
+        btn-class="a_btn a_btn_primary"
+        btn-parent-class="a_text_left"
+      )

package/docs/src/views/PageDisclosure/PageDisclosureBtnClass/PageDisclosureBtnClass.vue

@@ -0,0 +1,2 @@
+<template lang="pug" src="./PageDisclosureBtnClass.pug"></template>
+<script src="./PageDisclosureBtnClass.js"></script>

package/docs/src/views/PageDisclosure/PageDisclosureBtnClass/compositionAPI/HtmlAPI.js

@@ -0,0 +1,12 @@
+export default function HtmlAPI() {
+  const codeHtml = `<a-disclosure
+  :text-less="textLess"
+  :text-more="textMore"
+  btn-class="a_btn a_btn_primary"
+  btn-parent-class="a_text_left"
+></a-disclosure>`;
+
+  return {
+    codeHtml,
+  };
+}

package/docs/src/views/PageDisclosure/PageDisclosureBtnClass/compositionAPI/JsAPI.js

@@ -0,0 +1,33 @@
+export default function JsAPI() {
+  const codeJs = `import ADisclosure from "aloha-vue/src/ADisclosure/ADisclosure";
+    
+export default {
+  name: "PageDisclosureBtnClass",
+  components: {
+    ADisclosure,
+  },
+  setup() {
+    const textLess = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus.";
+    const textMore = \`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, 
+pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus. 
+Donec scelerisque sollicitudin enim eu venenatis. Duis tincidunt laoreet ex, 
+in pretium orci vestibulum eget. Class aptent taciti sociosqu ad litora torquent
+per conubia nostra, per inceptos himenaeos. Duis pharetra luctus lacus ut 
+vestibulum. Maecenas ipsum lacus, lacinia quis posuere ut, pulvinar vitae dolor.
+Integer eu nibh at nisi ullamcorper sagittis id vel leo. Integer feugiat 
+faucibus libero, at maximus nisl suscipit posuere. Morbi nec enim nunc. 
+Phasellus bibendum turpis ut ipsum egestas, sed sollicitudin elit convallis. 
+Cras pharetra mi tristique sapien vestibulum lobortis. Nam eget bibendum metus, 
+non dictum mauris. Nulla at tellus sagittis, viverra est a, bibendum metus.\`;
+
+    return {
+      textLess,
+      textMore,
+    };
+  },
+};`;
+
+  return {
+    codeJs,
+  };
+}

package/docs/src/views/PageDisclosure/PageDisclosureBtnIcons/PageDisclosureBtnIcons.js

@@ -0,0 +1,42 @@
+import AlohaExample from "../../../global/components/AlohaExample/AlohaExample.vue";
+import ADisclosure from "../../../../../src/ADisclosure/ADisclosure";
+
+import HtmlAPI from "./compositionAPI/HtmlAPI";
+import JsAPI from "./compositionAPI/JsAPI";
+
+export default {
+  name: "PageDisclosureBtnIcons",
+  components: {
+    AlohaExample,
+    ADisclosure,
+  },
+  setup() {
+    const {
+      codeHtml,
+    } = HtmlAPI();
+
+    const {
+      codeJs,
+    } = JsAPI();
+
+    const textLess = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus.";
+    const textMore = `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nisl eros, 
+pulvinar facilisis justo mollis, auctor consequat urna. Morbi a bibendum metus. 
+Donec scelerisque sollicitudin enim eu venenatis. Duis tincidunt laoreet ex, 
+in pretium orci vestibulum eget. Class aptent taciti sociosqu ad litora torquent
+per conubia nostra, per inceptos himenaeos. Duis pharetra luctus lacus ut 
+vestibulum. Maecenas ipsum lacus, lacinia quis posuere ut, pulvinar vitae dolor.
+Integer eu nibh at nisi ullamcorper sagittis id vel leo. Integer feugiat 
+faucibus libero, at maximus nisl suscipit posuere. Morbi nec enim nunc. 
+Phasellus bibendum turpis ut ipsum egestas, sed sollicitudin elit convallis. 
+Cras pharetra mi tristique sapien vestibulum lobortis. Nam eget bibendum metus, 
+non dictum mauris. Nulla at tellus sagittis, viverra est a, bibendum metus.`;
+
+    return {
+      codeHtml,
+      codeJs,
+      textLess,
+      textMore,
+    };
+  },
+};

package/docs/src/views/PageDisclosure/PageDisclosureBtnIcons/PageDisclosureBtnIcons.pug

@@ -0,0 +1,17 @@
+aloha-example(
+  :code-html="codeHtml"
+  :code-js="codeJs"
+  header="_A_DISCLOSURE_GROUP_BTN_ICONS_HEADER_"
+  description="_A_DISCLOSURE_GROUP_BTN_ICONS_DESCRIPTION_"
+  :props="['btn-icon-left-less', 'btn-icon-right-less', 'btn-icon-left-more', 'btn-icon-right-more']"
+)
+  .a_columns.a_columns_count_12
+    .a_column.a_column_4.a_column_12_tablet
+      a-disclosure(
+        :text-less="textLess"
+        :text-more="textMore"
+        btn-icon-left-less="ChevronUp"
+        btn-icon-right-less="ChevronUp"
+        btn-icon-left-more="ChevronDown"
+        btn-icon-right-more="ChevronDown"
+      )

package/docs/src/views/PageDisclosure/PageDisclosureBtnIcons/PageDisclosureBtnIcons.vue

@@ -0,0 +1,2 @@
+<template lang="pug" src="./PageDisclosureBtnIcons.pug"></template>
+<script src="./PageDisclosureBtnIcons.js"></script>

package/docs/src/views/PageDisclosure/PageDisclosureBtnIcons/compositionAPI/HtmlAPI.js

@@ -0,0 +1,14 @@
+export default function HtmlAPI() {
+  const codeHtml = `<a-disclosure
+  :text-less="textLess"
+  :text-more="textMore"
+  btn-icon-left-less="ChevronUp"
+  btn-icon-right-less="ChevronUp"
+  btn-icon-left-more="ChevronDown"
+  btn-icon-right-more="ChevronDown"
+></a-disclosure>`;
+
+  return {
+    codeHtml,
+  };
+}