build(deps-dev): bump prettier from 2.7.1 to 3.8.4

package.json

@@ -24,7 +24,7 @@
     "@commitlint/config-conventional": "^12.1.1",
     "husky": "^9.1.7",
     "lerna": "3.22.1",
-    "prettier": "2.7.1",
+    "prettier": "3.8.4",
     "replace-in-file": "^6.2.0",
     "rimraf": "2.6.3"
   },

packages/components/src/components/chip/chip.css

@@ -92,7 +92,8 @@
 
 .chip:not(.chip--disabled):not(.chip--type-dynamic):hover,
 .chip.chip--type-dynamic:not(.chip--selected):hover {
-  background: linear-gradient(
+  background:
+    linear-gradient(
       var(--telekom-color-ui-state-fill-hovered),
       var(--telekom-color-ui-state-fill-hovered)
     ),
@@ -101,7 +102,8 @@
 
 .chip:not(.chip--disabled):not(.chip--type-dynamic):active,
 .chip.chip--type-dynamic:not(.chip--selected):active {
-  background: linear-gradient(
+  background:
+    linear-gradient(
       var(--telekom-color-ui-state-fill-pressed),
       var(--telekom-color-ui-state-fill-pressed)
     ),
@@ -114,15 +116,17 @@
 }
 
 .chip--selected:not(.chip--disabled):not(.chip--type-dynamic):hover {
-  background: linear-gradient(
+  background:
+    linear-gradient(
       var(--telekom-color-ui-state-fill-hovered-inverted),
       var(--telekom-color-ui-state-fill-hovered-inverted)
     ),
     var(--background-standard-selected);
 }
 
 .chip--selected:not(.chip--disabled):not(.chip--type-dynamic):active {
-  background: linear-gradient(
+  background:
+    linear-gradient(
       var(--telekom-color-ui-state-fill-pressed-inverted),
       var(--telekom-color-ui-state-fill-pressed-inverted)
     ),
@@ -169,7 +173,9 @@ disabled
   border: 1px solid var(--telekom-color-ui-border-disabled);
 }
 
-.chip--selected:not(.chip--variant-outlined):not(.chip--type-dynamic).chip--disabled {
+.chip--selected:not(.chip--variant-outlined):not(
+    .chip--type-dynamic
+  ).chip--disabled {
   background: var(--telekom-color-ui-disabled);
   color: var(--telekom-color-text-and-icon-disabled);
   border: none;
@@ -185,16 +191,22 @@ disabled
 variant outline
 **/
 
-.chip.chip--variant-outline.chip--selected:not(.chip.chip--disabled):not(.chip--type-dynamic):hover {
-  background: linear-gradient(
+.chip.chip--variant-outline.chip--selected:not(.chip.chip--disabled):not(
+    .chip--type-dynamic
+  ):hover {
+  background:
+    linear-gradient(
       var(--telekom-color-ui-state-fill-hovered),
       var(--telekom-color-ui-state-fill-hovered)
     ),
     var(--telekom-color-text-and-icon-inverted-standard);
 }
 
-.chip.chip--variant-outline.chip--selected:not(.chip.chip--disabled):not(.chip--type-dynamic):active {
-  background: linear-gradient(
+.chip.chip--variant-outline.chip--selected:not(.chip.chip--disabled):not(
+    .chip--type-dynamic
+  ):active {
+  background:
+    linear-gradient(
       var(--telekom-color-ui-state-fill-pressed),
       var(--telekom-color-ui-state-fill-pressed)
     ),

packages/components/src/components/combobox/combobox.css

@@ -31,8 +31,8 @@
 
   /*listbox*/
   --background-listbox: var(--telekom-color-background-surface);
-  --box-shadow-listbox: 0 2px 4px 0 rgba(0, 0, 0, 0.1),
-    0 4px 16px 0 rgba(0, 0, 0, 0.1);
+  --box-shadow-listbox:
+    0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 4px 16px 0 rgba(0, 0, 0, 0.1);
   --max-height-listbox: 300px;
   --z-index-listbox: 99;
 

packages/components/src/components/data-grid/data-grid.tsx

@@ -425,8 +425,8 @@ export class DataGrid {
       currentSortDirection === 'none'
         ? 'ascending'
         : currentSortDirection === 'ascending'
-        ? 'descending'
-        : 'none';
+          ? 'descending'
+          : 'none';
     this.fields[columnIndex].sortDirection = newSortDirection;
     this.sortTable(newSortDirection, type, columnIndex);
   }
@@ -1182,8 +1182,8 @@ export class DataGrid {
                     field.visible !== undefined
                       ? field.visible
                       : CELL_TYPES[field.type].defaults.visible !== undefined
-                      ? CELL_TYPES[field.type].defaults.visible
-                      : CELL_DEFAULTS.visible;
+                        ? CELL_TYPES[field.type].defaults.visible
+                        : CELL_DEFAULTS.visible;
                   if (!visible) {
                     return;
                   }

packages/components/src/components/dropdown-select/dropdown-select.css

@@ -54,8 +54,8 @@
 
   /*listbox*/
   --background-listbox: var(--telekom-color-background-surface);
-  --box-shadow-listbox: 0 2px 4px 0 rgba(0, 0, 0, 0.1),
-    0 4px 16px 0 rgba(0, 0, 0, 0.1);
+  --box-shadow-listbox:
+    0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 4px 16px 0 rgba(0, 0, 0, 0.1);
   --max-height-listbox: 300px;
   --z-index-listbox: 99;
 }

packages/components/src/components/input/input.css

@@ -158,7 +158,8 @@
       (
           var(--telekom-spacing-composition-space-14) -
             var(--telekom-typography-font-size-body)
-        ) / 2
+        ) /
+        2
     )
   );
   font-weight: var(--telekom-typography-font-weight-medium);
@@ -220,7 +221,8 @@
       (
           var(--telekom-spacing-composition-space-12) -
             var(--telekom-typography-font-size-body)
-        ) / 2
+        ) /
+        2
     )
   );
   font-weight: var(--telekom-typography-font-weight-medium);

packages/components/src/components/segment/segment.spec.ts

@@ -17,7 +17,7 @@ describe('Segment', () => {
             <scale-segment>Label</scale-segment>`,
     });
     page.root.disabled = true;
-    (page.root.size = 'medium'), (page.root.selected = true);
+    ((page.root.size = 'medium'), (page.root.selected = true));
     page.root.hasIcon = true;
     page.root.ariaLangSelected = 'ariaLangSelected';
     page.root.ariaLangDeselected = 'ariaLangDeselected';

packages/components/src/components/segment/segment.tsx

@@ -191,8 +191,8 @@ export class Segment {
                     this.size === 'small'
                       ? 14
                       : this.size === 'medium'
-                      ? 16
-                      : 20
+                        ? 16
+                        : 20
                   }
                   class="scale-icon-action-checkmark"
                   aria-hidden="true"

packages/components/src/components/segmented-button/segmented-button.tsx

@@ -206,8 +206,8 @@ export class SegmentedButton {
           this.size === 'small'
             ? CHECKMARK_WIDTH_SMALL
             : this.size === 'medium'
-            ? CHECKMARK_WIDTH_MEDIUM
-            : CHECKMARK_WIDTH_LARGE;
+              ? CHECKMARK_WIDTH_MEDIUM
+              : CHECKMARK_WIDTH_LARGE;
         if (selected || iconOnly) {
           tempWidth =
             child.getBoundingClientRect().width > tempWidth

packages/components/src/components/slider/slider.css

@@ -22,7 +22,8 @@
   --size-thumb: 24px;
   --border-color-thumb: rgba(0, 0, 0, 0.05);
   --background-thumb: var(--telekom-color-ui-white);
-  --shadow-thumb: 0 0 2px 0 rgba(0, 0, 0, 0.24), 0 2px 4px 0 rgba(0, 0, 0, 0.24),
+  --shadow-thumb:
+    0 0 2px 0 rgba(0, 0, 0, 0.24), 0 2px 4px 0 rgba(0, 0, 0, 0.24),
     0 4px 12px 0 rgba(0, 0, 0, 0.26);
   --color-focus: var(--telekom-color-functional-focus-standard);
   --spacing-x-step-marks: 8px;

packages/components/src/components/switch/switch.css

@@ -16,7 +16,8 @@ scale-switch {
   --radius: 1em;
   --transition-duration: var(--telekom-motion-duration-immediate);
   --transition-easing: var(--telekom-motion-easing-standard);
-  --shadow-thumb: 0 0 2px 0 rgba(0, 0, 0, 0.24), 0 2px 4px 0 rgba(0, 0, 0, 0.24),
+  --shadow-thumb:
+    0 0 2px 0 rgba(0, 0, 0, 0.24), 0 2px 4px 0 rgba(0, 0, 0, 0.24),
     0 4px 12px 0 rgba(0, 0, 0, 0.26);
   --spacing-x-label: var(--telekom-spacing-composition-space-04);
   --font-label: var(--telekom-text-style-ui);

packages/components/src/components/telekom/app-header/app-header.css

@@ -253,7 +253,8 @@ scale-app-header {
     display: flex;
     opacity: 1;
     position: relative;
-    transition: opacity var(--header-transition-speed) ease-in-out,
+    transition:
+      opacity var(--header-transition-speed) ease-in-out,
       top var(--header-transition-speed) ease-in-out;
     align-items: center;
   }
@@ -317,7 +318,8 @@ scale-app-header {
   }
   .header.header--sticky .header__brand-content {
     opacity: 0;
-    transition: opacity var(--header-transition-speed) ease-in-out,
+    transition:
+      opacity var(--header-transition-speed) ease-in-out,
       top var(--header-transition-speed) ease-in-out;
   }
   .header *[slot='menu-main'],

packages/components/src/components/telekom/app-mega-menu/app-mega-menu.css

@@ -70,7 +70,9 @@ app-mega-menu {
   color: var(--color-row-item);
   margin-bottom: var(--spacing-bottom-row-item);
   text-decoration: none;
-  transition: color, border 0.15s ease-in-out;
+  transition:
+    color,
+    border 0.15s ease-in-out;
   display: block;
   margin-bottom: 7px;
 }

packages/components/src/components/telekom/nav-main/nav-main.css

@@ -47,7 +47,9 @@ scale-nav-main {
   font-size: var(--font-size);
   font-weight: var(--font-weight);
   line-height: var(--line-height);
-  transition: color, border 0.2s ease-in-out;
+  transition:
+    color,
+    border 0.2s ease-in-out;
   align-items: center;
   text-decoration: none;
 }

packages/components/src/components/telekom/telekom-header/telekom-header.css

@@ -17,7 +17,8 @@
   --shadow: 0px 2px 9px rgba(0, 0, 0, 0.15);
   --background: var(--telekom-color-background-surface);
   --background-logo: var(--telekom-color-primary-standard);
-  --transition-common-scrolled: height var(--telekom-motion-duration-immediate)
+  --transition-common-scrolled:
+    height var(--telekom-motion-duration-immediate)
       var(--telekom-motion-easing-standard),
     width var(--telekom-motion-duration-immediate),
     margin var(--telekom-motion-duration-immediate);

packages/components/src/components/text-field/text-field.css

@@ -211,23 +211,35 @@ scale-text-field {
   border: var(--border-warning);
 }
 
-.text-field--variant-danger:not(.text-field--disabled):not(.text-field--readonly)
+.text-field--variant-danger:not(.text-field--disabled):not(
+    .text-field--readonly
+  )
   .text-field__control:hover,
-.text-field--variant-danger:not(.text-field--disabled):not(.text-field--readonly)
+.text-field--variant-danger:not(.text-field--disabled):not(
+    .text-field--readonly
+  )
   .text-field__control:focus {
   border-color: var(--telekom-color-functional-danger-hovered);
 }
 
-.text-field--variant-success:not(.text-field--disabled):not(.text-field--readonly)
+.text-field--variant-success:not(.text-field--disabled):not(
+    .text-field--readonly
+  )
   .text-field__control:hover,
-.text-field--variant-success:not(.text-field--disabled):not(.text-field--readonly)
+.text-field--variant-success:not(.text-field--disabled):not(
+    .text-field--readonly
+  )
   .text-field__control:focus {
   border-color: var(--telekom-color-functional-success-hovered);
 }
 
-.text-field--variant-warning:not(.text-field--disabled):not(.text-field--readonly)
+.text-field--variant-warning:not(.text-field--disabled):not(
+    .text-field--readonly
+  )
   .text-field__control:hover,
-.text-field--variant-warning:not(.text-field--disabled):not(.text-field--readonly)
+.text-field--variant-warning:not(.text-field--disabled):not(
+    .text-field--readonly
+  )
   .text-field__control:focus {
   border-color: var(--telekom-color-functional-warning-hovered);
 }

packages/components/src/components/textarea/textarea.css

@@ -176,7 +176,9 @@ scale-textarea {
 
 .textarea--status-error:not(.textarea--disabled):not(.textarea--readonly)
   .textarea__wrapper:hover,
-.textarea--status-error:not(.textarea--disabled):not(.textarea--readonly).textarea--has-focus
+.textarea--status-error:not(.textarea--disabled):not(
+    .textarea--readonly
+  ).textarea--has-focus
   .textarea__wrapper {
   border-color: var(--telekom-color-functional-danger-hovered);
 }

packages/components/src/components/toggle-button/toggle-button.css

@@ -19,7 +19,8 @@
   --height-regular: var(--telekom-spacing-composition-space-12);
   --height-large: var(--telekom-spacing-composition-space-14);
   --radius: var(--telekom-radius-small);
-  --transition: all var(--telekom-motion-duration-transition)
+  --transition:
+    all var(--telekom-motion-duration-transition)
       var(--telekom-motion-easing-standard),
     border-radius var(--telekom-motion-duration-instant);
   --box-shadow-focus: inset 0 0 0 var(--telekom-line-weight-highlight)
@@ -186,12 +187,16 @@
   background: var(--background-selected-dark);
 }
 
-.toggle-button--selected:not(.button--disabled).toggle-button--monochrome:hover {
+.toggle-button--selected:not(
+    .button--disabled
+  ).toggle-button--monochrome:hover {
   color: var(--color-selected);
   background: var(--background-selected-hover-dark);
 }
 
-.toggle-button--selected:not(.button--disabled).toggle-button--monochrome:active {
+.toggle-button--selected:not(
+    .button--disabled
+  ).toggle-button--monochrome:active {
   color: var(--color-selected);
   background: var(--background-selected-active-dark);
 }