classcard-ui 0.2.417 → 0.2.420

package/package.json

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

package/src/components/CButton/CButton.vue

@@ -5,7 +5,7 @@
       v-if="type == 'tertiary'"
       :class="customClasses"
       class="flex cursor-pointer flex-row rounded-md px-4 py-2 text-sm text-indigo-600 hover:bg-indigo-100 hover:text-indigo-800 focus:outline-none focus:ring-2 focus:ring-indigo-200 focus:ring-offset-2"
-      @click="$emit('action')"
+      @click.prevent="$emit('action')"
     >
       <c-icon
         v-if="icon"
@@ -23,7 +23,7 @@
       :class="classes"
       :disabled="disabled"
       class="inline-flex items-center rounded-md px-4 py-2 text-sm font-medium shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50"
-      @click="$emit('action')"
+      @click.prevent="$emit('action')"
     >
       <c-icon v-if="isLoading" class="mr-2 h-5 w-5" name="loader"></c-icon>
       <c-icon
@@ -42,7 +42,7 @@
       :class="classes"
       :disabled="disabled"
       class="inline-flex items-center rounded-md px-3 py-2 text-sm font-medium shadow-sm focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50"
-      @click="$emit('action')"
+      @click.prevent="$emit('action')"
     >
       <c-icon v-if="isLoading" class="mr-2 h-5 w-5" name="loader"></c-icon>
       <c-icon

package/src/components/CInput/CInput.vue

@@ -7,7 +7,7 @@
           {{ label }}
         </label>
         <!-- asterisk sign to render if field is required -->
-        <p v-if="isRequired" class="text-red-600 ml-1">*</p>
+        <p v-if="isRequired" class="ml-1 text-red-600">*</p>
       </div>
       <!-- hint on the right side of input field -->
       <span v-if="hint" class="text-sm text-gray-500">{{ hint }}</span>
@@ -20,17 +20,18 @@
         @blur="$emit('blur', $event.target.value)"
         @focus="$emit('focus', $event.target.value)"
         :class="errorClasses"
-        class="shadow-sm 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"
+        class="block w-full flex-1 rounded-md px-3 py-2 text-gray-900 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 disabled:opacity-50 sm:text-sm"
         :placeholder="placeholder"
         :disabled="disabled"
       />
       <!-- to render to show validation is failed -->
       <div
-        v-if="!isValidate"
-        class="absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none text-red-600"
+        v-if="!isValidate && !customIcon"
+        class="pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3 text-red-600"
       >
         <c-icon name="exclamation-circle" type="solid" class="h-5 w-5"></c-icon>
       </div>
+      <slot name="customIcon" v-if="customIcon"></slot>
     </div>
     <!-- validation error message -->
     <p v-if="!isValidate" class="mt-2 text-sm text-red-600">
@@ -86,6 +87,10 @@ export default {
       type: String,
       default: "text",
     },
+    customIcon: {
+      type: Boolean,
+      default: false,
+    },
   },
   computed: {
     errorClasses() {

package/src/components/CUpload/CUpload.vue

@@ -2,7 +2,7 @@
   <div class="flex h-full flex-col">
     <div class="flex items-center justify-between">
       <label class="block text-sm font-medium text-gray-900">{{ label }}</label>
-      <label v-if="isUploaded" class="block text-sm font-medium text-gray-400">
+      <label v-if="!isUploaded" class="block text-sm font-medium text-gray-400">
         {{ hint }}
       </label>
     </div>