chore(prettier): enable trailing commas

Author: Lukas742

package.json

@@ -18,7 +18,7 @@
     "test": "yarn test:prepare && cypress run --component --browser chrome",
     "clean": "tsc --build --clean && tsc --build tsconfig.build.json --clean && rimraf temp .out && lerna run clean",
     "clean:remove-modules": "yarn clean && rimraf node_modules",
-    "prettier:all": "prettier --write --config ./prettier.config.cjs \"packages/**/*.{js,jsx,ts,tsx,mdx,json,md}\"",
+    "prettier:all": "prettier --write --config ./prettier.config.js \"packages/**/*.{js,jsx,ts,tsx,mdx,json,md}\"",
     "lint": "eslint packages",
     "lerna:version-dryrun": "lerna version --conventional-graduate --no-git-tag-version --no-push",
     "wrappers:main": "node packages/cli/dist/bin/index.js create-wrappers --packageName @ui5/webcomponents --out ./packages/main/src/webComponents --additionalComponentNote 'This is a UI5 Web Component! [Repository](https://github.com/SAP/ui5-webcomponents) | [Documentation](https://sap.github.io/ui5-webcomponents/)'",

packages/ai/src/components/Button/Button.stories.tsx

@@ -14,12 +14,12 @@ const meta = {
   title: 'Button',
   component: Button,
   argTypes: {
-    children: { control: 'text' }
+    children: { control: 'text' },
   },
   args: {
-    design: ButtonDesign.Default
+    design: ButtonDesign.Default,
   },
-  tags: ['package:@ui5/webcomponents-ai']
+  tags: ['package:@ui5/webcomponents-ai'],
 } satisfies Meta<typeof Button>;
 
 export default meta;
@@ -106,5 +106,5 @@ export const Default: Story = {
         )}
       </>
     );
-  }
+  },
 };

packages/ai/src/components/Button/index.tsx

@@ -100,7 +100,7 @@ const Button = withWebComponent<ButtonPropTypes, ButtonDomRef>(
   ['design', 'state'],
   ['arrowButtonPressed', 'disabled'],
   [],
-  ['arrow-button-click', 'click']
+  ['arrow-button-click', 'click'],
 );
 
 Button.displayName = 'Button';

packages/ai/src/components/ButtonState/index.tsx

@@ -73,7 +73,7 @@ const ButtonState = withWebComponent<ButtonStatePropTypes, ButtonStateDomRef>(
   ['endIcon', 'icon', 'name', 'text'],
   ['showArrowButton'],
   [],
-  []
+  [],
 );
 
 ButtonState.displayName = 'ButtonState';

packages/ai/src/components/PromptInput/PromptInput.stories.tsx

@@ -7,12 +7,12 @@ const meta = {
   component: PromptInput,
   argTypes: {
     children: { control: { disable: true } },
-    valueStateMessage: { control: { disable: true } }
+    valueStateMessage: { control: { disable: true } },
   },
   args: {
-    valueState: ValueState.None
+    valueState: ValueState.None,
   },
-  tags: ['package:@ui5/webcomponents-ai']
+  tags: ['package:@ui5/webcomponents-ai'],
 } satisfies Meta<typeof PromptInput>;
 
 export default meta;

packages/ai/src/components/PromptInput/index.tsx

@@ -185,7 +185,7 @@ const PromptInput = withWebComponent<PromptInputPropTypes, PromptInputDomRef>(
   ['label', 'maxlength', 'placeholder', 'value', 'valueState'],
   ['disabled', 'readonly', 'showClearIcon', 'showExceededText', 'showSuggestions'],
   ['valueStateMessage'],
-  ['change', 'input', 'submit']
+  ['change', 'input', 'submit'],
 );
 
 PromptInput.displayName = 'PromptInput';

packages/base/src/Device/Media.cy.tsx

@@ -7,7 +7,7 @@ describe('Device - Media', () => {
     expect(getCurrentRange()).to.deep.equal({
       from: 1440,
       name: 'LargeDesktop',
-      unit: 'px'
+      unit: 'px',
     });
   });
 
@@ -16,7 +16,7 @@ describe('Device - Media', () => {
       from: 0,
       name: 'Phone',
       to: 599,
-      unit: 'px'
+      unit: 'px',
     });
   });
 

packages/base/src/Device/Media.ts

