From e48612fdbb4be91a3d525d11404d45ae7ce529cc Mon Sep 17 00:00:00 2001 From: barsnes Date: Thu, 15 Aug 2024 08:41:27 +0200 Subject: [PATCH 1/4] chore: remove all double equals --- .../testside/FullBaseTest/FullBaseTest.tsx | 4 ++-- .../components/ColorPicker/ColorPicker.tsx | 10 +++++----- biome.jsonc | 3 +-- packages/cli/src/colors/colorUtils.ts | 20 +++++++++---------- .../react/src/components/Tabs/TabContent.tsx | 2 +- packages/react/src/components/Tabs/useTab.ts | 2 +- .../ToggleGroupItem/useToggleGroupitem.ts | 2 +- .../utilities/RovingFocus/RovingFocusItem.tsx | 2 +- 8 files changed, 22 insertions(+), 23 deletions(-) diff --git a/apps/theme/app/testside/FullBaseTest/FullBaseTest.tsx b/apps/theme/app/testside/FullBaseTest/FullBaseTest.tsx index 5032d013d7..3a9ab86278 100644 --- a/apps/theme/app/testside/FullBaseTest/FullBaseTest.tsx +++ b/apps/theme/app/testside/FullBaseTest/FullBaseTest.tsx @@ -104,10 +104,10 @@ export const FullBaseTest = () => { let bgDefault = blueColors[99]; let bgSubtle = blueColors[95]; - if (theme == 'dark') { + if (theme === 'dark') { bgDefault = blueColors[9]; bgSubtle = blueColors[13]; - } else if (theme == 'contrast') { + } else if (theme === 'contrast') { bgDefault = blueColors[0]; bgSubtle = blueColors[5]; } diff --git a/apps/theme/components/ColorPicker/ColorPicker.tsx b/apps/theme/components/ColorPicker/ColorPicker.tsx index 2113a1054a..59e2652338 100644 --- a/apps/theme/components/ColorPicker/ColorPicker.tsx +++ b/apps/theme/components/ColorPicker/ColorPicker.tsx @@ -54,8 +54,8 @@ export const ColorPicker = ({ className={cl( classes.status, 'ds-focus', - colorError == 'decorative' && classes.statusYellow, - colorError == 'interaction' && classes.statusOrange, + colorError === 'decorative' && classes.statusYellow, + colorError === 'interaction' && classes.statusOrange, )} > {colorError === 'none' && ( @@ -64,7 +64,7 @@ export const ColorPicker = ({ {colorError === 'decorative' && ( )} - {colorError == 'interaction' && ( + {colorError === 'interaction' && ( )} @@ -75,14 +75,14 @@ export const ColorPicker = ({ 'Denne fargen har god nok kontrast og kan brukes normalt i systemet.'}
- {colorError == 'decorative' && ( + {colorError === 'decorative' && (
Vær oppmerksom på at Base Default fargen har mindre enn 3:1 kontrast mot bakgrunnsfargene. Se alle kontrastgrensene inne på hver farge.
)} - {colorError == 'interaction' && ( + {colorError === 'interaction' && (
Base Default fargen har ikke god nok kontrast mot hvit eller svart tekst på tvers av Base fargene. diff --git a/biome.jsonc b/biome.jsonc index 2f9cb075bf..c3aa4b9999 100644 --- a/biome.jsonc +++ b/biome.jsonc @@ -74,8 +74,7 @@ "useSelfClosingElements": "off" }, "suspicious": { - "noArrayIndexKey": "off", - "noDoubleEquals": "off" // TODO: Enable this rule + "noArrayIndexKey": "off" }, "performance": { "noAccumulatingSpread": "off" // TODO: Enable this rule diff --git a/packages/cli/src/colors/colorUtils.ts b/packages/cli/src/colors/colorUtils.ts index 4077dda2d0..f4f398340d 100644 --- a/packages/cli/src/colors/colorUtils.ts +++ b/packages/cli/src/colors/colorUtils.ts @@ -29,7 +29,7 @@ export const hexToCssHsl = (hex: string, valuesOnly = false) => { let h = 0; let s = 0; let l = (max + min) / 2; - if (max == min) { + if (max === min) { h = s = 0; // achromatic } else { const d = max - min; @@ -68,11 +68,11 @@ export const hexToHSL = (H: string) => { let r = 0; let g = 0; let b = 0; - if (H.length == 4) { + if (H.length === 4) { r = parseInt('0x' + H[1] + H[1]); g = parseInt('0x' + H[2] + H[2]); b = parseInt('0x' + H[3] + H[3]); - } else if (H.length == 7) { + } else if (H.length === 7) { r = parseInt('0x' + H[1] + H[2]); g = parseInt('0x' + H[3] + H[4]); b = parseInt('0x' + H[5] + H[6]); @@ -88,9 +88,9 @@ export const hexToHSL = (H: string) => { const cmax = Math.max(r, g, b); const delta = cmax - cmin; - if (delta == 0) h = 0; - else if (cmax == r) h = ((g - b) / delta) % 6; - else if (cmax == g) h = (b - r) / delta + 2; + if (delta === 0) h = 0; + else if (cmax === r) h = ((g - b) / delta) % 6; + else if (cmax === g) h = (b - r) / delta + 2; else h = (r - g) / delta + 4; h = Math.round(h * 60); @@ -98,7 +98,7 @@ export const hexToHSL = (H: string) => { if (h < 0) h += 360; l = (cmax + cmin) / 2; - s = delta == 0 ? 0 : delta / (1 - Math.abs(2 * l - 1)); + s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1)); s = +(s * 100).toFixed(1); l = +(l * 100).toFixed(1); @@ -178,9 +178,9 @@ export const HSLToHex = (h: number, s: number, l: number) => { b = parseInt(Math.round((b + m) * 255).toString(16), 16); // Prepend 0s, if necessary - if (r.toString().length == 1) r = parseInt('0' + r.toString(), 10); - if (g.toString().length == 1) g = parseInt('0' + g.toString(), 10); - if (b.toString().length == 1) b = parseInt('0' + b.toString(), 10); + if (r.toString().length === 1) r = parseInt('0' + r.toString(), 10); + if (g.toString().length === 1) g = parseInt('0' + g.toString(), 10); + if (b.toString().length === 1) b = parseInt('0' + b.toString(), 10); return '#' + r + g + b; }; diff --git a/packages/react/src/components/Tabs/TabContent.tsx b/packages/react/src/components/Tabs/TabContent.tsx index 7d67071a5f..4f3fdc3e6d 100644 --- a/packages/react/src/components/Tabs/TabContent.tsx +++ b/packages/react/src/components/Tabs/TabContent.tsx @@ -21,7 +21,7 @@ export type TabContentProps = { export const TabContent = forwardRef( ({ children, value, className, ...rest }, ref) => { const { value: tabsValue, size } = useContext(TabsContext); - const active = value == tabsValue; + const active = value === tabsValue; return ( <> diff --git a/packages/react/src/components/Tabs/useTab.ts b/packages/react/src/components/Tabs/useTab.ts index e18fb2cca6..c208418f71 100644 --- a/packages/react/src/components/Tabs/useTab.ts +++ b/packages/react/src/components/Tabs/useTab.ts @@ -22,7 +22,7 @@ export const useTabItem: UseTab = (props: TabProps) => { return { ...rest, id: buttonId, - 'aria-selected': tabs.value == value, + 'aria-selected': tabs.value === value, role: 'tab', size: tabs.size, onClick: () => { diff --git a/packages/react/src/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.ts b/packages/react/src/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.ts index 8fc1c6cfa7..76a22ed693 100644 --- a/packages/react/src/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.ts +++ b/packages/react/src/components/ToggleGroup/ToggleGroupItem/useToggleGroupitem.ts @@ -24,7 +24,7 @@ export const useToggleGroupItem: UseToggleGroupItem = ( const genValue = useId(); const toggleGroup = useContext(ToggleGroupContext); const value = props.value ?? genValue; - const active = toggleGroup.value == value; + const active = toggleGroup.value === value; const buttonId = `togglegroup-item-${useId()}`; return { diff --git a/packages/react/src/utilities/RovingFocus/RovingFocusItem.tsx b/packages/react/src/utilities/RovingFocus/RovingFocusItem.tsx index 6bbf0f97d7..b590ffa790 100644 --- a/packages/react/src/utilities/RovingFocus/RovingFocusItem.tsx +++ b/packages/react/src/utilities/RovingFocus/RovingFocusItem.tsx @@ -42,7 +42,7 @@ export const RovingFocusItem = forwardRef( const Component = asChild ? Slot : 'div'; const focusValue = - value ?? (typeof rest.children == 'string' ? rest.children : ''); + value ?? (typeof rest.children === 'string' ? rest.children : ''); const { getOrderedItems, getRovingProps, orientation } = useRovingFocus(focusValue); From f6f65f3a098d6019d095cfeea569d889055a1f95 Mon Sep 17 00:00:00 2001 From: Michael Marszalek Date: Thu, 15 Aug 2024 09:00:40 +0200 Subject: [PATCH 2/4] Create thin-icons-pay.md --- .changeset/thin-icons-pay.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/thin-icons-pay.md diff --git a/.changeset/thin-icons-pay.md b/.changeset/thin-icons-pay.md new file mode 100644 index 0000000000..de04c1dccf --- /dev/null +++ b/.changeset/thin-icons-pay.md @@ -0,0 +1,6 @@ +--- +"@digdir/designsystemet-react": patch +--- + +ToggleGroup: Active item check now adhers to value type +Tabs: Active item check now adhers to value type From beeb903d409e3cec0dbbd2110d760796967c9282 Mon Sep 17 00:00:00 2001 From: Michael Marszalek Date: Thu, 15 Aug 2024 09:07:49 +0200 Subject: [PATCH 3/4] reworded --- .changeset/thin-icons-pay.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.changeset/thin-icons-pay.md b/.changeset/thin-icons-pay.md index de04c1dccf..ba814dc834 100644 --- a/.changeset/thin-icons-pay.md +++ b/.changeset/thin-icons-pay.md @@ -2,5 +2,5 @@ "@digdir/designsystemet-react": patch --- -ToggleGroup: Active item check now adhers to value type -Tabs: Active item check now adhers to value type +ToggleGroup: Active item equality check is now strict +Tabs: Active item equality check is now strict From b6c6a21b11199089da625f603a55177c73e45762 Mon Sep 17 00:00:00 2001 From: barsnes Date: Thu, 15 Aug 2024 09:12:21 +0200 Subject: [PATCH 4/4] fix biome config --- biome.jsonc | 3 --- 1 file changed, 3 deletions(-) diff --git a/biome.jsonc b/biome.jsonc index baa01b6a09..7d452748a4 100644 --- a/biome.jsonc +++ b/biome.jsonc @@ -75,9 +75,6 @@ }, "suspicious": { "noArrayIndexKey": "off" - }, - "performance": { - "noArrayIndexKey": "off", } }, "ignore": []