@appscode/design-system 2.4.26-alpha-1 → 2.4.26

package/main.scss

@@ -16,12 +16,10 @@
 // COMPONENTS
 // @import "@/components/vue-components/styles/components/all";
 @import "@/components/vue-components/styles/components/button";
-@import "@/components/vue-components/styles/components/avatar";
 @import "@/components/vue-components/styles/components/terminal";
 @import "@/components/vue-components/styles/components/steps";
 @import "@/components/vue-components/styles/components/code-preview/all";
 @import "@/components/vue-components/styles/components/form-fields/input";
-@import "@/components/vue-components/styles/components/form-fields/check-radio-switch";
 @import "@/components/vue-components/styles/components/form-fields/custom-selectbox";
 @import "@/components/vue-components/styles/components/ui-builder/vue-open-api";
 @import "@/components/vue-components/styles/components/ui-builder/ui-builder";

package/package.json

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

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

@@ -56,7 +56,7 @@ $secondary-dark-grey: hsl($secondary-hue, 10%, 10%);
 $secondary-light-gray: hsl($secondary-hue, 10%, 96%);
 $secondary-dark-gray: hsl($secondary-hue, 10%, 10%);
 
-$color-text: hsl($secondary-hue, 10%, 25%);
+$color-text: hsl($secondary-hue, 10%, 35%);
 $color-heading: hsl($secondary-hue, 10%, 10%);
 $color-label: hsl($secondary-hue, 20%, 30%);
 $color-link: hsl($secondary-hue, 40%, 20%);

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

@@ -333,19 +333,6 @@ hr {
   }
 }
 
-.overflow-y-hidden {
-  overflow-y: hidden;
-}
-.overflow-x-hidden {
-  overflow-x: hidden;
-}
-.overflow-y-auto {
-  overflow-y: auto;
-}
-.overflow-x-auto {
-  overflow-x: auto;
-}
-
 .is-transparent-bg {
   background-color: transparent !important;
 }

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

@@ -10,7 +10,7 @@ body {
   font-family: $font-paragraph;
   font-weight: 400;
   font-size: 13px;
-  color: $color-text;
+  color: $color-heading;
 }
 
 p {

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

@@ -145,7 +145,7 @@ const onSelect = (selectedOption: unknown, id: string) => emit("select", selecte
       :options="options"
       :placeholder="placeholderText"
       :disabled="disabled || isLoaderActive"
-      :allow-empty="false"
+      :allow-empty="allowEmpty"
       :show-labels="false"
       :taggable="taggable"
       :close-on-select="true"

package/vue-components/v3/navbar/Appdrawer.vue

@@ -1,18 +1,21 @@
 <script setup lang="ts">
+import { setCookie } from "tiny-cookie";
 import { computed, defineAsyncComponent, ref } from "vue";
 
 interface Props {
   currentApp: "console" | "db" | "platform" | "billing" | "selfhost" | "learn" | "grafana";
   baseUrl: string;
+  activeOrganization: string;
+  rootDomain: string;
 }
 
 const props = withDefaults(defineProps<Props>(), {
   currentApp: "platform",
   baseUrl: "https://appscode.com",
+  activeOrganization: "",
+  rootDomain: "",
 });
 
-defineEmits(["onClick"]);
-
 const appList = [
   {
     name: "console",
@@ -98,6 +101,11 @@ const filteredAppList = appListWithUrl.filter((element) => {
 
   return true;
 });
+
+const handleClick = (url: string) => {
+  setCookie("gorg", props.activeOrganization, { domain: props.rootDomain });
+  window.open(url, "_blank");
+};
 </script>
 
 <template>
@@ -140,7 +148,7 @@ const filteredAppList = appListWithUrl.filter((element) => {
           <navbar-item-content class="navbar-dropdown-wrapper" style="right: -30px">
             <ul class="ac-scrollbar p-0 app-drawer">
               <li v-for="app in filteredAppList" :key="app.url">
-                <a @click.prevent.stop="$emit('onClick', app.url)">
+                <a @click.prevent.stop="handleClick(app.url)">
                   <article class="media">
                     <figure class="media-left">
                       <p class="image">

package/vue-components/v3/table/table-cell/ArrayCell.vue

@@ -40,9 +40,9 @@ const printableStringObjs = computed(() => {
 
 const indexOfCharacterLengthExceed = computed(() => {
   let idx = -1;
-  let cumulativeLen = 2;
+  let cumulativeLen = 4;
   for (const [index, po] of printableStringObjs.value.entries()) {
-    const newLen = cumulativeLen + po.print.length + 2;
+    const newLen = cumulativeLen + po.print.length + 4;
     if (newLen + 4 > props.maxCharacterLength) {
       idx = index;
       break;

package/vue-components/v3/table/table-cell/ObjectCell.vue

@@ -40,9 +40,9 @@ const printableStringObjs = computed(() => {
 
 const indexOfCharacterLengthExceed = computed(() => {
   let idx = -1;
-  let cumulativeLen = 2;
+  let cumulativeLen = 4;
   for (const [index, po] of printableStringObjs.value.entries()) {
-    const newLen = cumulativeLen + po.print.length + 2;
+    const newLen = cumulativeLen + po.print.length + 4;
     if (newLen + 4 > props.maxCharacterLength) {
       idx = index;
       break;