@avakhula/ui 0.0.344 → 0.0.346

package/package.json

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

package/src/App.vue

@@ -5,6 +5,8 @@
     </template>
   </ib-select>
 
+  <ib-text-editor :character-limit="40" name="test-name" character-limit-error-message="limit error"></ib-text-editor>
+
 
 </template>
 
@@ -12,7 +14,7 @@
 import IbSelect from "./components/TreeSelect/Select.vue";
 import label from "@/components/Form/Label/Label.vue";
 import {IbCheckboxGroup} from "./index.js";
-import {IbRadio} from "./index.js";
+import {IbRadio, IbTextEditor} from "./index.js";
 const testData1 = [
   {
     id: "1",
@@ -20,9 +22,9 @@ const testData1 = [
     is_category: true,
     initiallyVisible: true,
     visible: true,
-    isDisabled: false,
-    checked: true,
-    isChildrenVisible: true,
+    isDisabled: true,
+    checked: false,
+    isChildrenVisible: false,
   },
   {
     id: "2",
@@ -30,7 +32,7 @@ const testData1 = [
     is_category: true,
     initiallyVisible: true,
     visible: true,
-    isDisabled: false,
+    isDisabled: true,
     checked: false,
     isChildrenVisible: true,
   },
@@ -60,7 +62,7 @@ const testData1 = [
     is_category: true,
     initiallyVisible: true,
     visible: true,
-    isDisabled: false,
+    isDisabled: true,
     checked: false,
     isChildrenVisible: true,
   },
@@ -123,7 +125,7 @@ const testData1 = [
     is_category: true,
     initiallyVisible: true,
     visible: true,
-    isDisabled: false,
+    isDisabled: true,
     checked: false,
     isChildrenVisible: true,
   },
@@ -140,6 +142,6 @@ export default {
       checked: '1'
     }
   },
-  components: {IbSelect, IbCheckboxGroup, IbRadio}
+  components: {IbTextEditor, IbSelect, IbCheckboxGroup, IbRadio}
 }
 </script>

package/src/components/Form/TextEditor/TextEditor.vue

@@ -23,6 +23,8 @@
       {{ characterLimitErrorMessage }}
     </ib-alert>
 
+    <input :name="name" type="hidden" :disabled="disable" :value="data">
+
     <div class="ib-text-editor-wrapper" :class="{ disable: disable }">
       <div
         class="ib-text-editor"
@@ -134,27 +136,27 @@
 </template>
 
 <script>
-import { QuillEditor, Quill } from "@vueup/vue-quill";
+import {Quill, QuillEditor} from "@vueup/vue-quill";
 import IbIconButton from "../../IconButton/IconButton.vue";
 import IbAlert from "../../Alert/Alert.vue";
 import IbCharacterCount from "../CharactersCount.vue";
-import { AlphabetList, AlphabetListItem } from "./plugins/alphabetList";
+import {AlphabetList, AlphabetListItem} from "./plugins/alphabetList";
 import "@vueup/vue-quill/dist/vue-quill.snow.css";
 
 import {
+  ALIGN_CENTER,
+  ALIGN_JUSTIFY,
+  ALIGN_LEFT,
+  ALIGN_RIGHT,
   BOLD,
-  ITALIC,
-  UNDERLINE,
-  STRIKE,
   CODE,
+  ITALIC,
   LINK,
-  ALIGN_LEFT,
-  ALIGN_CENTER,
-  ALIGN_RIGHT,
-  ALIGN_JUSTIFY,
-  LIST_ORDERED,
-  LIST_BULLET,
   LIST_ALPHABET,
+  LIST_BULLET,
+  LIST_ORDERED,
+  STRIKE,
+  UNDERLINE,
 } from "./icons/toolbarIcons";
 
 const icons = Quill.import("ui/icons");
@@ -183,6 +185,10 @@ Quill.debug("error");
 export default {
   name: "IbTextEditor",
   props: {
+    name: {
+      type: String,
+      required: true
+    },
     placeholder: {
       type: String,
       default: "",
@@ -234,6 +240,7 @@ export default {
       type: String,
     },
   },
+  emits: ['onOverLimitHandler'],
   mounted() {
     // Reset default styles for toolbar
     this.$refs.toolbar.classList.remove("ql-toolbar");
@@ -258,6 +265,9 @@ export default {
     data(val) {
       this.$emit("update:modelValue", val);
     },
+    characterOverLimit(value) {
+      this.$emit('onOverLimitHandler', value);
+    }
   },
   methods: {
     onChange() {

package/src/components/Pagination/LimitSelector.vue

@@ -4,6 +4,7 @@
     <ib-select
       classList="report-limit-selector-select"
       :value="value"
+      :vertical="vertical"
       :options="prepareOptions"
       :is-multiple="false"
       :show-clear-button="false"
@@ -25,6 +26,9 @@ export default {
     value: {
       type: Number,
     },
+    vertical: {
+      type: String
+    },
     options: {
       type: Array,
       default: () => [10, 25, 50, 100],

package/src/components/Pagination/Pagination.vue

@@ -3,6 +3,7 @@
     <ib-limit-selector
       @select="changeLimit"
       :value="limitValue"
+      :vertical="vertical"
       :label-select="labelSelect"
     ></ib-limit-selector>
 
@@ -104,6 +105,9 @@ export default {
       type: Boolean,
       default: true,
     },
+    vertical: {
+      type: String
+    }
   },
   data() {
     return {

package/src/components/TreeSelect/Select.vue

@@ -13,7 +13,9 @@
       :disabled="isLoading || disable"
       :is-resizable="isResizable"
       :vertical="verticalVal"
-      :class="disable ? 'disable' : ''"
+      :class="{
+        disable: disable
+      }"
       ref="dropdown"
       @close="onClose"
       @open="onOpen"
@@ -424,7 +426,7 @@ export default {
     },
     disable: {
       type: Boolean,
-      default: true
+      default: false
     }
   },
   emits: [
@@ -742,7 +744,6 @@ export default {
                 typeof option.visible === "undefined" ? true : option.visible;
               option.visible = option.initiallyVisible;
               option.readonly = option.readonly ? true : false;
-              option.isDisabled = false;
 
               option.checked = this.isMultiple
                 ? this.val !== null &&

package/src/components/TreeSelect/scss/option.scss

@@ -205,4 +205,8 @@ $option-checked-hover-bg: $blue-50;
       }
     }
   }
+
+  .disabled {
+    color: $neutral-500 !important;
+  }
 }