classcard-ui 0.2.253 → 0.2.258

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "classcard-ui",
-  "version": "0.2.253",
+  "version": "0.2.258",
   "main": "dist/classcard-ui.common.js",
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/CDatepicker/CDatepicker.vue

@@ -38,7 +38,7 @@
             :class="[
               disabled
                 ? 'border-gray-100 border-l-0 text-gray-400'
-                : 'border-gray-300 border-l-0 text-gray-700',
+                : 'border-gray-300 border-l-0 text-gray-900',
               'bg-white w-full p-2 appearance-none border  rounded-r-md focus:outline-none focus:border-blue-500 text-sm',
             ]"
             :readonly="disabled"

package/src/components/CEditor/CEditor.vue

@@ -80,6 +80,6 @@ export default {
 }
 
 .ql-editor {
-  @apply text-sm;
+  @apply text-sm text-gray-900;
 }
 </style>

package/src/components/CInput/CInput.vue

@@ -19,7 +19,7 @@
         @input="$emit('input', $event.target.value)"
         @blur="$emit('blur', $event.target.value)"
         :class="errorClasses"
-        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50"
+        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
         :placeholder="placeholder"
         :disabled="disabled"
       />

package/src/components/CInputAddon/CInputAddon.vue

@@ -28,7 +28,7 @@
         @input="$emit('input', $event.target.value)"
         @blur="$emit('blur', $event.target.value)"
         :class="{ ...errorClasses, 'rounded-l-md': !addon }"
-        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-r-md sm:text-sm disabled:opacity-50"
+        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-r-md sm:text-sm disabled:opacity-50 text-gray-900"
         :placeholder="placeholder"
         :disabled="disabled"
       />
@@ -49,7 +49,7 @@
         @input="$emit('input', $event.target.value)"
         @blur="$emit('blur', $event.target.value)"
         :class="errorClasses"
-        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-l-md sm:text-sm disabled:opacity-50"
+        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-l-md sm:text-sm disabled:opacity-50 text-gray-900"
         :placeholder="placeholder"
         :disabled="disabled"
       />
@@ -76,7 +76,7 @@
         @input="$emit('input', $event.target.value)"
         @blur="$emit('blur', $event.target.value)"
         :class="errorClasses"
-        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50"
+        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-full px-3 py-2 rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
         :placeholder="placeholder"
         :disabled="disabled"
       />
@@ -117,7 +117,7 @@
         @blur="$emit('blur', $event.target.value)"
         :class="errorClasses"
         :style="`padding-left:${leftPaddingStyle}`"
-        class="focus:ring-indigo-500 focus:border-indigo-500 block w-full rounded-md sm:text-sm disabled:opacity-50"
+        class="focus:ring-indigo-500 focus:border-indigo-500 block w-full rounded-md sm:text-sm disabled:opacity-50 text-gray-900"
         :placeholder="placeholder"
         :disabled="disabled"
       />

package/src/components/CInputEmail/CInputEmail.vue

@@ -10,7 +10,7 @@
       <input
         type="text"
         :class="errorClasses"
-        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-96 px-3 py-2 rounded-md sm:text-sm"
+        class="focus:ring-indigo-500 focus:border-indigo-500 flex-1 block w-96 px-3 py-2 rounded-md sm:text-sm text-gray-900"
         :placeholder="placeholder"
         v-model="email"
         @blur="checkValidation"
@@ -69,12 +69,12 @@ export default {
   },
   methods: {
     checkValidation() {
-      this.isValidate = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/.test(
-        this.email
-      ) || this.email == ''
-        ? false
-        : true;
-    }
+      this.isValidate =
+        /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/.test(this.email) ||
+        this.email == ""
+          ? false
+          : true;
+    },
   },
 };
 </script>

package/src/components/CMultiselect/CMultiselect.vue

@@ -15,8 +15,10 @@
       :options="options"
       @input="setSelectedOptions"
       @search="fetchOptions"
+      @search:focus="$emit('search:focus')"
       :label="optionLabel"
       :clearable="clearable"
+      :loading="loading"
     >
       <template #open-indicator="{ attributes }">
         <span v-bind="attributes">
@@ -41,6 +43,29 @@
         >
         <span v-else>No options found, try searching something else.</span>
       </template>
+      <template #spinner="{ loading }">
+        <svg
+          class="animate-spin h-5 w-5 text-gray-400"
+          xmlns="http://www.w3.org/2000/svg"
+          fill="none"
+          viewBox="0 0 24 24"
+          v-if="loading"
+        >
+          <circle
+            class="opacity-25"
+            cx="12"
+            cy="12"
+            r="10"
+            stroke="currentColor"
+            stroke-width="4"
+          ></circle>
+          <path
+            class="opacity-75"
+            fill="currentColor"
+            d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+          ></path>
+        </svg>
+      </template>
       <template slot="option" slot-scope="option">
         <slot name="custom-option" v-bind:option="option"></slot>
       </template>
@@ -137,6 +162,10 @@ export default {
     errorMessage: {
       type: String,
     },
+    loading: {
+      type: Boolean,
+      default: false,
+    },
   },
   computed: {},
   data() {
@@ -179,7 +208,7 @@ export default {
   @apply rounded-b-md;
 }
 .vs__selected {
-  @apply border-none m-0 py-0 px-1.5 mr-1;
+  @apply border-none m-0 py-0 pl-0 pr-1.5 mr-1;
 }
 .vs__search,
 .vs__search:focus {

package/src/components/CPhoneNumber/CPhoneNumber.vue

@@ -48,6 +48,7 @@ export default {
 <style>
 .vue-tel-input {
   border: 1px solid #d1d5db !important;
+  @apply text-gray-900;
 }
 
 #c-phone {

package/src/components/CTextarea/CTextarea.vue

@@ -16,7 +16,7 @@
         :rows="rows"
         :class="errorClasses"
         :disabled="disabled"
-        class="focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm rounded-md disabled:opacity-50"
+        class="focus:ring-indigo-500 focus:border-indigo-500 block w-full sm:text-sm rounded-md disabled:opacity-50 text-gray-900"
       ></textarea>
       <div
         v-if="!isValidate"