@avakhula/ui 0.0.267 → 0.0.268

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@avakhula/ui",
-  "version": "0.0.267",
+  "version": "0.0.268",
   "main": "dist/index.js",
   "module": "dist/index.umd.cjs",
   "source": "src/index.js",

package/src/components/Alert/alert.scss

@@ -95,6 +95,7 @@ $alert-success-secondary-color: $green-50;
         margin-top: 5px;
         margin-bottom: 5px;
         padding-left: 0;
+        word-break: break-word;
       }
     }
 
@@ -107,6 +108,7 @@ $alert-success-secondary-color: $green-50;
         @include Ib-P1-regular;
         margin-bottom: 5px;
         padding-left: 0!important;
+        word-break: break-word;
       }
 
       & + .close-button {

package/src/components/Pagination/Pagination.vue

@@ -7,8 +7,7 @@
     ></ib-limit-selector>
 
     <div class="repot-pagination">
-      {{ displayPaginationInput }}
-      <template v-if="displayPaginationInput">
+      <template v-if="showPaginationInput">
         <ib-label>{{ labelInput }}</ib-label>
         <div class="pagination-input">
           <ib-input type="number" :debounce="500" @input="onInput"></ib-input>
@@ -23,10 +22,10 @@
         size="m"
         class="toggle-children button-prev"
         :disabled="currentPage === 1"
-        v-tooltip="tooltipTextPrev ? tooltipTextNext : lang('prev_page', 'system')"
         @click="onSelect(currentPage - 1)"
       >
         <ib-icon name="chevron-back-outline"></ib-icon>
+        <ib-tooltip v-if="tooltipTextPrev" :text="tooltipTextPrev"></ib-tooltip>
       </ib-icon-button>
 
       <ul class="pagination-wrapper">
@@ -53,10 +52,10 @@
         size="m"
         class="toggle-children button-next"
         :disabled="currentPage === countPagePagination"
-        v-tooltip="tooltipTextNext ? tooltipTextNext : lang('next_page', 'system')"
         @click="onSelect(currentPage + 1)"
       >
         <ib-icon name="chevron-forward-outline"></ib-icon>
+        <ib-tooltip v-if="tooltipTextNext" :text="tooltipTextNext"></ib-tooltip>
       </ib-icon-button>
     </div>
   </div>
@@ -68,8 +67,7 @@ import IbIconButton from "../IconButton/IconButton.vue";
 import IbInput from "../Form/Input/Input.vue";
 import IbLabel from "../Form/Label/Label.vue";
 import IbIcon from "../Icon.vue";
-import { TooltipDirective as Tooltip } from "../../directives/tooltip/tooltip";
-
+import IbTooltip from "../Tooltip/Tooltip.vue";
 export default {
   name: "IbPagination",
   props: {
@@ -223,14 +221,6 @@ export default {
     countPagePagination() {
       return Math.ceil(this.countRows / this.limitValue);
     },
-    displayPaginationInput() {
-      if(!this.showPaginationInput) return false;
-
-      return Boolean(this.countPagePagination >= 7);
-    }
-  },
-  directives: {
-    Tooltip
   },
   components: {
     IbIconButton,
@@ -238,7 +228,7 @@ export default {
     IbInput,
     IbLabel,
     IbLimitSelector,
-    // IbTooltip,
+    IbTooltip,
   },
 };
 </script>

package/src/components/Sorting/Sorting.stories.js

@@ -18,6 +18,10 @@ export default {
       control: { type: "select" },
       options: Object.keys(popoverPosition),
     },
+    tooltipIconPosition: {
+      control: { type: "select" },
+      options: Object.keys(popoverPosition),
+    },
   },
 };
 

package/src/components/Sorting/Sorting.vue

@@ -38,7 +38,7 @@
 
       <ib-icon-button
         v-if="!hideSortingButton"
-        v-tooltip="tooltipIconText"
+        v-tooltip:[tooltipIconPosition]="tooltipIconText"
         kind="white"
         size="s"
         @click="clickHandler"
@@ -88,6 +88,9 @@ export default {
     tooltipPosition: {
       type: String,
     },
+    tooltipIconPosition: {
+      type: String,
+    },
     tooltipIconSorting: {
       type: String,
     },