@appscode/design-system 2.4.8 → 2.4.10

package/package.json

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

package/vue-components/v3/cards/OverviewCards.vue

@@ -26,7 +26,7 @@ withDefaults(defineProps<Props>(), {
 .overview-cards-wrapper {
   border: 1px solid $color-border;
   margin-right: 20px;
-  height: calc(100% - 16px);
+  height: 100%;
 }
 .overview-cards {
   display: grid;

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

@@ -8,6 +8,7 @@ interface Props {
   placeholderText?: string;
   disabled?: boolean;
   label?: string;
+  taggable?: boolean;
   allowEmpty?: boolean;
   options?: unknown[];
   trackBy?: string;
@@ -17,12 +18,14 @@ interface Props {
   isLoaderActive?: boolean;
   noResultText?: string;
   showStar?: boolean;
+  tagPlaceholder?: string;
   wrapperDivCustomClass?: string;
   multiselectCustomClass?: string;
   openDirection?: "top" | "bottom";
   groupLabel?: string;
   groupValues?: string;
   groupSelect?: boolean;
+  onTagAdd?: Function;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -45,6 +48,9 @@ const props = withDefaults(defineProps<Props>(), {
   groupLabel: "",
   groupValues: "",
   groupSelect: false,
+  taggable: false,
+  tagPlaceholder: "",
+  onTagAdd: () => "",
 });
 
 const emit = defineEmits(["select", "remove", "refresh-btn-click"]);
@@ -141,16 +147,19 @@ const onSelect = (selectedOption: unknown, id: string) => emit("select", selecte
       :disabled="disabled || isLoaderActive"
       :allow-empty="false"
       :show-labels="false"
+      :taggable="taggable"
       :close-on-select="true"
       :open-direction="openDirection"
       :group-values="groupValues"
       :group-label="groupLabel"
       :group-select="groupSelect"
+      :tag-placeholder="tagPlaceholder"
       data-testid="simple-select-box"
       @open="openDropDown"
       @close="closeDropDown"
       @select="onSelect"
       @remove="onRemove"
+      @tag="onTagAdd"
     >
       <template #noResult>
         <span> {{ noResultText }} </span>