From d2889610bfe27b9bfac13d56319210be42bbdc51 Mon Sep 17 00:00:00 2001
From: Barsnes <tobias.barsnes@digdir.no>
Date: Thu, 2 May 2024 08:20:48 +0200
Subject: [PATCH] rename css

---
 packages/css/fieldset.css                     | 18 +++++++--------
 .../src/components/form/Fieldset/Fieldset.tsx | 22 ++++++++++---------
 2 files changed, 21 insertions(+), 19 deletions(-)

diff --git a/packages/css/fieldset.css b/packages/css/fieldset.css
index 78e12ad8bb..5bf867058c 100644
--- a/packages/css/fieldset.css
+++ b/packages/css/fieldset.css
@@ -1,41 +1,41 @@
 @layer fds.fieldset {
-  .fieldset {
+  .fds-fieldset {
     margin: 0;
     padding: 0;
     border: 0;
     min-width: 0;
   }
 
-  .withSpacing {
+  .fds-fieldset--spacing {
     display: flex;
     flex-direction: column;
     gap: var(--fds-spacing-2);
   }
 
-  .description {
+  .fds-fieldset__description {
     color: var(--fds-semantic-text-neutral-subtle);
     font-weight: 400;
   }
 
-  .legend {
+  .fds-fieldset__legend {
     display: contents;
   }
 
-  .readonly .legendContent {
+  .fds-fieldset--readonly .fds-fieldset__legend__content {
     display: inline-flex;
   }
 
-  .readonly .padlock {
+  .fds-fieldset--readonly .fds-fieldset__padlock {
     height: 1.2em;
     width: 1.2em;
   }
 
-  .disabled .legend,
-  .disabled .description {
+  .fds-fieldset--disabled .fds-fieldset__legend,
+  .fds-fieldset--disabled .fds-fieldset__description {
     color: var(--fds-semantic-border-neutral-subtle);
   }
 
-  .errorWrapper {
+  .fds-fieldset__error {
     display: contents;
   }
 }
diff --git a/packages/react/src/components/form/Fieldset/Fieldset.tsx b/packages/react/src/components/form/Fieldset/Fieldset.tsx
index a4fe10ce50..48cd997709 100644
--- a/packages/react/src/components/form/Fieldset/Fieldset.tsx
+++ b/packages/react/src/components/form/Fieldset/Fieldset.tsx
@@ -7,7 +7,6 @@ import { Label, Paragraph, ErrorMessage } from '../../Typography';
 import type { FormFieldProps } from '../useFormField';
 
 import { useFieldset } from './useFieldset';
-import classes from './Fieldset.module.css';
 import { FieldsetContext } from './FieldsetContext';
 
 export type FieldsetProps = {
@@ -57,10 +56,10 @@ export const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(
         <fieldset
           {...fieldsetProps}
           className={cl(
-            classes.fieldset,
-            !hideLegend && classes.withSpacing,
-            readOnly && classes.readonly,
-            props?.disabled && classes.disabled,
+            'fds-fieldset',
+            !hideLegend && 'fds-fieldset--spacing',
+            readOnly && 'fds-fieldset--readonly',
+            props?.disabled && 'fds-fieldset--disabled',
             className,
           )}
           ref={ref}
@@ -70,16 +69,16 @@ export const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(
             asChild
             size={size}
           >
-            <legend className={classes.legend}>
+            <legend className={'fds-fieldset__legend'}>
               <span
                 className={cl(
-                  classes.legendContent,
+                  'fds-fieldset__legend__content',
                   hideLegend && `fds-sr-only`,
                 )}
               >
                 {readOnly && (
                   <PadlockLockedFillIcon
-                    className={classes.padlock}
+                    className={'fds-fieldset__padlock'}
                     aria-hidden
                   />
                 )}
@@ -95,7 +94,10 @@ export const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(
             >
               <div
                 id={descriptionId}
-                className={cl(classes.description, hideLegend && `fds-sr-only`)}
+                className={cl(
+                  'fds-fieldset__description',
+                  hideLegend && `fds-sr-only`,
+                )}
               >
                 {description}
               </div>
@@ -106,7 +108,7 @@ export const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(
             id={errorId}
             aria-live='polite'
             aria-relevant='additions removals'
-            className={classes.errorWrapper}
+            className={'fds-fieldset__error'}
           >
             {hasError && <ErrorMessage size={size}>{error}</ErrorMessage>}
           </div>