classcard-ui 0.2.1509 → 0.2.1510

package/src/components/CRangeSlider/CRangeSlider.vue

@@ -1,55 +1,55 @@
-<template>
-  <div class="flex  w-64 m-auto items-center h-32 justify-center">
-    <div class="py-1 relative min-w-full">
-      <div class="h-2 bg-gray-200 rounded-full">
-        <div
-          class="absolute h-2 rounded-full bg-teal-600 w-0"
-          style="width: 58.5714%;"
-        ></div>
-        <div
-          class="absolute h-4 flex items-center justify-center w-4 rounded-full bg-white shadow border border-gray-300 -ml-2 top-0 cursor-pointer"
-          unselectable="on"
-          onselectstart="return false;"
-          style="left: 58.5714%;"
-        >
-          <div class="relative -mt-2 w-1">
-            <div
-              class="absolute z-40 opacity-100 bottom-100 mb-2 left-0 min-w-full"
-              style="margin-left: -20.5px;"
-            >
-              <div class="relative shadow-md">
-                <div
-                  class="bg-black -mt-8 text-white truncate text-xs rounded py-1 px-4"
-                >
-                  92
-                </div>
-                <svg
-                  class="absolute text-black w-full h-2 left-0 top-100"
-                  x="0px"
-                  y="0px"
-                  viewBox="0 0 255 255"
-                  xml:space="preserve"
-                >
-                  <polygon
-                    class="fill-current"
-                    points="0,0 127.5,127.5 255,0"
-                  ></polygon>
-                </svg>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div class="absolute text-gray-800 -ml-1 bottom-0 left-0 -mb-6">10</div>
-        <div class="absolute text-gray-800 -mr-1 bottom-0 right-0 -mb-6">
-          150
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-export default {
-  name: "CRangeSlider",
-  props: {},
-};
-</script>
+<template>
+  <div class="flex  w-64 m-auto items-center h-32 justify-center">
+    <div class="py-1 relative min-w-full">
+      <div class="h-2 bg-gray-200 rounded-full">
+        <div
+          class="absolute h-2 rounded-full bg-teal-600 w-0"
+          style="width: 58.5714%;"
+        ></div>
+        <div
+          class="absolute h-4 flex items-center justify-center w-4 rounded-full bg-white shadow border border-gray-300 -ml-2 top-0 cursor-pointer"
+          unselectable="on"
+          onselectstart="return false;"
+          style="left: 58.5714%;"
+        >
+          <div class="relative -mt-2 w-1">
+            <div
+              class="absolute z-40 opacity-100 bottom-100 mb-2 left-0 min-w-full"
+              style="margin-left: -20.5px;"
+            >
+              <div class="relative shadow-md">
+                <div
+                  class="bg-black -mt-8 text-white truncate text-xs rounded py-1 px-4"
+                >
+                  92
+                </div>
+                <svg
+                  class="absolute text-black w-full h-2 left-0 top-100"
+                  x="0px"
+                  y="0px"
+                  viewBox="0 0 255 255"
+                  xml:space="preserve"
+                >
+                  <polygon
+                    class="fill-current"
+                    points="0,0 127.5,127.5 255,0"
+                  ></polygon>
+                </svg>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="absolute text-gray-800 -ml-1 bottom-0 left-0 -mb-6">10</div>
+        <div class="absolute text-gray-800 -mr-1 bottom-0 right-0 -mb-6">
+          150
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "CRangeSlider",
+  props: {},
+};
+</script>

package/src/components/CRangeSlider/index.js

@@ -1,3 +1,3 @@
-import CRangeSlider from './CRangeSlider.vue'
-
+import CRangeSlider from './CRangeSlider.vue'
+
 export default CRangeSlider

package/src/components/CReorderableStackedList/CReorderableStackedList.vue

