chore: Added Deprecation Notices for next release

packages/base/src/styling/HSLColor.ts

@@ -1,3 +1,5 @@
+import { deprecationNotice } from '@ui5/webcomponents-react-base/lib/Utils';
+
 export class HSLColor {
   private static HSL_REGEX = /(\d{0,3}\.?\d*?), ?(\d{0,3}\.?\d*?)%?, ?(\d{0,3}\.?\d*?)%?/;
   private static HEX_REGEX = /^#([a-f\d]{1,2})([a-f\d]{1,2})([a-f\d]{1,2})$/i;
@@ -12,6 +14,11 @@ export class HSLColor {
     this.saturation = saturation;
     this.lightness = lightness;
     this.alpha = alpha;
+
+    deprecationNotice(
+      'HSLColor',
+      "'@ui5/webcomponents-react-base/lib/HSLColor' is deprecated and will be removed in the next major release."
+    );
   }
 
   static of(hue: number | string | HSLColor, saturation?: number, lightness?: number, alpha?: number): HSLColor {

packages/base/src/styling/font72.ts

@@ -1,3 +1,10 @@
+import { deprecationNotice } from '@ui5/webcomponents-react-base/lib/Utils';
+
+deprecationNotice(
+  'font72',
+  "The global font face defined in '@ui5/webcomponents-react-base/lib/font72' is deprecated and will be removed in the next major release.\n. This font is now provided the the UI5 Web Components itself."
+);
+
 const font72 = {
   '@font-face': [
     {

packages/base/src/utils/Optional.ts

@@ -1,3 +1,5 @@
+import { deprecationNotice } from '@ui5/webcomponents-react-base/lib/Utils';
+
 /* eslint-disable id-blacklist */
 /**
  * Optionals for Javascript Objects
@@ -17,6 +19,11 @@ class Optional {
   constructor(object: object, path: string) {
     this.object = object;
     this.path = path;
+
+    deprecationNotice(
+      'Optional',
+      "'@ui5/webcomponents-react-base/lib/Optional' is deprecated and will be removed in the next major release.\n. Please use the Optional-Chaining-Operator instead."
+    );
   }
 
   /**

packages/base/src/utils/index.ts

@@ -1,8 +1,7 @@
 export const deprecationNotice = (component: string, message: string) => {
-  const value = `* ui5-webcomponents-react Deprecation Notice - ${component}`;
-  const dots = '*'.padStart(value.length, '*');
+  const value = `*** ui5-webcomponents-react Deprecation Notice - ${component} ***\n`;
   // eslint-disable-next-line no-console
-  console.warn(`${dots}${value}${dots}${message}`);
+  console.warn(`${value}${message}`);
 };
 
 export const getScrollBarWidth = () => {

packages/charts/src/internal/ChartLegend.ts

@@ -1,11 +1,10 @@
 /* eslint-disable no-underscore-dangle */
-import { Optional } from '@ui5/webcomponents-react-base/lib/Optional';
 import '@ui5/webcomponents/dist/Label';
 import { RefObject, useCallback, useEffect } from 'react';
 
 const getSymbolForDataset = (type, dataset) => {
   const datasetMeta: any = dataset.hasOwnProperty('_meta') ? Object.values(dataset._meta)[0] : null;
-  const elementType = Optional.of(datasetMeta, 'type').orElse(type);
+  const elementType = datasetMeta?.type ?? type;
   switch (elementType) {
     case 'line':
       return `