@salesforcedevs/dx-components 1.3.167 → 1.3.170

package/src/modules/dx/typeBadge/typeBadge.ts

@@ -10,19 +10,19 @@ import {
     TypeBadgeSize
 } from "typings/custom";
 import { colorToDxColors, buildStyleColorVariables } from "dxUtils/css";
-import {
-    isContentType,
-    getContentTypeColorScope,
-    getContentTypeColorVariables
-} from "dxUtils/contentTypes";
 import {
     CONTENT_TYPE_LABELS,
     CONTENT_TYPE_ICONS
 } from "dxConstants/contentTypes";
+import {
+    getContentTypeColorScope,
+    isContentType,
+    getContentTypeColorVariables
+} from "dxUtils/contentTypes";
 
 export default class TypeBadge extends LightningElement {
     @api size: TypeBadgeSize = "default";
-    @api variant?: Brand | ContentType = "default";
+    @api variant: Brand | ContentType = "default";
     @api color?: Color;
     @api dark?: false;
 
@@ -103,7 +103,7 @@ export default class TypeBadge extends LightningElement {
         }
         if (this.color) {
             const variables = colorToDxColors(this.color as Color);
-            return buildStyleColorVariables(variables);
+            return buildStyleColorVariables(variables!);
         }
         return "";
     }

package/src/modules/dxBaseElements/matchMediaElement/matchMediaElement.ts

@@ -12,17 +12,19 @@ const BREAKPOINT_QUERY_MOBILE = `${boilerplate}(max-width: ${BREAKPOINT_MOBILE})
 const BREAKPOINT_QUERY_TABLET = `${boilerplate}(min-width: ${BREAKPOINT_MOBILE}) and (max-width: ${BREAKPOINT_TABLET})`;
 const BREAKPOINT_QUERY_DESKTOP = `${boilerplate}(min-width: ${BREAKPOINT_TABLET})`;
 
+type DeviceType =
+    | typeof DEVICE_MOBILE
+    | typeof DEVICE_TABLET
+    | typeof DEVICE_DESKTOP;
+
 const breakpointConfigs = [
     { name: DEVICE_MOBILE, query: BREAKPOINT_QUERY_MOBILE },
     { name: DEVICE_TABLET, query: BREAKPOINT_QUERY_TABLET },
     { name: DEVICE_DESKTOP, query: BREAKPOINT_QUERY_DESKTOP }
-];
+] as { name: DeviceType; query: string }[];
 
 export abstract class MatchMediaElement extends LightningElement {
-    private deviceType:
-        | DEVICE_MOBILE
-        | DEVICE_TABLET
-        | DEVICE_DESKTOP = DEVICE_DESKTOP;
+    private deviceType: DeviceType = DEVICE_DESKTOP;
     private matches: {
         match: MediaQueryList;
         callback: (e: MediaQueryListEvent | MediaQueryList) => void;
@@ -40,7 +42,7 @@ export abstract class MatchMediaElement extends LightningElement {
 
     connectedCallback() {
         this.matches = breakpointConfigs.map(
-            ({ name, query }: { name: string; query: string }) => {
+            ({ name, query }: { name: DeviceType; query: string }) => {
                 const match = window.matchMedia(query);
                 const callback = (e: MediaQueryListEvent | MediaQueryList) => {
                     if (e.matches) {

package/src/modules/dxConstants/brands/brands.ts

@@ -1,3 +1,5 @@
+import { Brand } from "typings/custom";
+
 export const BRANDS = [
     "employees",
     "marketing",
@@ -11,4 +13,4 @@ export const BRANDS = [
     "learning",
     "service",
     "analytics"
-];
+] as Brand[];

package/src/modules/dxConstants/contentTypes/contentTypes.ts

@@ -57,4 +57,4 @@ export const CONTENT_TYPES = [
     "event",
     "website",
     "podcast"
-];
+] as ContentType[];

package/src/modules/dxUtils/contentTypes/contentTypes.ts

@@ -1,10 +1,10 @@
 import { CONTENT_TYPES } from "dxConstants/contentTypes";
 import { BRANDS } from "dxConstants/brands";
-import { ContentType } from "typings/custom";
+import { Brand, ContentType } from "typings/custom";
 import { buildStyleColorVariables } from "dxUtils/css";
 
 export const isBrand = (id: string): boolean => {
-    return BRANDS.includes(id as ContentType);
+    return BRANDS.includes(id as Brand);
 };
 
 export const isContentType = (id: string): boolean => {

package/src/modules/dxUtils/dates/dates.ts

@@ -34,16 +34,22 @@ export function sortSplittedPostsByMonth(postsByMonth: any) {
                 return 1;
             } else if (aYear > bYear) {
                 return -1;
-            } else if (MONTHS[aMonth] < MONTHS[bMonth]) {
+            } else if (
+                MONTHS[aMonth as keyof typeof MONTHS] <
+                MONTHS[bMonth as keyof typeof MONTHS]
+            ) {
                 return 1;
-            } else if (MONTHS[aMonth] > MONTHS[bMonth]) {
+            } else if (
+                MONTHS[aMonth as keyof typeof MONTHS] >
+                MONTHS[bMonth as keyof typeof MONTHS]
+            ) {
                 return -1;
             }
             return 0;
         })
         .forEach((key) => {
             sortedPostsByMonth[key] = [
-                ...postsByMonth[key].sort((a, b) => {
+                ...postsByMonth[key].sort((a: any, b: any) => {
                     const aDate = new Date(a.date);
                     const bDate = new Date(b.date);