@@ -10,14 +10,14 @@ const RANGE_DEFINITIONS: Record<RANGE_4_STEPS, [number, number]> = {
   S: [0, 599],
   M: [600, 1023],
   L: [1024, 1439],
-  XL: [1440, -1]
+  XL: [1440, -1],
 };
 
 const newRangeToLegacyRangeMap: Record<RANGE_4_STEPS, RANGE_LEGACY_4_STEPS> = {
   S: 'Phone',
   M: 'Tablet',
   L: 'Desktop',
-  XL: 'LargeDesktop'
+  XL: 'LargeDesktop',
 };
 
 function getQuery(from: number, to: number) {
@@ -35,7 +35,7 @@ function resolveRangeInfo(name: RANGE_4_STEPS): RangeInfo {
   const params: RangeInfo = {
     from: RANGE_DEFINITIONS[name][0],
     name: newRangeToLegacyRangeMap[name],
-    unit: 'px'
+    unit: 'px',
   };
   if (RANGE_DEFINITIONS[name][1] > 0) {
     params.to = RANGE_DEFINITIONS[name][1];
@@ -51,7 +51,7 @@ function initMediaQueries() {
       S: window.matchMedia(getQuery(...RANGE_DEFINITIONS.S)),
       M: window.matchMedia(getQuery(...RANGE_DEFINITIONS.M)),
       L: window.matchMedia(getQuery(...RANGE_DEFINITIONS.L)),
-      XL: window.matchMedia(getQuery(...RANGE_DEFINITIONS.XL))
+      XL: window.matchMedia(getQuery(...RANGE_DEFINITIONS.XL)),
     };
 
     for (const mediaQueriesKey in mediaQueries) {
@@ -74,7 +74,7 @@ export const getCurrentRange = (width?: number): RangeInfo => {
       from: 1024,
       to: 1439,
       name: 'Desktop',
-      unit: 'px'
+      unit: 'px',
     };
   }
   // @ts-expect-error: width can only be undefined or a number, therefore `isNaN` works here

packages/base/src/Device/index.cy.tsx

@@ -3,7 +3,7 @@ import {
   attachOrientationChangeHandler,
   attachResizeHandler,
   detachOrientationChangeHandler,
-  detachResizeHandler
+  detachResizeHandler,
 } from './index';
 
 function ResizeTestComponent({ onChange }: { onChange: (event: { width: number; height: number }) => void }) {
@@ -23,7 +23,7 @@ function ResizeTestComponent({ onChange }: { onChange: (event: { width: number;
 }
 
 function OrientationChangeComponent({
-  onChange
+  onChange,
 }: {
   onChange: (event: { portrait: boolean; landscape: boolean }) => void;
 }) {
@@ -50,7 +50,7 @@ describe('Device', () => {
     cy.viewport(200, 1080);
     cy.get('@resize').should('have.been.calledOnce').and('have.been.calledWith', {
       height: 1080,
-      width: 200
+      width: 200,
     });
 
     cy.findByText('Unregister').click();
@@ -67,12 +67,12 @@ describe('Device', () => {
     cy.viewport('iphone-x', 'landscape');
     cy.get('@orientation').should('have.been.calledOnce').and('have.been.calledWith', {
       landscape: true,
-      portrait: false
+      portrait: false,
     });
     cy.viewport('iphone-x', 'portrait');
     cy.get('@orientation').should('have.been.calledTwice').and('have.been.calledWith', {
       landscape: true,
-      portrait: false
+      portrait: false,
     });
 
     cy.findByText('Unregister').click();

packages/base/src/Device/index.ts

@@ -21,12 +21,12 @@ const rInputTagRegex = /INPUT|TEXTAREA|SELECT/;
 
 const internalWindowSize: IWindowSize = {
   height: 0,
-  width: 0
+  width: 0,
 };
 
 const internalOrientation: IOrientation = {
   landscape: false,
-  portrait: false
+  portrait: false,
 };
 
 // PRIVATE API
@@ -72,7 +72,7 @@ const handleOrientationChange = () => {
   setOrientationInfo();
   OrientationEventProvider.fireEvent('orientation', {
     landscape: internalOrientation.landscape,
-    portrait: internalOrientation.portrait
+    portrait: internalOrientation.portrait,
   });
 };
 
@@ -139,7 +139,7 @@ const handleResizeChange = () => {
   setResizeInfo();
   ResizeEventProvider.fireEvent('resize', {
     height: internalWindowSize.height,
-    width: internalWindowSize.width
+    width: internalWindowSize.width,
   });
 };