@castlabs/ui 7.9.3 → 7.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@castlabs/ui",
-  "version": "7.9.3",
+  "version": "7.10.0",
   "repository": "https://github.com/castlabs/ui-styleguide",
   "private": false,
   "description": "A vanilla HTML/CS/JS & Vue.js component library for Castlabs.",

package/src/components/ClBadge/style.variables.scss

@@ -14,10 +14,6 @@ $badge-min-height: 1.642857143em; // 23px @ 14pt
   @include cl-colors-admin;
   @extend %cl-p-tag;
 
-  #{'--cl-color-background'}: $color-ci-steel;
-  #{'--cl-color-border'}: $color-ci-steel;
-  #{'--cl-color-text'}: $color-ci-eggshell;
-  #{'--cl-color-accent'}: $color-ci-eggshell;
   background-color: var(--cl-color-background);
   border: $brand-line-width solid var(--cl-color-border);
   border-radius: $brand-border-radius;
@@ -37,6 +33,20 @@ $badge-min-height: 1.642857143em; // 23px @ 14pt
     line-height: 0.75;
     margin-right: $spacing-micro;
   }
+
+  &.cl-color-transparent {
+    background-color: transparent;
+    border-color: var(--cl-color-text);
+    color: var(--cl-color-text);
+  }
+
+  &:not([class*='cl-color-']) {
+    // default badge color
+    #{'--cl-color-background'}: $color-ci-steel;
+    #{'--cl-color-border'}: $color-ci-steel;
+    #{'--cl-color-text'}: $color-ci-eggshell;
+    #{'--cl-color-accent'}: $color-ci-eggshell;
+  }
 }
 
 %cl-badge-derived {

package/src/components/navigation/ClNavSide/ClNavDrawer/style.scss

@@ -404,7 +404,8 @@ $sidenav-color-text-minor: $color-ci-ash;
 }
 
 .cl-nav-item-lock,
-.cl-nav-item-locked {
+.cl-nav-item-locked,
+.cl-nav-item-disabled {
   span:first-of-type::after {
     @include cl-fontawesome('\f023');
 
@@ -414,7 +415,8 @@ $sidenav-color-text-minor: $color-ci-ash;
   }
 }
 
-.cl-nav-item-locked {
+.cl-nav-item-locked, // legacy class
+.cl-nav-item-disabled {
   opacity: 0.5;
 
   &:hover {

package/src/styles/assets/logo.scss

@@ -18,7 +18,7 @@ $cl-url-postfix: '' !default;
   height: 1em * 2;
   margin-bottom: -1em;
   position: relative;
-  top: -0.5em;
+  top: -0.4em;
   width: 2.95em * 2;
 }
 
@@ -31,7 +31,7 @@ $cl-url-postfix: '' !default;
   height: 1em * 2;
   margin-bottom: -1em;
   position: relative;
-  top: -0.5em;
+  top: -0.4em;
   width: 2.95em * 2;
 }
 

package/src/styles/layout/meta.scss

@@ -1,3 +1,3 @@
 :root {
-  #{'--cl-version'}: 'v7.9.3';
+  #{'--cl-version'}: 'v7.10.0';
 }

package/types/index.d.ts

@@ -1,5 +1,8 @@
 import type { App, DefineComponent } from 'vue'
 
+import * as CONST from '../src/utils/const'
+import * as CS from '../src/utils/cs'
+
 declare function install (Vue: App): void
 export default install
 
@@ -150,6 +153,7 @@ export type ClService = {
   subtitle: string
   title: string
   urlManage: (env?: string, oid?: string) => string
+  urlPlan: (env?: string, oid?: string) => string
   sidenav: boolean
 }
 export function clGetServices (): ClService[]
@@ -165,9 +169,87 @@ export const NAV: {
   VTK: ClService
 }
 
-// --- utils/const ----------------------------------------------------------------
+// --- Central Services -----------------------------------------------------------
+
+export type CsLicense = {
+  approval_date: string | null
+  created: string // ISO date
+  display_name: string
+  expires: string | null // ISO date
+  license_urn: string
+  plan: number | null
+  service: string
+  status: number
+  updated: string // ISO date
+  // attachments: object // not typed yet
+}
+
+export type CsRole = {
+  display_name: string
+  role_urn: string
+  // attachments: object // not typed yet
+  // organization: not typed yet
+}
+
+export type CsOrganization = {
+  display_name: string
+  legacy_name?: string
+  licenses: CsLicense[]
+  members_count?: number
+  organization_urn: string
+  parent: string | null // urn
+  parent_display_name: string | null
+  suborgs_count?: number
+}
+
+export type CsMembership = {
+  display_name: string
+  membership_urn: string
+  organization: CsOrganization
+  roles: CsRole[]
+  status: number
+  // user_urn: string // not typed/used as duplicate
+}
+
+export type CsUserDetail = {
+  company: string
+  email: string
+  hubspot_contact_id?: string
+  machine_account?: boolean
+  name: string
+}
+
+export type CsUserinfo = {
+  active: boolean
+  email_verified: boolean
+  groups: string[]
+  memberships: CsMembership[]
+  mfa_enabled: boolean | null
+  profile: CsUserDetail
+  user_urn: string
+  // user_data: object | null // not typed yet
+}
 
-export const CONST: {
-  COLOR: Record<string, string>
-  SPACING: Record<string, string>
+type ClSidenavEntry = {
+  id: string
+  title: string
+  subtitle: string | undefined
+  badge: string | undefined
+  url: string | undefined
+  locked: boolean
+  disabled: boolean
 }
+
+export function csGetNav (
+  memberships: CsMembership[],
+  oid: string,
+  env: string
+): ClSidenavEntry[]
+
+export function csFilterMemberships (memberships: CsMembership[], rid?: string, sid?: string): CsMembership[]
+export function csGetAccountUrl(env: string): string
+
+// --- consts ----------------------------------------------------------------
+
+export const CONST
+export const CS