@appscode/design-system 2.4.28 → 2.4.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appscode/design-system",
-  "version": "2.4.28",
+  "version": "2.4.30",
   "description": "A design system for Appscode websites and dashboards made using Bulma",
   "main": "main.scss",
   "scripts": {

package/vue-components/styles/base/utilities/_typography.scss

@@ -50,7 +50,7 @@ h5 {
 h6 {
   font-size: 1rem;
   letter-spacing: 0;
-  font-weight: normal;
+  font-weight: 500;
 } // 13px
 
 h6 {

package/vue-components/v3/form-fields/AcSelect.vue

@@ -160,6 +160,12 @@ const onSelect = (selectedOption: unknown, id: string) => emit("select", selecte
       <template #noResult>
         <span> {{ noResultText }} </span>
       </template>
+      <template #singleLabel="props">
+        <slot name="singleLabel" v-bind="props" />
+      </template>
+      <template #option="props">
+        <slot name="option" v-bind="props" />
+      </template>
     </multiselect>
     <p v-show="errorMsg" class="is-danger">
       {{ errorMsg }}

package/vue-components/v3/form-fields/SingleStepFormArray.vue

@@ -9,8 +9,6 @@ import HeroiconsTrash from "~icons/heroicons/trash";
 import HeroiconsChevronDownSolid from "~icons/heroicons/chevron-down-solid";
 import HeroiconsChevronUpSolid from "~icons/heroicons/chevron-up-solid";
 
-const JsonModal = defineAsyncComponent(() => import("../modals/JsonShowModal.vue"));
-
 interface Props {
   disabled?: boolean;
   isCreateDisabled?: boolean;
@@ -51,8 +49,6 @@ const editFieldIndex = ref(-1);
 const isFormHidden = ref(true);
 const isSavingNewElement = ref(false);
 const dataForTable = defineModel<Array<AcTableRow>>({ required: true });
-const isOpen = ref(false);
-const fullNamespaceList = ref<string[]>([]);
 
 function onAddClick() {
   isSavingNewElement.value = true;
@@ -93,29 +89,9 @@ function readableTime(utcTime: unknown) {
   if (typeof utcTime === "string") return new Date(utcTime).toLocaleString();
   else return utcTime;
 }
-function truncatedNamespaces(namespaces: string[]): string {
-  if (namespaces.length <= 1) {
-    return namespaces[0];
-  }
-  return namespaces.slice(0, 1).join(", ") + ` (+${namespaces.length - 1})`;
-}
-
-function showFullNamespaceList(namespaces: string[]): void {
-  isOpen.value = true;
-
-  fullNamespaceList.value = namespaces;
-}
 </script>
 
 <template>
-  <json-modal
-    v-if="isOpen"
-    :open="isOpen"
-    :title="'Namespace List'"
-    :editor-content="fullNamespaceList"
-    @closemodal="isOpen = false"
-  ></json-modal>
-
   <div :class="{ 'ac-nested-elements': label }">
     <!-- Add New Form Start -->
     <template v-if="isSavingNewElement">
@@ -208,21 +184,7 @@ function showFullNamespaceList(namespaces: string[]): void {
                 <tr data-testid="ac-table-row">
                   <td v-for="(itemColumn, idx) in itemRow.cells" :key="tableHeaders[idx].name + idx">
                     <template v-if="tableHeaders[idx].type === 'date'">
-                      {{ readableTime(itemColumn.data) }}
-                    </template>
-                    <template
-                      v-else-if="tableHeaders[idx].name.toLowerCase() === 'namespace' && Array.isArray(itemColumn.data)"
-                    >
-                      <span
-                        >{{ truncatedNamespaces(itemColumn.data) }}
-                        <div
-                          v-if="itemColumn.data.length > 1"
-                          class="tag is-secondary is-light"
-                          @click="showFullNamespaceList(itemColumn.data)"
-                        >
-                          <a>More </a>
-                        </div></span
-                      >
+                      {{ readableTime(itemColumn.data as string) }}
                     </template>
                     <template v-else>
                       {{ itemColumn.data }}