From 681659b843a80e2b6fc85fee23740c01eda7b9dd Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:28:06 +0100
Subject: [PATCH 01/32] accordian props with default value as optional

---
 packages/components/src/components/accordion/accordion.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/accordion/accordion.tsx b/packages/components/src/components/accordion/accordion.tsx
index 899440d9d4..eeb4b57621 100644
--- a/packages/components/src/components/accordion/accordion.tsx
+++ b/packages/components/src/components/accordion/accordion.tsx
@@ -28,11 +28,11 @@ export class Accordion {
   /** (optional) Injected CSS styles */
   @Prop() styles?: string;
   /** If `true`, only one scale-collapsible within the accordion can be open at a time */
-  @Prop() dependent: boolean = false;
+  @Prop() dependent?: boolean = false;
   /** If `true`, scale-collapsibles within the accordion will all be open initially, unless this is dependant */
-  @Prop() expanded: boolean = false;
+  @Prop() expanded?: boolean = false;
   /** Heading level for scale-collapsible descendants */
-  @Prop() headingLevel: number | null = null;
+  @Prop() headingLevel?: number | null = null;
 
   /**
    * Handle `dependent`

From 69dcf6a8ea84731a900d0f6dfd3b8dd2ef86ae3a Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:28:35 +0100
Subject: [PATCH 02/32] collapsible props with default value as optional

---
 packages/components/src/components/collapsible/collapsible.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/collapsible/collapsible.tsx b/packages/components/src/components/collapsible/collapsible.tsx
index 6e2484af66..d25ca45765 100644
--- a/packages/components/src/components/collapsible/collapsible.tsx
+++ b/packages/components/src/components/collapsible/collapsible.tsx
@@ -42,7 +42,7 @@ export class Collapsible {
   /** Set to `true` to expand */
   @Prop({ mutable: true, reflect: true }) expanded: boolean;
   /** Default aria-level for heading */
-  @Prop() headingLevel: number = 2;
+  @Prop() headingLevel?: number = 2;
   /** (optional) Injected CSS styles */
   @Prop() styles?: string;
 

From 9f6450cd86b8e80af074513cbf5b910d22030c1f Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:30:48 +0100
Subject: [PATCH 03/32] data-grid props with default value as optional

---
 packages/components/src/components/data-grid/data-grid.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/data-grid/data-grid.tsx b/packages/components/src/components/data-grid/data-grid.tsx
index d5c16bf9ee..11c40c22ce 100644
--- a/packages/components/src/components/data-grid/data-grid.tsx
+++ b/packages/components/src/components/data-grid/data-grid.tsx
@@ -100,7 +100,7 @@ export class DataGrid {
   /** (optional) Set to true to add selection column */
   @Prop() selectable?: boolean = false;
   /** Read-only selection array - populated with raw data from selected rows */
-  @Prop() selection: string[] = [];
+  @Prop() selection?: string[] = [];
   /** (optional) Shade every second row darker */
   @Prop() shadeAlternate?: boolean = true;
   /** (optional) Injected css styles */

From 1a9662fb4f841491bd1d00c59dd8594069eab933 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:32:18 +0100
Subject: [PATCH 04/32] data-picker props with default value as optional

---
 .../src/components/date-picker/date-picker.tsx     | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/packages/components/src/components/date-picker/date-picker.tsx b/packages/components/src/components/date-picker/date-picker.tsx
index 03b84629b3..05b9ebe879 100644
--- a/packages/components/src/components/date-picker/date-picker.tsx
+++ b/packages/components/src/components/date-picker/date-picker.tsx
@@ -56,10 +56,10 @@ export class DatePicker {
   /**
    * Name of the date picker input.
    */
-  @Prop() name: string = 'date';
+  @Prop() name?: string = 'date';
 
   /** @deprecated in v3 in favor of localization.calendarHeading */
-  @Prop() popupTitle: string = 'Pick a date';
+  @Prop() popupTitle?: string = 'Pick a date';
 
   /**
    * Adds a unique identifier for the date picker input. Use this instead of html `id` attribute.
@@ -82,12 +82,12 @@ export class DatePicker {
    * This setting can be useful when the input is smaller than the opening date picker
    * would be as by default the picker always opens towards right.
    */
-  @Prop() direction: DuetDatePickerDirection = 'right';
+  @Prop() direction?: DuetDatePickerDirection = 'right';
 
   /**
    * Should the input be marked as required?
    */
-  @Prop() required: boolean = false;
+  @Prop() required?: boolean = false;
 
   /**
    * Date value. Must be in IS0-8601 format: YYYY-MM-DD.
@@ -98,13 +98,13 @@ export class DatePicker {
    * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
    * This setting can be used alone or together with the max property.
    */
-  @Prop() min: string = '';
+  @Prop() min?: string = '';
 
   /**
    * Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.
    * This setting can be used alone or together with the min property.
    */
-  @Prop() max: string = '';
+  @Prop() max?: string = '';
 
   /**
    * Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.
@@ -138,7 +138,7 @@ export class DatePicker {
   @Prop() invalid?: boolean;
 
   /** (optional) Label */
-  @Prop() label: string = '';
+  @Prop() label?: string = '';
 
   /** (optional) Size */
   @Prop() size?: string = '';

From 98f5fbcbf034173d15a25e07f0ff1ff618858105 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:32:47 +0100
Subject: [PATCH 05/32] list-item props with default value as optional

---
 packages/components/src/components/list-item/list-item.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/list-item/list-item.tsx b/packages/components/src/components/list-item/list-item.tsx
index cccbf47ea1..cebee18573 100644
--- a/packages/components/src/components/list-item/list-item.tsx
+++ b/packages/components/src/components/list-item/list-item.tsx
@@ -30,7 +30,7 @@ export class ListItem {
   /** Index number, useful only for styling the `ordered` type */
   @Prop({ mutable: true }) index?: number;
   /** If `false`, no marker or left padding will be visible */
-  @Prop() marker: boolean = true;
+  @Prop() marker?: boolean = true;
   /** (optional) Injected CSS styles */
   @Prop() styles?: string;
 

From 14d972a890f7b0e173c104ee9e40a3cabb746ca7 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:33:21 +0100
Subject: [PATCH 06/32] app-logo props with default value as optional

---
 .../components/src/components/telekom/app-logo/app-logo.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/telekom/app-logo/app-logo.tsx b/packages/components/src/components/telekom/app-logo/app-logo.tsx
index 6c6c638372..8f6fff4fff 100644
--- a/packages/components/src/components/telekom/app-logo/app-logo.tsx
+++ b/packages/components/src/components/telekom/app-logo/app-logo.tsx
@@ -18,10 +18,10 @@ import { Component, h, Prop } from '@stencil/core';
 export class Logo {
   @Prop() href?: string = 'javascript:void(0);';
   @Prop() logoTitle?: string = 'Telekom Logo';
-  @Prop() color: string = '#fff';
-  @Prop() claim: boolean = false;
+  @Prop() color?: string = '#fff';
+  @Prop() claim?: boolean = false;
   @Prop() claimLang: string;
-  @Prop() focusable: boolean = true;
+  @Prop() focusable?: boolean = true;
 
   render() {
     if (!this.claim) {

From e97dfff1633a22b7f3132195ac00aad4ced59188 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:36:42 +0100
Subject: [PATCH 07/32] sidebar-nav-collapsible props as optional

---
 .../sidebar-nav-collapsible/sidebar-nav-collapsible.tsx   | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/components/sidebar-nav-collapsible/sidebar-nav-collapsible.tsx b/packages/components/src/components/sidebar-nav-collapsible/sidebar-nav-collapsible.tsx
index 9289f69438..45950f7d85 100644
--- a/packages/components/src/components/sidebar-nav-collapsible/sidebar-nav-collapsible.tsx
+++ b/packages/components/src/components/sidebar-nav-collapsible/sidebar-nav-collapsible.tsx
@@ -25,17 +25,17 @@ export class SidebarNavCollapsible {
   /** The text for the button */
   @Prop() label: string;
   /** The URL where the link should point to */
-  @Prop() href: string = '#';
+  @Prop() href?: string = '#';
   /** Set this to `true` to expand */
   @Prop({ mutable: true, reflect: true }) expanded: boolean;
   /** Label and icon get the active color */
   @Prop() active?: boolean = false;
   /** Bold label and icon */
-  @Prop() bold: boolean = false;
+  @Prop() bold?: boolean = false;
   /** Used normally for third level items */
-  @Prop() condensed: boolean = false;
+  @Prop() condensed?: boolean = false;
   /** Nesting level within the <scale-sidebar-nav> parent, gets set automatically */
-  @Prop() nestingLevel: number;
+  @Prop() nestingLevel?: number;
   /** (optional) Extra styles */
   @Prop() styles?: string;
 

From 75aecfdcd99f103e4304e4915da82c369a5613e5 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:37:24 +0100
Subject: [PATCH 08/32] sidebar-nav-item props change

---
 .../src/components/sidebar-nav-item/sidebar-nav-item.tsx    | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/sidebar-nav-item/sidebar-nav-item.tsx b/packages/components/src/components/sidebar-nav-item/sidebar-nav-item.tsx
index dce839e3de..a4ebd5db60 100644
--- a/packages/components/src/components/sidebar-nav-item/sidebar-nav-item.tsx
+++ b/packages/components/src/components/sidebar-nav-item/sidebar-nav-item.tsx
@@ -49,16 +49,16 @@ export class SidebarNavItem {
   @Element() el: HTMLElement;
 
   /** Used normally for third level items, remove the bottom border */
-  @Prop() condensed: boolean = false;
+  @Prop() condensed?: boolean = false;
   /** Bold text */
-  @Prop() bold: boolean = false;
+  @Prop() bold?: boolean = false;
   /** Text gets the active color */
   @Prop({ mutable: true, reflect: true }) active: boolean = false;
   /**
    * Mark the child link as "current" with `aria-current=page`.
    * Provide the text hint if needed, default is: "Zurzeit aktiv"
    */
-  @Prop() current: string | null | boolean = null;
+  @Prop() current?: string | null | boolean = null;
   /** Nesting level within the <scale-sidebar-nav> parent, gets set automatically */
   @Prop() nestingLevel: number;
   /** (optional) Extra styles */

From 3da6ec2888bbd90a6aa79db4218065b852f0c54e Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:38:19 +0100
Subject: [PATCH 09/32] notification badge props as optional

---
 .../src/components/notification-badge/notification-badge.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/notification-badge/notification-badge.tsx b/packages/components/src/components/notification-badge/notification-badge.tsx
index 42e1cb99ca..4785378cd9 100644
--- a/packages/components/src/components/notification-badge/notification-badge.tsx
+++ b/packages/components/src/components/notification-badge/notification-badge.tsx
@@ -23,7 +23,7 @@ export class NotificationBadge {
   /** (optional) Text that is displayed in the badge */
   @Prop() label: number;
   /** (optional) Maximal number of characters displayed in the badge */
-  @Prop() maxCharacters: number = 3;
+  @Prop() maxCharacters?: number = 3;
   /** (optional) Setting/Slotcontent in which the badge is used */
   @Prop() type: 'icon' | 'text' | 'nav-icon' = 'icon';
   /** (optional) Handle click on the badge and surroundet slot elements */

From b577459f7e97e17d6a88bddc8b5652882709f1f4 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:38:53 +0100
Subject: [PATCH 10/32] progress-bar props with default value as optional

---
 .../components/src/components/progress-bar/progress-bar.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/progress-bar/progress-bar.tsx b/packages/components/src/components/progress-bar/progress-bar.tsx
index a7973fda15..d7d1f95066 100644
--- a/packages/components/src/components/progress-bar/progress-bar.tsx
+++ b/packages/components/src/components/progress-bar/progress-bar.tsx
@@ -25,7 +25,7 @@ export class ProgressBar {
   /** (optional) Progress bar busy switch */
   @Prop() busy?: boolean = false;
   /** (required) Progress bar percentage */
-  @Prop() percentage: number = 0;
+  @Prop() percentage?: number = 0;
   /** @deprecated - (optional) Progress bar customColor */
   @Prop() customColor?: string;
   /** (optional) Progress bar stroke width */

From 10df797570a63d9511564112ebe5a0552fc9668f Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:39:16 +0100
Subject: [PATCH 11/32] pagination props with default value as optional

---
 packages/components/src/components/pagination/pagination.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/pagination/pagination.tsx b/packages/components/src/components/pagination/pagination.tsx
index 626a2fdcfa..e64dda13d7 100644
--- a/packages/components/src/components/pagination/pagination.tsx
+++ b/packages/components/src/components/pagination/pagination.tsx
@@ -61,7 +61,7 @@ export class Pagination {
   /** (optional) Injected styles */
   @Prop() styles?: string;
   /** @deprecated - size should replace small */
-  @Prop() small: boolean = false;
+  @Prop() small?: boolean = false;
   /** (optional) size  */
   @Prop() size: 'small' | 'large' = 'large';
   /** (optional) translation to 'Go to first page'  */

From 2e8bebe986b06da6305b1c400df2b2e3abc0ef46 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:39:44 +0100
Subject: [PATCH 12/32] tab-header props with default value as optional

---
 packages/components/src/components/tab-header/tab-header.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/tab-header/tab-header.tsx b/packages/components/src/components/tab-header/tab-header.tsx
index d032ecba6c..8dd71e55d7 100644
--- a/packages/components/src/components/tab-header/tab-header.tsx
+++ b/packages/components/src/components/tab-header/tab-header.tsx
@@ -34,7 +34,7 @@ export class TabHeader {
   @Prop() disabled?: boolean = false;
   /** True for smaller height and font size */
   // DEPRECATED - size should replace small
-  @Prop() small: boolean = false;
+  @Prop() small?: boolean = false;
   /** (optional) size  */
   @Prop() size: 'small' | 'large' = 'large';
   /** (optional) Injected CSS styles */

From fea3422c470d6e2fd91c675454fd1df8fed15606 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:40:13 +0100
Subject: [PATCH 13/32] tab-nav props with default value as optional

---
 packages/components/src/components/tab-nav/tab-nav.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/tab-nav/tab-nav.tsx b/packages/components/src/components/tab-nav/tab-nav.tsx
index 06a212037f..e8b7d76304 100644
--- a/packages/components/src/components/tab-nav/tab-nav.tsx
+++ b/packages/components/src/components/tab-nav/tab-nav.tsx
@@ -40,7 +40,7 @@ export class TabNav {
 
   /** True for smaller height and font size in tab headers. */
   /** @deprecated - size should replace small */
-  @Prop() small: boolean = false;
+  @Prop() small?: boolean = false;
   /** (optional) size  */
   @Prop() size: 'small' | 'large' = 'large';
   /** (optional) Injected CSS styles */

From 947183f4479400a5586ce2445757eff74a89ead4 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:40:38 +0100
Subject: [PATCH 14/32] tab-panel props with default value as optional

---
 packages/components/src/components/tab-panel/tab-panel.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/tab-panel/tab-panel.tsx b/packages/components/src/components/tab-panel/tab-panel.tsx
index ae8afa429a..950d046861 100644
--- a/packages/components/src/components/tab-panel/tab-panel.tsx
+++ b/packages/components/src/components/tab-panel/tab-panel.tsx
@@ -26,7 +26,7 @@ export class TabPanel {
   @Element() el: HTMLElement;
   /** True for smaller height and font size */
   // DEPRECATED - size should replace small
-  @Prop() small: boolean = false;
+  @Prop() small?: boolean = false;
   /** (optional) size  */
   @Prop() size: 'small' | 'large' = 'large';
   /** (optional) Injected CSS styles */

From 5fc9e1176d192b1804395674b2c9ab669bfb16f8 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:41:17 +0100
Subject: [PATCH 15/32] logo props with default value as optional

---
 packages/components/src/components/telekom/logo/logo.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/components/telekom/logo/logo.tsx b/packages/components/src/components/telekom/logo/logo.tsx
index ada4011b00..28aa5f6bd0 100644
--- a/packages/components/src/components/telekom/logo/logo.tsx
+++ b/packages/components/src/components/telekom/logo/logo.tsx
@@ -20,9 +20,9 @@ import classNames from 'classnames';
 export class Logo {
   @Element() hostElement: HTMLElement;
   /** (optional) Variant/color of the logo text and logo */
-  @Prop() variant: 'magenta' | 'white' = 'magenta';
+  @Prop() variant?: 'magenta' | 'white' = 'magenta';
   /** (optional) Set transparent background */
-  @Prop() transparent: boolean = false;
+  @Prop() transparent?: boolean = false;
   /** (optional) Language of the logo text/ claimOff showes just the T Logo */
   @Prop() language:
     | 'de'
@@ -37,9 +37,9 @@ export class Logo {
     | 'sk'
     | '' = 'en';
   /** (optional) The height in pixels */
-  @Prop() size: number = 36;
+  @Prop() size?: number = 36;
   /** (optional) Set a link */
-  @Prop() href: string = '';
+  @Prop() href?: string = '';
   /** (optional) Possibility for adding a onClick Event */
   @Prop() clickHandler: any;
   /** (optional) When using the icon standalone, make it meaningful for accessibility */

From 665b1dc3830c21e50a17cd8ea1aa50466e03c007 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:41:46 +0100
Subject: [PATCH 16/32] toggle-group props with default value as optional

---
 .../components/src/components/toggle-group/toggle-group.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/toggle-group/toggle-group.tsx b/packages/components/src/components/toggle-group/toggle-group.tsx
index f94e3d50e6..604b311230 100644
--- a/packages/components/src/components/toggle-group/toggle-group.tsx
+++ b/packages/components/src/components/toggle-group/toggle-group.tsx
@@ -55,7 +55,7 @@ export class ToggleGroup {
   /** (optional) If `true`, the group has a border */
   @Prop() hideBorder?: boolean = false;
   /** (optional) more than one button selected possible */
-  @Prop() singleSelect: boolean = false;
+  @Prop() singleSelect?: boolean = false;
   /** (optional) aria-label attribute needed for icon-only buttons */
   @Prop()
   ariaLabelTranslation = `toggle button group with $slottedButtons buttons`;

From 67400d2ae389a45f73a5a1764b75e24d4607a300 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:42:12 +0100
Subject: [PATCH 17/32] tooltip props with default value as optional

---
 packages/components/src/components/tooltip/tooltip.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/tooltip/tooltip.tsx b/packages/components/src/components/tooltip/tooltip.tsx
index 690b005d79..4baa344846 100644
--- a/packages/components/src/components/tooltip/tooltip.tsx
+++ b/packages/components/src/components/tooltip/tooltip.tsx
@@ -66,11 +66,11 @@ export class Tooltip {
    */
   @Prop() skidding = 0;
   /** (optional) Set custom trigger Event selection */
-  @Prop() trigger: string = 'hover focus';
+  @Prop() trigger?: string = 'hover focus';
   /** (optional) Switching the flip option of the tooltip on and off */
-  @Prop() flip: boolean = true;
+  @Prop() flip?: boolean = true;
   /** (optional) Switching the preventOverflow option of the tooltip on and off */
-  @Prop() preventOverflow: boolean = false;
+  @Prop() preventOverflow?: boolean = false;
   @State() mouseOverTooltip: boolean = false;
 
   @Event({ eventName: 'scale-before-show' }) tooltipBeforeShow: EventEmitter;

From bd9448a83fe70a0b8b5385009571aa57be5f490a Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:45:19 +0100
Subject: [PATCH 18/32] menu-flyout prop change and added type

---
 packages/components/src/components/menu-flyout/menu-flyout.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/menu-flyout/menu-flyout.tsx b/packages/components/src/components/menu-flyout/menu-flyout.tsx
index 2ec0c700e2..6beced394e 100644
--- a/packages/components/src/components/menu-flyout/menu-flyout.tsx
+++ b/packages/components/src/components/menu-flyout/menu-flyout.tsx
@@ -33,7 +33,7 @@ export class MenuFlyout {
   @Element() hostElement: HTMLElement;
 
   /** (optional) Determines whether the flyout should close when a menu item is selected */
-  @Prop() closeOnSelect = true;
+  @Prop() closeOnSelect?: boolean = true;
   /** (optional) Set preference for where the menu appears, space permitting */
   @Prop() direction:
     | 'bottom-right'

From 80cbc39c00ddb2139b29c916742c2c931ad7b799 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:46:05 +0100
Subject: [PATCH 19/32] menu-flyout-list propchange and type add

---
 .../src/components/menu-flyout-list/menu-flyout-list.tsx        | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/menu-flyout-list/menu-flyout-list.tsx b/packages/components/src/components/menu-flyout-list/menu-flyout-list.tsx
index f46e5e77a0..bc943cc7b9 100644
--- a/packages/components/src/components/menu-flyout-list/menu-flyout-list.tsx
+++ b/packages/components/src/components/menu-flyout-list/menu-flyout-list.tsx
@@ -54,7 +54,7 @@ export class MenuFlyoutList {
   /**  */
   @Prop({ reflect: true, mutable: true }) active: boolean = false;
   /** (optional) Determines whether the flyout should close when a menu item is selected */
-  @Prop() closeOnSelect = true;
+  @Prop() closeOnSelect?: boolean = true;
   /** (optional) Injected styles */
   @Prop() styles?: string;
 

From 25d38e1f5260f3f54fb483efab81d002d085dd39 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:46:35 +0100
Subject: [PATCH 20/32] pagination prop change and added type

---
 .../components/src/components/pagination/pagination.tsx   | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/components/src/components/pagination/pagination.tsx b/packages/components/src/components/pagination/pagination.tsx
index e64dda13d7..3652edbdd3 100644
--- a/packages/components/src/components/pagination/pagination.tsx
+++ b/packages/components/src/components/pagination/pagination.tsx
@@ -65,13 +65,13 @@ export class Pagination {
   /** (optional) size  */
   @Prop() size: 'small' | 'large' = 'large';
   /** (optional) translation to 'Go to first page'  */
-  @Prop() ariaLabelFirstPage = 'Go to first page';
+  @Prop() ariaLabelFirstPage?: string = 'Go to first page';
   /** (optional) translation to 'Go to next page'  */
-  @Prop() ariaLabelNextPage = 'Go to next page';
+  @Prop() ariaLabelNextPage?: string = 'Go to next page';
   /** (optional) translation to 'Go to previous page'  */
-  @Prop() ariaLabelPreviousPage = 'Go to previous page';
+  @Prop() ariaLabelPreviousPage?: string = 'Go to previous page';
   /** (optional) translation to 'Go to last page'  */
-  @Prop() ariaLabelLastPage = 'Go to last page';
+  @Prop() ariaLabelLastPage?: string = 'Go to last page';
 
   /* 4. Events (alphabetical) */
   /** Event triggered every time the data is edited, changing original rows data */

From 837afdd343c861834c712139ae83363bf7fd7419 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:47:12 +0100
Subject: [PATCH 21/32] rating stars added optional flag and prop types

---
 .../components/src/components/rating-stars/rating-stars.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/rating-stars/rating-stars.tsx b/packages/components/src/components/rating-stars/rating-stars.tsx
index c33a18a381..751dc57945 100644
--- a/packages/components/src/components/rating-stars/rating-stars.tsx
+++ b/packages/components/src/components/rating-stars/rating-stars.tsx
@@ -48,9 +48,9 @@ export class RatingStars {
   /** size of the stars  */
   @Prop({ reflect: true, mutable: true }) size: 'small' | 'large' = 'large';
   /** @deprecated; The lower limit of the rating */
-  @Prop() minRating = 0;
+  @Prop() minRating?: number = 0;
   /** @deprecated; max should be used instead of maxRating */
-  @Prop() maxRating = 5;
+  @Prop() maxRating?: number = 5;
   /** The upper limit of the rating */
   @Prop({ reflect: true, mutable: true }) max = 5;
   /** Represents the current value of the rating */
@@ -60,7 +60,7 @@ export class RatingStars {
   /** disables input  */
   @Prop({ reflect: true }) disabled = false;
   /** a11y text for getting meaningful value. `$rating` and `$max` (deprecated `$maxRating`) are template variables and will be replaces by their corresponding properties.  */
-  @Prop() ariaLabelTranslation = '$rating out of $max stars';
+  @Prop() ariaLabelTranslation?:string = '$rating out of $max stars';
   /** (optional) rating label */
   @Prop({ reflect: true }) label = 'Rating';
   /** (optional) info text */

From 8593631d9ee3f5da506d37babf4f6a049c230024 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:48:33 +0100
Subject: [PATCH 22/32] toggle-button added optional flag and prop type

---
 .../components/src/components/toggle-button/toggle-button.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/toggle-button/toggle-button.tsx b/packages/components/src/components/toggle-button/toggle-button.tsx
index 99f7784f90..8f2f43a2df 100644
--- a/packages/components/src/components/toggle-button/toggle-button.tsx
+++ b/packages/components/src/components/toggle-button/toggle-button.tsx
@@ -71,7 +71,7 @@ export class ToggleButton {
   /** (optional) translation of 'deselected */
   @Prop() ariaLangDeselected? = 'deselected';
   /** a11y text for getting meaningful value. `$buttonNumber` and `$selected` are template variables and will be replaces by their corresponding properties.  */
-  @Prop() ariaDescriptionTranslation = '$selected';
+  @Prop() ariaDescriptionTranslation?: string = '$selected';
   /** Emitted when button is clicked */
   @Event({ eventName: 'scale-click' }) scaleClick!: EventEmitter<{
     id: string;

From 7d821816cd04800a3cba8ec668eb9a4034741142 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:49:31 +0100
Subject: [PATCH 23/32] tooltip props as optional and added proptype

---
 packages/components/src/components/tooltip/tooltip.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/tooltip/tooltip.tsx b/packages/components/src/components/tooltip/tooltip.tsx
index 4baa344846..9aa95758c2 100644
--- a/packages/components/src/components/tooltip/tooltip.tsx
+++ b/packages/components/src/components/tooltip/tooltip.tsx
@@ -40,7 +40,7 @@ export class Tooltip {
 
   @Element() host: HTMLElement;
   /** (optional) The content of the Tooltip supporting Text only */
-  @Prop() content = '';
+  @Prop() content?: string = '';
   /** (optional) Position of the Tooltip on the Object */
   @Prop() placement:
     | 'top'
@@ -56,9 +56,9 @@ export class Tooltip {
     | 'left-start'
     | 'left-end' = 'top';
   /** (optional) Disable Tooltip */
-  @Prop() disabled = false;
+  @Prop() disabled?:boolean = false;
   /** (optional) Distance of the Tooltip from the Target Object (related to the `placement`) */
-  @Prop() distance = 5;
+  @Prop() distance?:number = 5;
   /** (optional) Set the Tooltip to open per default (will still be closed on closing Events) */
   @Prop({ mutable: true, reflect: true }) open = false;
   /** (optional) skidding moves the tooltip of the element in dependence of its `placement` to the element either

From e5501fd38ccd853f7a5e4892e01b54b5412faf76 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:50:27 +0100
Subject: [PATCH 24/32] nav-icon-badge as optional prop

---
 .../components/src/components/telekom/nav-icon/nav-icon.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/telekom/nav-icon/nav-icon.tsx b/packages/components/src/components/telekom/nav-icon/nav-icon.tsx
index 306f8c5a1a..efaf3483d2 100644
--- a/packages/components/src/components/telekom/nav-icon/nav-icon.tsx
+++ b/packages/components/src/components/telekom/nav-icon/nav-icon.tsx
@@ -34,7 +34,7 @@ export class NavIcon {
   @Prop() refMobileMenuToggle?: any;
   @Prop() refMobileUserMenuToggle?: any;
   @Prop() refUserMenuToggle?: any;
-  @Prop() badge: boolean = false;
+  @Prop() badge?: boolean = false;
   @Prop() badgeLabel: number;
 
   componentWillRender() {

From 538a83360050abff7b67de2957b674cfbd0b52f0 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 12:59:14 +0100
Subject: [PATCH 25/32] loading-spinner props as optional with default val

---
 .../src/components/loading-spinner/loading-spinner.tsx      | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/components/loading-spinner/loading-spinner.tsx b/packages/components/src/components/loading-spinner/loading-spinner.tsx
index c1e062bc4a..e02e0f299a 100644
--- a/packages/components/src/components/loading-spinner/loading-spinner.tsx
+++ b/packages/components/src/components/loading-spinner/loading-spinner.tsx
@@ -9,10 +9,10 @@ let i = 0;
   shadow: true,
 })
 export class LoadingSpinner {
-  @Prop() variant: 'white' | 'primary' = 'primary';
-  @Prop() alignment: 'horizontal' | 'vertical' = 'horizontal';
+  @Prop() variant?: 'white' | 'primary' = 'primary';
+  @Prop() alignment?: 'horizontal' | 'vertical' = 'horizontal';
   @Prop() text: string;
-  @Prop() size: 'small' | 'large' = 'small';
+  @Prop() size?: 'small' | 'large' = 'small';
 
   componentWillLoad() {
     i++;

From 7383f53bb317f197edfbcad1a18a44fa55e6c7b1 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:00:08 +0100
Subject: [PATCH 26/32] notifcationBadge prop as optional with default val

---
 .../src/components/notification-badge/notification-badge.tsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/notification-badge/notification-badge.tsx b/packages/components/src/components/notification-badge/notification-badge.tsx
index 4785378cd9..6b41fa4a9f 100644
--- a/packages/components/src/components/notification-badge/notification-badge.tsx
+++ b/packages/components/src/components/notification-badge/notification-badge.tsx
@@ -25,7 +25,7 @@ export class NotificationBadge {
   /** (optional) Maximal number of characters displayed in the badge */
   @Prop() maxCharacters?: number = 3;
   /** (optional) Setting/Slotcontent in which the badge is used */
-  @Prop() type: 'icon' | 'text' | 'nav-icon' = 'icon';
+  @Prop() type?: 'icon' | 'text' | 'nav-icon' = 'icon';
   /** (optional) Handle click on the badge and surroundet slot elements */
   @Prop() clickHandler: any;
 

From a61e9707ab0b2d917d349f1593a09d007371423d Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:00:41 +0100
Subject: [PATCH 27/32] pagination prop as optional with default val

---
 packages/components/src/components/pagination/pagination.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/pagination/pagination.tsx b/packages/components/src/components/pagination/pagination.tsx
index 3652edbdd3..14f03742d7 100644
--- a/packages/components/src/components/pagination/pagination.tsx
+++ b/packages/components/src/components/pagination/pagination.tsx
@@ -63,7 +63,7 @@ export class Pagination {
   /** @deprecated - size should replace small */
   @Prop() small?: boolean = false;
   /** (optional) size  */
-  @Prop() size: 'small' | 'large' = 'large';
+  @Prop() size?: 'small' | 'large' = 'large';
   /** (optional) translation to 'Go to first page'  */
   @Prop() ariaLabelFirstPage?: string = 'Go to first page';
   /** (optional) translation to 'Go to next page'  */

From 962cc1a83fdf194bd297b8b970c0772ba5c7f19f Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:01:04 +0100
Subject: [PATCH 28/32] ratingStars prop with default val as optional

---
 .../components/src/components/rating-stars/rating-stars.tsx     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/rating-stars/rating-stars.tsx b/packages/components/src/components/rating-stars/rating-stars.tsx
index 751dc57945..ffaddcb76e 100644
--- a/packages/components/src/components/rating-stars/rating-stars.tsx
+++ b/packages/components/src/components/rating-stars/rating-stars.tsx
@@ -44,7 +44,7 @@ export class RatingStars {
   ratingStarId = `scale-rating-star-${ratingStarCount++}`;
 
   /** @deprecated; size should be used instead of starSize */
-  @Prop() starSize: 'small' | 'large' = 'large';
+  @Prop() starSize?: 'small' | 'large' = 'large';
   /** size of the stars  */
   @Prop({ reflect: true, mutable: true }) size: 'small' | 'large' = 'large';
   /** @deprecated; The lower limit of the rating */

From fca5db956308d63613988b7ff51086db03fee85a Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:01:37 +0100
Subject: [PATCH 29/32] tab header prop as default with default val

---
 packages/components/src/components/tab-header/tab-header.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/tab-header/tab-header.tsx b/packages/components/src/components/tab-header/tab-header.tsx
index 8dd71e55d7..5b276cff23 100644
--- a/packages/components/src/components/tab-header/tab-header.tsx
+++ b/packages/components/src/components/tab-header/tab-header.tsx
@@ -36,7 +36,7 @@ export class TabHeader {
   // DEPRECATED - size should replace small
   @Prop() small?: boolean = false;
   /** (optional) size  */
-  @Prop() size: 'small' | 'large' = 'large';
+  @Prop() size?: 'small' | 'large' = 'large';
   /** (optional) Injected CSS styles */
   @Prop() styles?: string;
   @Prop() selected: boolean;

From 36d45cbc4b1ea70f0470c45abfa041e8a4b2880a Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:01:58 +0100
Subject: [PATCH 30/32] tabNav with default prop as optional

---
 packages/components/src/components/tab-nav/tab-nav.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/tab-nav/tab-nav.tsx b/packages/components/src/components/tab-nav/tab-nav.tsx
index e8b7d76304..73fe5a3da9 100644
--- a/packages/components/src/components/tab-nav/tab-nav.tsx
+++ b/packages/components/src/components/tab-nav/tab-nav.tsx
@@ -42,7 +42,7 @@ export class TabNav {
   /** @deprecated - size should replace small */
   @Prop() small?: boolean = false;
   /** (optional) size  */
-  @Prop() size: 'small' | 'large' = 'large';
+  @Prop() size?: 'small' | 'large' = 'large';
   /** (optional) Injected CSS styles */
   @Prop() styles?: string;
 

From f2e9b60e51dcaca03aead512fb31a4abf0eafbd5 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:02:26 +0100
Subject: [PATCH 31/32] tabPanel prop with default val as optional

---
 packages/components/src/components/tab-panel/tab-panel.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/tab-panel/tab-panel.tsx b/packages/components/src/components/tab-panel/tab-panel.tsx
index 950d046861..129da0dffa 100644
--- a/packages/components/src/components/tab-panel/tab-panel.tsx
+++ b/packages/components/src/components/tab-panel/tab-panel.tsx
@@ -28,7 +28,7 @@ export class TabPanel {
   // DEPRECATED - size should replace small
   @Prop() small?: boolean = false;
   /** (optional) size  */
-  @Prop() size: 'small' | 'large' = 'large';
+  @Prop() size?: 'small' | 'large' = 'large';
   /** (optional) Injected CSS styles */
   @Prop() styles?: string;
 

From 1ab00fdb0bc6bb4b7e592fc0f166d9592f10cb62 Mon Sep 17 00:00:00 2001
From: christopherGdynia <A105227211@BE1GC757>
Date: Wed, 12 Jan 2022 13:13:31 +0100
Subject: [PATCH 32/32] toggle button prop with default val as optional

---
 .../components/src/components/toggle-button/toggle-button.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/components/src/components/toggle-button/toggle-button.tsx b/packages/components/src/components/toggle-button/toggle-button.tsx
index 8f2f43a2df..d4d503e52d 100644
--- a/packages/components/src/components/toggle-button/toggle-button.tsx
+++ b/packages/components/src/components/toggle-button/toggle-button.tsx
@@ -57,7 +57,7 @@ export class ToggleButton {
   /** (optional) set the border-radius left, right or both */
   @Prop() hideBorder: false;
   /** (optional) set the border-radius left, right or both */
-  @Prop() radius: 'left' | 'right' | 'both' | 'neither' | null = null;
+  @Prop() radius?: 'left' | 'right' | 'both' | 'neither' | null = null;
   /** (optional) toggle button's id */
   @Prop({ reflect: true }) toggleButtonId?: string;
   /** (optional) aria-label attribute needed for icon-only buttons */