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/Select/Select.stories.tsx

@@ -1,9 +1,9 @@
-import type { Meta, StoryObj } from '@storybook/nextjs-vite'
+import type { Meta, StoryObj } from "@storybook/nextjs-vite"
 
-import { Select } from './Select'
+import { Select } from "./Select"
 
 const meta: Meta<typeof Select> = {
-  title: 'Core Components/Select',
+  title: "Core Components/Select",
   component: Select,
   argTypes: {},
 }
@@ -13,43 +13,43 @@ export default meta
 type Story = StoryObj<typeof Select>
 
 const items = [
-  { label: 'Foo', value: 'foo' },
-  { label: 'Bar', value: 'bar' },
-  { label: 'Baz', value: 'baz' },
+  { label: "Foo", value: "foo" },
+  { label: "Bar", value: "bar" },
+  { label: "Baz", value: "baz" },
 ]
 
 export const Default: Story = {
   args: {
     items,
-    label: 'Select an item',
-    name: 'foo',
+    label: "Select an item",
+    name: "foo",
   },
 }
 
 export const DefaultSelected: Story = {
   args: {
     items,
-    label: 'Select an item',
-    name: 'foo',
-    defaultSelectedKey: 'foo',
+    label: "Select an item",
+    name: "foo",
+    defaultSelectedKey: "foo",
   },
 }
 
 export const Icons: Story = {
   args: {
     items,
-    label: 'Select an item',
-    name: 'foo',
-    icon: 'star',
-    itemIcon: 'check',
+    label: "Select an item",
+    name: "foo",
+    icon: "star",
+    itemIcon: "check",
   },
 }
 
 export const Filtering: Story = {
   args: {
     items,
-    label: 'Select an item',
-    name: 'foo',
+    label: "Select an item",
+    name: "foo",
     enableFiltering: true,
   },
 }
@@ -57,9 +57,9 @@ export const Filtering: Story = {
 export const FilteringSelected: Story = {
   args: {
     items,
-    label: 'Select an item',
-    name: 'foo',
+    label: "Select an item",
+    name: "foo",
     enableFiltering: true,
-    defaultSelectedKey: 'foo',
+    defaultSelectedKey: "foo",
   },
 }

packages/design-system/lib/components/Select/Select.tsx

@@ -4,19 +4,19 @@ import {
   Popover,
   ListBox,
   Button,
-} from 'react-aria-components'
-import { cx } from 'class-variance-authority'
+} from "react-aria-components"
+import { cx } from "class-variance-authority"
 
-import { MaterialIcon } from '../Icons/MaterialIcon'
-import { Typography } from '../Typography'
-import { SelectItem } from './SelectItem'
-import { SelectFilter } from './SelectFilter'
+import { MaterialIcon } from "../Icons/MaterialIcon"
+import { Typography } from "../Typography"
+import { SelectItem } from "./SelectItem"
+import { SelectFilter } from "./SelectFilter"
 
-import type { SelectProps, SelectFilterProps } from './types'
+import type { SelectProps, SelectFilterProps } from "./types"
 