@@ -1,94 +1,94 @@
-<template>
-  <div>
-    <ul>
-      <li
-        v-for="items in listItems"
-        v-bind:key="items.size"
-        class="flex items-center py-3"
-        :class="{ 'cursor-pointer': items.collapse }"
-        v-on="items.collapse ? { click: () => collapseList() } : null"
-      >
-        <c-icon
-          v-if="items.collapse"
-          :name="showSection ? 'chevron-down' : 'chevron-right'"
-          type="solid"
-          class="mt-3 mr-3 h-5 w-5 flex-none text-gray-900"
-        ></c-icon>
-        <c-icon
-          v-if="items.reorder"
-          name="menu-solid"
-          type="solid"
-          :cursorType="cursorType"
-          class="handle mr-3 h-5 w-5 flex-none text-gray-500"
-        ></c-icon>
-        <c-avatar
-          :size="items.size"
-          :rounded="items.rounded"
-          :image="items.image"
-          :imageClasses="items.imageClasses"
-          class="flex-none"
-        ></c-avatar>
-        <div class="flex min-w-0 flex-1 items-center justify-between">
-          <div class="ml-3 min-w-0 flex-1">
-            <div>
-              <div class="-m-1 flex flex-wrap items-center">
-                <p class="m-1 text-sm font-medium text-gray-900">
-                  {{ items.heading }}
-                </p>
-                <c-tag v-if="items.tag" label="Active" class="m-1"></c-tag>
-                <c-tag v-if="items.tag" label="Inactive" class="m-1"></c-tag>
-                <c-tag v-if="items.tag" label="Tag 1" class="m-1"></c-tag>
-                <c-tag v-if="items.tag" label="Tag 2" class="m-1"></c-tag>
-              </div>
-              <p class="mt-1 text-sm text-gray-500">{{ items.description }}</p>
-              <div v-if="showSection" class="mt-3">
-                <slot></slot>
-              </div>
-            </div>
-          </div>
-          <div class="flex flex-none items-center">
-            <slot name="icons"></slot>
-            <button
-              type="button"
-              v-if="items.listIcon"
-              @click="$emit('remove')"
-              class="focus:outline-none"
-            >
-              <!-- slot for delete icons -->
-              <slot name="removeIcons"></slot>
-            </button>
-          </div>
-        </div>
-      </li>
-    </ul>
-  </div>
-</template>
-<script>
-import CAvatar from "../CAvatar/CAvatar.vue";
-import CTag from "../CTag/CTag.vue";
-import CIcon from "../CIcon/CIcon.vue";
-export default {
-  name: "CReorderableStackedList",
-  components: { CAvatar, CTag, CIcon },
-  props: {
-    listItems: {
-      type: Array,
-      required: true,
-    },
-    cursorType: {
-      type: String,
-      default: "cursor-move",
-    },
-  },
-  data() {
-    return {
-      showSection: false,
-    };
-  },
-  methods: {
-    collapseList() {
-      this.showSection = !this.showSection;
-    },
-  },
-};
-</script>
+<template>
+  <div>
+    <ul>
+      <li
+        v-for="items in listItems"
+        v-bind:key="items.size"
+        class="flex items-center py-3"
+        :class="{ 'cursor-pointer': items.collapse }"
+        v-on="items.collapse ? { click: () => collapseList() } : null"
+      >
+        <c-icon
+          v-if="items.collapse"
+          :name="showSection ? 'chevron-down' : 'chevron-right'"
+          type="solid"
+          class="mt-3 mr-3 h-5 w-5 flex-none text-gray-900"
+        ></c-icon>
+        <c-icon
+          v-if="items.reorder"
+          name="menu-solid"
+          type="solid"
+          :cursorType="cursorType"
+          class="handle mr-3 h-5 w-5 flex-none text-gray-500"
+        ></c-icon>
+        <c-avatar
+          :size="items.size"
+          :rounded="items.rounded"
+          :image="items.image"
+          :imageClasses="items.imageClasses"
+          class="flex-none"
+        ></c-avatar>
+        <div class="flex min-w-0 flex-1 items-center justify-between">
+          <div class="ml-3 min-w-0 flex-1">
+            <div>
+              <div class="-m-1 flex flex-wrap items-center">
+                <p class="m-1 text-sm font-medium text-gray-900">
+                  {{ items.heading }}
+                </p>
+                <c-tag v-if="items.tag" label="Active" class="m-1"></c-tag>
+                <c-tag v-if="items.tag" label="Inactive" class="m-1"></c-tag>
+                <c-tag v-if="items.tag" label="Tag 1" class="m-1"></c-tag>
+                <c-tag v-if="items.tag" label="Tag 2" class="m-1"></c-tag>
+              </div>
+              <p class="mt-1 text-sm text-gray-500">{{ items.description }}</p>
+              <div v-if="showSection" class="mt-3">
+                <slot></slot>
+              </div>
+            </div>
+          </div>
+          <div class="flex flex-none items-center">
+            <slot name="icons"></slot>
+            <button
+              type="button"
+              v-if="items.listIcon"
+              @click="$emit('remove')"
+              class="focus:outline-none"
+            >
+              <!-- slot for delete icons -->
+              <slot name="removeIcons"></slot>
+            </button>
+          </div>
+        </div>
+      </li>
+    </ul>
+  </div>
+</template>
+<script>
+import CAvatar from "../CAvatar/CAvatar.vue";
+import CTag from "../CTag/CTag.vue";
+import CIcon from "../CIcon/CIcon.vue";
+export default {
+  name: "CReorderableStackedList",
+  components: { CAvatar, CTag, CIcon },
+  props: {
+    listItems: {
+      type: Array,
+      required: true,
+    },
+    cursorType: {
+      type: String,
+      default: "cursor-move",
+    },
+  },
+  data() {
+    return {
+      showSection: false,
+    };
+  },
+  methods: {
+    collapseList() {
+      this.showSection = !this.showSection;
+    },
+  },
+};
+</script>

package/src/components/CReorderableStackedList/index.js

@@ -1,3 +1,3 @@
-import CReorderableStackedList from './CReorderableStackedList.vue'
-
+import CReorderableStackedList from './CReorderableStackedList.vue'
+
 export default CReorderableStackedList