classcard-ui 0.2.810 → 0.2.812

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "classcard-ui",
-  "version": "0.2.810",
+  "version": "0.2.812",
   "main": "dist/classcard-ui.umd.min.js",
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/CSelect/CSelect.vue

@@ -12,18 +12,7 @@
       <span v-if="hint" class="text-sm text-gray-500">{{ hint }}</span>
     </div>
     <div class="relative">
-      <div
-        class="relative flex items-center rounded-md"
-        :class="{ ...classes, [inputClasses]: true }"
-      >
-        <c-icon
-          class="ml-3"
-          v-if="icon && !showImage"
-          :class="icon.class"
-          :name="icon.name"
-          :type="icon.type"
-        >
-        </c-icon>
+      <div :class="label ? 'mt-1' : ''">
         <input
           type="text"
           v-model="selectSearch"
@@ -33,13 +22,8 @@
           aria-haspopup="listbox"
           aria-expanded="true"
           aria-labelledby="listbox-label"
-          :class="`w-full cursor-pointer rounded-md border-0 border-transparent py-2 pl-2 pr-10 text-left text-sm focus:border-transparent ${
-            type === 'tertiary'
-              ? 'hover:bg-indigo-100'
-              : type === 'gray'
-              ? 'bg-gray-100 hover:bg-gray-200'
-              : ''
-          } focus:ring-0 disabled:opacity-50 sm:text-sm`"
+          class="w-full cursor-pointer rounded-md py-2 pl-2 pr-10 text-left text-sm focus:ring-0 disabled:opacity-50 sm:text-sm"
+          :class="{ ...classes, [inputClasses]: true }"
           :disabled="isDisabled"
           autocomplete="off"
         />
@@ -63,10 +47,14 @@
                 :isDynamicallyColored="coloredAvatars"
               ></c-avatar>
             </div>
-            <p
-              :class="showImage || icon ? 'ml-7' : ''"
-              class="block truncate text-sm"
+            <c-icon
+              v-if="icon && !showImage && !selectSearch"
+              :class="icon.class"
+              :name="icon.name"
+              :type="icon.type"
             >
+            </c-icon>
+            <p :class="showImage ? 'ml-3' : ''" class="block truncate text-sm">
               {{
                 selectedValue
                   ? selectedValue
@@ -280,11 +268,11 @@ export default {
   computed: {
     classes() {
       return {
-        "text-gray-900 border border-gray-200 hover:bg-gray-200 bg-gray-100 focus-within:bg-gray-100 focus-within:ring-2 focus-within:border-gray-200 focus-within:ring-gray-200 focus:ring-offset-2 shadow-sm":
+        "text-gray-900 border border-gray-200 hover:bg-gray-200 bg-gray-100 focus:ring-2 focus:border-gray-200 focus:ring-gray-200 focus:ring-offset-2 shadow-sm":
           this.type == "gray",
-        "bg-white border border-gray-200 hover:bg-indigo-100 text-indigo-600 hover:text-indigo-800 focus-within:border-indigo-200 focus-within:ring-2 focus-within:ring-indigo-200":
+        "bg-white border border-gray-200 hover:bg-indigo-100 text-indigo-600 hover:text-indigo-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-200":
           this.type == "tertiary",
-        "border border-gray-300 bg-white shadow-sm focus-within:border-indigo-500 focus-within:bg-white focus-within:ring-1 focus-within:ring-indigo-500":
+        "border border-gray-300 focus:ring-indigo-500 focus:border-indigo-500 bg-white shadow-sm focus:ring-1":
           this.type == null,
       };
     },

package/src/components/CTable/CTable.vue

@@ -426,6 +426,7 @@ export default {
       },
     });
     sortable.on("sortable:stop", (e) => this.rearrange(e.oldIndex, e.newIndex));
+    sortable.on("sortable:stop", (e) => console.log(e));
     document.addEventListener("keydown", this.handleControlClick, true);
     document.addEventListener("keyup", this.handleControlRelease, true);
   },
@@ -492,6 +493,7 @@ export default {
         ...remainingItems.slice(newIndex),
       ];
       this.reorderedArray = [...reorderedItems];
+      console.log(this.reorderedArray);
       this.$emit("reordered", this.reorderedArray);
     },
     // listing functions