-import styles from './select.module.css'
-import { useState } from 'react'
-import { InputLabel } from '../InputLabel'
+import styles from "./select.module.css"
+import { useState } from "react"
+import { InputLabel } from "../InputLabel"
 
 export function Select({
   name,
@@ -41,7 +41,7 @@ export function Select({
       />
     )
   }
-  const iconColor = isDisabled ? 'Icon/Interactive/Disabled' : 'Icon/Default'
+  const iconColor = isDisabled ? "Icon/Interactive/Disabled" : "Icon/Default"
 
   return (
     <AriaSelect

packages/design-system/lib/components/Select/SelectFilter.tsx

@@ -1,4 +1,4 @@
-'use client'
+"use client"
 
 import {
   Button,
@@ -9,7 +9,7 @@ import {
   Popover,
   Label as AriaLabel,
   ComboBoxStateContext,
-} from 'react-aria-components'
+} from "react-aria-components"
 import {
   PropsWithChildren,
   RefObject,
@@ -17,16 +17,16 @@ import {
   useEffect,
   useRef,
   useState,
-} from 'react'
+} from "react"
 
-import { MaterialIcon } from '../Icons/MaterialIcon'
-import { Typography } from '../Typography'
-import { SelectItem } from './SelectItem'
+import { MaterialIcon } from "../Icons/MaterialIcon"
+import { Typography } from "../Typography"
+import { SelectItem } from "./SelectItem"
 
-import type { SelectFilterProps } from './types'
+import type { SelectFilterProps } from "./types"
 
-import styles from './select.module.css'
-import { InputLabel } from '../InputLabel'
+import styles from "./select.module.css"
+import { InputLabel } from "../InputLabel"
 
 /**
  * ComboBoxInner
@@ -59,8 +59,8 @@ function ComboBoxInner({
       // The simlulated event has to originate from the input field.
       if (inputRef.current) {
         // Simulate a press on down arrow key.
-        const e = new KeyboardEvent('keydown', {
-          key: 'ArrowDown',
+        const e = new KeyboardEvent("keydown", {
+          key: "ArrowDown",
           bubbles: true /* important so RAC can act on it */,
         })
 
@@ -99,7 +99,7 @@ export function SelectFilter({
 }: SelectFilterProps) {
   const [focus, setFocus] = useState(false)
   const [value, setValue] = useState<Key | null>(defaultSelectedKey ?? null)
-  const iconColor = isDisabled ? 'Icon/Interactive/Disabled' : 'Icon/Default'
+  const iconColor = isDisabled ? "Icon/Interactive/Disabled" : "Icon/Default"
 
   const inputRef = useRef<HTMLInputElement>(null!)
 

packages/design-system/lib/components/Select/SelectItem.tsx

@@ -1,8 +1,8 @@
-import { ListBoxItem } from 'react-aria-components'
-import { Typography } from '../Typography'
-import styles from './select.module.css'
-import { MaterialIcon } from '../Icons/MaterialIcon'
-import { SelectItemProps } from './types'
+import { ListBoxItem } from "react-aria-components"
+import { Typography } from "../Typography"
+import styles from "./select.module.css"
+import { MaterialIcon } from "../Icons/MaterialIcon"
+import { SelectItemProps } from "./types"
 
 export function SelectItem({
   children,
@@ -10,7 +10,7 @@ export function SelectItem({
   isDisabled,
   ...props
 }: SelectItemProps) {
-  const iconColor = isDisabled ? 'Icon/Interactive/Disabled' : 'Icon/Default'
+  const iconColor = isDisabled ? "Icon/Interactive/Disabled" : "Icon/Default"
 
   return (
     <ListBoxItem
@@ -31,7 +31,7 @@ export function SelectItem({
           ) : null}
           <Typography
             variant={
-              isSelected ? 'Body/Paragraph/mdBold' : 'Body/Paragraph/mdRegular'
+              isSelected ? "Body/Paragraph/mdBold" : "Body/Paragraph/mdRegular"
             }
           >
             <span>{children}</span>

packages/design-system/lib/components/Select/index.tsx

@@ -1,3 +1,3 @@
-export { Select } from './Select'
-export { SelectItem } from './SelectItem'
-export { SelectFilter } from './SelectFilter'
+export { Select } from "./Select"
+export { SelectItem } from "./SelectItem"
+export { SelectFilter } from "./SelectFilter"

packages/design-system/lib/components/Select/select.module.css

@@ -7,7 +7,7 @@
   box-sizing: border-box;
 
   &[data-required] .label::after {
-    content: ' *';
+    content: " *";
   }
   &[data-open] {
     .chevron {
@@ -92,7 +92,7 @@
   padding: 0;
   width: 100%;
 
-  &[value]:not([value='']) {
+  &[value]:not([value=""]) {
     min-height: 24px;
   }
 }

packages/design-system/lib/components/Select/types.ts

@@ -1,18 +1,18 @@
-import { ComponentProps, InputHTMLAttributes } from 'react'
-import { ComboBox, Key, ListBoxItem, Select } from 'react-aria-components'
-import { MaterialIconProps } from '../Icons/MaterialIcon'
+import { ComponentProps, InputHTMLAttributes } from "react"
+import { ComboBox, Key, ListBoxItem, Select } from "react-aria-components"
+import { MaterialIconProps } from "../Icons/MaterialIcon"
 
 interface Item extends Record<string, unknown> {
   label: string
   value: Key
   isDisabled?: boolean
-  icon?: MaterialIconProps['icon']
+  icon?: MaterialIconProps["icon"]
 }
 
 export interface SelectProps extends ComponentProps<typeof Select> {
   autoComplete?: string
-  icon?: MaterialIconProps['icon']
-  itemIcon?: MaterialIconProps['icon']
+  icon?: MaterialIconProps["icon"]
+  itemIcon?: MaterialIconProps["icon"]
   items: Item[]
   name: string
   label: string
@@ -21,15 +21,15 @@ export interface SelectProps extends ComponentProps<typeof Select> {
 }
 
 export interface SelectItemProps extends ComponentProps<typeof ListBoxItem> {
-  icon?: MaterialIconProps['icon']
+  icon?: MaterialIconProps["icon"]
   children: string
 }
 
 export interface SelectFilterProps extends ComponentProps<typeof ComboBox> {
-  autoComplete?: InputHTMLAttributes<HTMLInputElement>['autoComplete']
-  inputMode?: InputHTMLAttributes<HTMLInputElement>['inputMode']
-  icon?: MaterialIconProps['icon']
-  itemIcon?: MaterialIconProps['icon']
+  autoComplete?: InputHTMLAttributes<HTMLInputElement>["autoComplete"]
+  inputMode?: InputHTMLAttributes<HTMLInputElement>["inputMode"]
+  icon?: MaterialIconProps["icon"]
+  itemIcon?: MaterialIconProps["icon"]
   items: Item[]
   name: string
   label: string