Merged in fix/3697-prettier-configs (pull request #3396)

fix(SW-3691): Setup one prettier config for whole repo

* Setup prettierrc in root and remove other configs


Approved-by: Joakim Jäderberg
Approved-by: Linus Flood

packages/design-system/lib/components/Input/Input.stories.tsx

@@ -1,14 +1,14 @@
-import type { Meta, StoryObj } from '@storybook/nextjs-vite'
+import type { Meta, StoryObj } from "@storybook/nextjs-vite"
 
-import { expect } from 'storybook/test'
+import { expect } from "storybook/test"
 
-import { Input } from './Input'
-import { TextField } from 'react-aria-components'
-import { MaterialIcon } from '../Icons/MaterialIcon'
-import type { SymbolCodepoints } from '../Icons/MaterialIcon/MaterialSymbol/types'
+import { Input } from "./Input"
+import { TextField } from "react-aria-components"
+import { MaterialIcon } from "../Icons/MaterialIcon"
+import type { SymbolCodepoints } from "../Icons/MaterialIcon/MaterialSymbol/types"
 
 const meta: Meta<typeof Input> = {
-  title: 'Core Components/Input',
+  title: "Core Components/Input",
   // @ts-expect-error Input does not support this, but wrapping <TextField> does
   component: ({ isInvalid, validationState, ...props }) => (
     <TextField isInvalid={isInvalid} data-validation-state={validationState}>
@@ -17,117 +17,117 @@ const meta: Meta<typeof Input> = {
   ),
   argTypes: {
     label: {
-      control: 'text',
-      description: 'The label text displayed for the input field',
+      control: "text",
+      description: "The label text displayed for the input field",
       table: {
-        type: { summary: 'string' },
+        type: { summary: "string" },
       },
     },
     labelPosition: {
-      control: 'select',
-      options: ['floating', 'top'],
-      description: 'Position of the label relative to the input',
+      control: "select",
+      options: ["floating", "top"],
+      description: "Position of the label relative to the input",
       table: {
         type: { summary: "'floating' | 'top'" },
         defaultValue: { summary: "'floating'" },
       },
     },
     placeholder: {
-      control: 'text',
-      description: 'Placeholder text shown when input is empty',
+      control: "text",
+      description: "Placeholder text shown when input is empty",
       table: {
-        type: { summary: 'string' },
-        defaultValue: { summary: 'undefined' },
+        type: { summary: "string" },
+        defaultValue: { summary: "undefined" },
       },
     },
     required: {
-      control: 'boolean',
-      description: 'Whether the input is required',
+      control: "boolean",
+      description: "Whether the input is required",
       table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: 'false' },
+        type: { summary: "boolean" },
+        defaultValue: { summary: "false" },
       },
     },
     disabled: {
-      control: 'boolean',
-      description: 'Whether the input is disabled',
+      control: "boolean",
+      description: "Whether the input is disabled",
       table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: 'false' },
+        type: { summary: "boolean" },
+        defaultValue: { summary: "false" },
       },
     },
     showClearContentIcon: {
-      control: 'boolean',
-      description: 'Whether the clear content icon is shown',
+      control: "boolean",
+      description: "Whether the clear content icon is shown",
       table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: 'false' },
+        type: { summary: "boolean" },
+        defaultValue: { summary: "false" },
       },
     },
     showLeftIcon: {
-      control: 'boolean',
-      description: 'Whether to show a left icon',
+      control: "boolean",
+      description: "Whether to show a left icon",
       table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: 'false' },
+        type: { summary: "boolean" },
+        defaultValue: { summary: "false" },
       },
     },
     showRightIcon: {
-      control: 'boolean',
-      description: 'Whether to show a right icon',
+      control: "boolean",
+      description: "Whether to show a right icon",
       table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: 'false' },
+        type: { summary: "boolean" },
+        defaultValue: { summary: "false" },
       },
     },
     leftIconName: {
-      control: 'select',
+      control: "select",
       options: [
-        'calendar_month',
-        'credit_card',
-        'email',
-        'info_circle',
-        'location_on',
-        'lock',
-        'phone',
-        'search',
-        'sell',
-        'visibility',
-        'visibility_off',
+        "calendar_month",
+        "credit_card",
+        "email",
+        "info_circle",
+        "location_on",
+        "lock",
+        "phone",
+        "search",
+        "sell",
+        "visibility",
+        "visibility_off",
       ],
-      description: 'Icon name for the left icon',
+      description: "Icon name for the left icon",
       table: {
-        type: { summary: 'string' },
+        type: { summary: "string" },
         defaultValue: { summary: "'person'" },
       },
     },
     rightIconName: {
-      control: 'select',
+      control: "select",
       options: [
-        'calendar_month',
-        'credit_card',
-        'email',
-        'info_circle',
-        'location_on',
-        'lock',
-        'phone',
-        'search',
-        'sell',
-        'visibility',
-        'visibility_off',
+        "calendar_month",
+        "credit_card",
+        "email",
+        "info_circle",
+        "location_on",
+        "lock",
+        "phone",
+        "search",
+        "sell",
+        "visibility",
+        "visibility_off",
       ],
-      description: 'Icon name for the right icon',
+      description: "Icon name for the right icon",
       table: {
-        type: { summary: 'string' },
+        type: { summary: "string" },
         defaultValue: { summary: "'lock'" },
       },
     },
     showWarning: {
-      control: 'boolean',
-      description: 'Whether to show warning validation state',
+      control: "boolean",
+      description: "Whether to show warning validation state",
       table: {
-        type: { summary: 'boolean' },
-        defaultValue: { summary: 'false' },
+        type: { summary: "boolean" },
+        defaultValue: { summary: "false" },
       },
     },
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -140,13 +140,13 @@ type Story = StoryObj<typeof Input>
 
 export const Default: Story = {
   args: {
-    label: 'Label',
-    name: 'foo',
+    label: "Label",
+    name: "foo",
     required: false,
     showLeftIcon: false,
     showRightIcon: false,
-    leftIconName: 'person',
-    rightIconName: 'lock',
+    leftIconName: "person",
+    rightIconName: "lock",
     showWarning: false,
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
   } as any,
@@ -167,7 +167,7 @@ export const Default: Story = {
       showWarning?: boolean
     }
 
-    const validationState = showWarning ? 'warning' : undefined
+    const validationState = showWarning ? "warning" : undefined
 
     return (
       <TextField data-validation-state={validationState}>
@@ -189,15 +189,15 @@ export const Default: Story = {
     )
   },
   play: async ({ canvas, userEvent }) => {
-    const textbox = canvas.getByRole('textbox')
+    const textbox = canvas.getByRole("textbox")
     expect(textbox).not.toBeDisabled()
 
-    expect(textbox).toHaveValue('')
+    expect(textbox).toHaveValue("")
 
-    await userEvent.type(textbox, 'Hello World')
-    expect(textbox).toHaveValue('Hello World')
+    await userEvent.type(textbox, "Hello World")
+    expect(textbox).toHaveValue("Hello World")
 
     await userEvent.clear(textbox)
-    expect(textbox).toHaveValue('')
+    expect(textbox).toHaveValue("")
   },
 }