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
This commit is contained in:
Rasmus Langvad
2026-01-07 12:45:50 +00:00
parent 932413412b
commit d0546926a9
500 changed files with 18367 additions and 18419 deletions

View File

@@ -1,10 +1,10 @@
/* eslint-disable formatjs/no-literal-string-in-jsx */
import { useState } from 'react'
import copy from 'copy-to-clipboard'
import { useState } from "react"
import copy from "copy-to-clipboard"
import { kebabify } from '../../generate/utils'
import { kebabify } from "../../generate/utils"
export type ThemeValue = Record<'resolved' | 'alias', string | number>
export type ThemeValue = Record<"resolved" | "alias", string | number>
export type Theme = Record<string, ThemeValue>
@@ -20,7 +20,7 @@ export type ColorsProps = {
defaultThemeName?: string
}
import styles from './colors.module.css'
import styles from "./colors.module.css"
function getContrastColor(bgColor: string) {
const r = parseInt(bgColor.substring(1, 3), 16)
@@ -34,12 +34,12 @@ function getContrastColor(bgColor: string) {
const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255
if (luminance > 0.5) {
return '#000'
return "#000"
} else {
if (a < 255 / 2) {
return '#000'
return "#000"
}
return '#fff'
return "#fff"
}
}
@@ -62,7 +62,7 @@ export function Colors({
defaultThemeName,
}: ColorsProps) {
const [selectedThemeName, setSelectedThemeName] = useState<string>(
defaultThemeName || themes?.[0]?.name || ''
defaultThemeName || themes?.[0]?.name || ""
)
const [, setCopiedKey] = useState<string | null>(null)
@@ -78,8 +78,8 @@ export function Colors({
const grouping: Record<string, Theme> = {}
for (const [k, v] of Object.entries(currentTheme)) {
if (typeof v.resolved === 'string' && v.resolved.startsWith('#')) {
const key = k.replace(/\/[^/]+$/, '')
if (typeof v.resolved === "string" && v.resolved.startsWith("#")) {
const key = k.replace(/\/[^/]+$/, "")
if (!grouping[key]) {
grouping[key] = {}
}
@@ -120,8 +120,8 @@ export function Colors({
onChange={(e) => {
const el = document.getElementById(e.target.value)
el?.scrollIntoView({
behavior: 'smooth',
block: 'start',
behavior: "smooth",
block: "start",
})
}}
>

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { CornerRadius } from './CornerRadius'
import { CornerRadius } from "./CornerRadius"
import { base } from '../../lib/tokens'
import { base } from "../../lib/tokens"
<Meta title="Tokens/Corner Radius" />

View File

@@ -1,9 +1,9 @@
/* eslint-disable formatjs/no-literal-string-in-jsx */
import copy from 'copy-to-clipboard'
import copy from "copy-to-clipboard"
import { kebabify } from '../../generate/utils'
import { kebabify } from "../../generate/utils"
import tableStyles from './tokens.module.css'
import tableStyles from "./tokens.module.css"
type ThemeValue = {
resolved: string | number
@@ -24,15 +24,15 @@ export function CornerRadius({ theme }: CornerRadiusProps) {
// Filter corner radius tokens
const cornerRadiusTokens: Theme = {}
for (const [k, v] of Object.entries(theme)) {
if (k.startsWith('Corner radius/')) {
if (k.startsWith("Corner radius/")) {
cornerRadiusTokens[k] = v as ThemeValue
}
}
// Sort by value
const sortedTokens = Object.entries(cornerRadiusTokens).sort((a, b) => {
const aValue = typeof a[1].resolved === 'number' ? a[1].resolved : 0
const bValue = typeof b[1].resolved === 'number' ? b[1].resolved : 0
const aValue = typeof a[1].resolved === "number" ? a[1].resolved : 0
const bValue = typeof b[1].resolved === "number" ? b[1].resolved : 0
return aValue - bValue
})
@@ -51,7 +51,7 @@ export function CornerRadius({ theme }: CornerRadiusProps) {
</thead>
<tbody>
{sortedTokens.map(([k, v]) => {
const value = typeof v.resolved === 'number' ? v.resolved : 0
const value = typeof v.resolved === "number" ? v.resolved : 0
const valuePx = `${value}px`
return (

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Shadow } from './Shadow'
import { Shadow } from "./Shadow"
import { base } from '../../lib/tokens'
import { base } from "../../lib/tokens"
<Meta title="Tokens/Shadow" />

View File

@@ -1,9 +1,9 @@
/* eslint-disable formatjs/no-literal-string-in-jsx */
import copy from 'copy-to-clipboard'
import copy from "copy-to-clipboard"
import { kebabify } from '../../generate/utils'
import { kebabify } from "../../generate/utils"
import tableStyles from './tokens.module.css'
import tableStyles from "./tokens.module.css"
type ThemeValue = {
resolved: string | number
@@ -24,15 +24,15 @@ export function Shadow({ theme }: ShadowProps) {
// Filter shadow tokens
const shadowTokens: Theme = {}
for (const [k, v] of Object.entries(theme)) {
if (k.startsWith('BoxShadow-')) {
if (k.startsWith("BoxShadow-")) {
shadowTokens[k] = v as ThemeValue
}
}
// Sort by level
const sortedTokens = Object.entries(shadowTokens).sort((a, b) => {
const aLevel = parseInt(a[0].match(/\d+/)?.[0] || '0')
const bLevel = parseInt(b[0].match(/\d+/)?.[0] || '0')
const aLevel = parseInt(a[0].match(/\d+/)?.[0] || "0")
const bLevel = parseInt(b[0].match(/\d+/)?.[0] || "0")
return aLevel - bLevel
})
@@ -53,8 +53,8 @@ export function Shadow({ theme }: ShadowProps) {
<tbody>
{sortedTokens.map(([k, v]) => {
const shadowValue =
typeof v.resolved === 'string' ? v.resolved : ''
const level = k.match(/\d+/)?.[0] || '0'
typeof v.resolved === "string" ? v.resolved : ""
const level = k.match(/\d+/)?.[0] || "0"
return (
<tr key={k} className={tableStyles.tableRow}>
@@ -80,8 +80,8 @@ export function Shadow({ theme }: ShadowProps) {
}}
title="Click to copy"
style={{
fontSize: '0.75rem',
wordBreak: 'break-all',
fontSize: "0.75rem",
wordBreak: "break-all",
}}
>
{shadowValue}

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Spacing } from './Spacing'
import { Spacing } from "./Spacing"
import { base } from '../../lib/tokens'
import { base } from "../../lib/tokens"
<Meta title="Tokens/Spacing" />

View File

@@ -1,9 +1,9 @@
/* eslint-disable formatjs/no-literal-string-in-jsx */
import copy from 'copy-to-clipboard'
import copy from "copy-to-clipboard"
import { kebabify } from '../../generate/utils'
import { kebabify } from "../../generate/utils"
import tableStyles from './tokens.module.css'
import tableStyles from "./tokens.module.css"
type ThemeValue = {
resolved: string | number
@@ -24,15 +24,15 @@ function copyToClipboard(text: string) {
function getBaseUnitMultiplier(tokenName: string): string {
// Token names are like "Space/x0", "Space/x025", "Space/x05", "Space/x1", "Space/x15", etc.
const match = tokenName.match(/Space\/x(\d+)/)
if (!match) return '0x'
if (!match) return "0x"
const num = match[1]
// Handle special cases
if (num === '0') return '0x'
if (num === '025') return '0.25x'
if (num === '05') return '0.5x'
if (num === '15') return '1.5x'
if (num === "0") return "0x"
if (num === "025") return "0.25x"
if (num === "05") return "0.5x"
if (num === "15") return "1.5x"
// For other numbers, they're already the multiplier (x1 = 1x, x2 = 2x, etc.)
return `${num}x`
@@ -42,15 +42,15 @@ export function Spacing({ theme }: SpacingProps) {
// Filter spacing tokens
const spacingTokens: Theme = {}
for (const [k, v] of Object.entries(theme)) {
if (k.startsWith('Space/')) {
if (k.startsWith("Space/")) {
spacingTokens[k] = v as ThemeValue
}
}
// Sort by value
const sortedTokens = Object.entries(spacingTokens).sort((a, b) => {
const aValue = typeof a[1].resolved === 'number' ? a[1].resolved : 0
const bValue = typeof b[1].resolved === 'number' ? b[1].resolved : 0
const aValue = typeof a[1].resolved === "number" ? a[1].resolved : 0
const bValue = typeof b[1].resolved === "number" ? b[1].resolved : 0
return aValue - bValue
})
@@ -72,7 +72,7 @@ export function Spacing({ theme }: SpacingProps) {
</thead>
<tbody>
{sortedTokens.map(([k, v]) => {
const value = typeof v.resolved === 'number' ? v.resolved : 0
const value = typeof v.resolved === "number" ? v.resolved : 0
const valuePx = `${value}px`
const multiplier = getBaseUnitMultiplier(k)
@@ -112,7 +112,7 @@ export function Spacing({ theme }: SpacingProps) {
className={tableStyles.visualBar}
style={{
width: `${value}px`,
minWidth: value > 0 ? '2px' : '0',
minWidth: value > 0 ? "2px" : "0",
}}
/>
</div>

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from './Colors'
import { Colors } from "./Colors"
import { base } from '../../lib/tokens'
import { base } from "../../lib/tokens"
<Meta title="Tokens/Colors/Base" />

View File

@@ -170,7 +170,7 @@
}
.colorValue {
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
font-size: 0.875rem;
font-weight: 600;
padding: 0.5rem 1rem;
@@ -203,7 +203,7 @@
}
.tokenCode {
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
font-size: 12px;
background: #f9fafb;
padding: 0.375rem 0.625rem;

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { downtownCamper } from '../../../lib/tokens'
import { downtownCamper } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Downtown Camper" />

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { grandHotel } from '../../../lib/tokens'
import { grandHotel } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Grand Hotel" />

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { haymarket } from '../../../lib/tokens'
import { haymarket } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Haymarket" />

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { hotelNorge } from '../../../lib/tokens'
import { hotelNorge } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Hotel Norge" />

View File

@@ -1,6 +1,6 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import {
base,
@@ -12,7 +12,7 @@ import {
hotelNorge,
grandHotel,
theDock,
} from '../../../lib/tokens'
} from "../../../lib/tokens"
<Meta title="Tokens/Colors" />
@@ -22,19 +22,19 @@ Select a theme to view all available color tokens. Click on any value to copy it
<Colors
themes={[
{ name: 'base', displayName: 'Base', theme: base },
{ name: 'scandic', displayName: 'Scandic', theme: scandic },
{ name: 'scandicGo', displayName: 'Scandic Go', theme: scandicGo },
{ name: "base", displayName: "Base", theme: base },
{ name: "scandic", displayName: "Scandic", theme: scandic },
{ name: "scandicGo", displayName: "Scandic Go", theme: scandicGo },
{
name: 'downtownCamper',
displayName: 'Downtown Camper',
name: "downtownCamper",
displayName: "Downtown Camper",
theme: downtownCamper,
},
{ name: 'haymarket', displayName: 'Haymarket', theme: haymarket },
{ name: 'marski', displayName: 'Marski', theme: marski },
{ name: 'hotelNorge', displayName: 'Hotel Norge', theme: hotelNorge },
{ name: 'grandHotel', displayName: 'Grand Hotel', theme: grandHotel },
{ name: 'theDock', displayName: 'The Dock', theme: theDock },
{ name: "haymarket", displayName: "Haymarket", theme: haymarket },
{ name: "marski", displayName: "Marski", theme: marski },
{ name: "hotelNorge", displayName: "Hotel Norge", theme: hotelNorge },
{ name: "grandHotel", displayName: "Grand Hotel", theme: grandHotel },
{ name: "theDock", displayName: "The Dock", theme: theDock },
]}
defaultThemeName="scandic"
/>

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { marski } from '../../../lib/tokens'
import { marski } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Marski" />

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { scandic } from '../../../lib/tokens'
import { scandic } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Scandic" />

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { scandicGo } from '../../../lib/tokens'
import { scandicGo } from "../../../lib/tokens"
<Meta title="Tokens/Colors/Scandic Go" />

View File

@@ -1,8 +1,8 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
import { Colors } from '../Colors'
import { Colors } from "../Colors"
import { theDock } from '../../../lib/tokens'
import { theDock } from "../../../lib/tokens"
<Meta title="Tokens/Colors/The Dock" />

View File

@@ -1,4 +1,4 @@
import { Meta } from '@storybook/addon-docs/blocks'
import { Meta } from "@storybook/addon-docs/blocks"
<Meta title="Introduction" />

View File

@@ -57,7 +57,7 @@
}
.tokenName {
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
background: #f3f4f6;
padding: 0.25rem 0.5rem;
border-radius: 4px;
@@ -73,7 +73,7 @@
}
.value {
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
color: #6b7280;
cursor: pointer;
transition: color 0.15s ease;
@@ -98,7 +98,7 @@
}
.visualBarLabel {
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', monospace;
font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
font-size: 0.75rem;
color: #6b7280;
min-width: 40px;