@digdir/designsystemet-react 0.56.1-alpha.0 → 0.56.2

package/dist/esm/components/form/Textarea/useTextarea.js

@@ -1,7 +1,7 @@
 'use client';
 import { useContext } from 'react';
 import { useFormField } from '../useFormField.js';
-import { FieldsetContext } from '../Fieldset/Fieldset.js';
+import { FieldsetContext } from '../Fieldset/FieldsetContext.js';
 
 /** Handles props for `Textarea` in context with `Fieldset` */
 const useTextarea = (props) => {

package/dist/esm/components/form/Textfield/useTextfield.js

@@ -1,7 +1,7 @@
 'use client';
 import { useContext } from 'react';
 import { useFormField } from '../useFormField.js';
-import { FieldsetContext } from '../Fieldset/Fieldset.js';
+import { FieldsetContext } from '../Fieldset/FieldsetContext.js';
 
 /** Handles props for `Textfield` in context with `Fieldset` */
 const useTextfield = (props) => {

package/dist/esm/components/form/useFormField.js

@@ -1,7 +1,7 @@
 'use client';
 import { useContext, useId } from 'react';
 import { clsx } from '../../node_modules/clsx/dist/clsx.js';
-import { FieldsetContext } from './Fieldset/Fieldset.js';
+import { FieldsetContext } from './Fieldset/FieldsetContext.js';
 
 /**
  * Handles props and their state for various form-fields in context with Fieldset

package/dist/esm/index.js

@@ -39,7 +39,7 @@ export { Checkbox } from './components/form/Checkbox/index.js';
 export { CheckboxGroup } from './components/form/Checkbox/Group/Group.js';
 export { Radio } from './components/form/Radio/index.js';
 export { RadioGroup } from './components/form/Radio/Group/Group.js';
-export { Fieldset, FieldsetContext } from './components/form/Fieldset/Fieldset.js';
+export { Fieldset } from './components/form/Fieldset/Fieldset.js';
 export { Switch } from './components/form/Switch/Switch.js';
 export { Textfield } from './components/form/Textfield/Textfield.js';
 export { Textarea } from './components/form/Textarea/Textarea.js';

package/dist/esm/react-css-modules.css

@@ -1119,46 +1119,6 @@
   align-items: center;
 }
 
-.fds-fieldset-fieldset-2b3c05fc {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  min-width: 0;
-}
-
-.fds-fieldset-withSpacing-2b3c05fc {
-  display: flex;
-  flex-direction: column;
-  gap: var(--fds-spacing-2);
-}
-
-.fds-fieldset-description-2b3c05fc {
-  color: var(--fds-semantic-text-neutral-subtle);
-  font-weight: 400;
-}
-
-.fds-fieldset-legend-2b3c05fc {
-  display: contents;
-}
-
-.fds-fieldset-readonly-2b3c05fc .fds-fieldset-legendContent-2b3c05fc {
-  display: inline-flex;
-}
-
-.fds-fieldset-readonly-2b3c05fc .fds-fieldset-padlock-2b3c05fc {
-  height: 1.2em;
-  width: 1.2em;
-}
-
-.fds-fieldset-disabled-2b3c05fc .fds-fieldset-legend-2b3c05fc,
-.fds-fieldset-disabled-2b3c05fc .fds-fieldset-description-2b3c05fc {
-  color: var(--fds-semantic-border-neutral-subtle);
-}
-
-.fds-fieldset-errorWrapper-2b3c05fc {
-  display: contents;
-}
-
 .fds-tag-tag-40d841d9 {
   --fdsc-tag-background: var(--fds-semantic-surface-neutral-subtle);
   --fdsc-tag-text: var(--fds-semantic-text-neutral-default);
@@ -1513,75 +1473,93 @@
   --fds-checkbox-focus-border-width: 3px;
   --fds-checkbox-background: var(--fds-semantic-background-default);
   --fds-checkbox-border-color: var(--fds-semantic-border-input-default);
-  --fds-checkbox-border__hover: 0 0 0 6px var(--fds-semantic-surface-info-subtle-hover);
+  --fds-checkbox-border__hover: 0 0 0 calc((2.75rem - var(--fds-checkbox-size)) / 2) var(--fds-semantic-surface-info-subtle-hover);
 
-  position: relative;
+  display: grid;
 }
 
-.fds-checkbox-label-ad9a8b9c {
-  min-height: var(--fds-sizing-10);
-  min-width: min-content;
-  display: inline-flex;
-  flex-direction: row;
-  gap: var(--fds-spacing-1);
-  align-items: center;
-  cursor: pointer;
+.fds-checkbox-container-ad9a8b9c:has(.fds-checkbox-label-ad9a8b9c) {
+  grid-template-columns: var(--fds-checkbox-size) auto;
+  gap: var(--fds-spacing-2);
 }
 
 /* Checkbox */
-.fds-checkbox-label-ad9a8b9c::before {
-  content: '';
+.fds-checkbox-input-ad9a8b9c {
+  position: relative;
   width: var(--fds-checkbox-size);
   height: var(--fds-checkbox-size);
+  z-index: 1;
+  appearance: none;
+  margin: 0;
+  align-self: center;
+  outline: none;
+  cursor: pointer;
   box-shadow: inset 0 0 0 2px var(--fds-checkbox-border-color);
   background: var(--fds-checkbox-background);
-  flex-shrink: 0;
-  margin-inline: 6px;
-  margin-block: 6px;
   border-radius: var(--fds-border_radius-medium);
 }
 
-.fds-checkbox-description-ad9a8b9c {
-  padding-left: calc(var(--fds-checkbox-size) + 12px + var(--fds-spacing-1));
-  margin-top: calc(var(--fds-spacing-2) * -1);
-  color: var(--fds-semantic-text-neutral-subtle);
-}
-
-.fds-checkbox-input-ad9a8b9c {
+.fds-checkbox-input-ad9a8b9c::before {
   position: absolute;
+  content: '';
+  display: block;
   width: 2.75rem;
   height: 2.75rem;
-  z-index: 1;
-  opacity: 0;
+  transform: translate(-50%, -50%);
+  top: 50%;
+  left: 50%;
+  cursor: pointer;
+  border-radius: var(--fds-border_radius-medium);
+}
+
+.fds-checkbox-label-ad9a8b9c {
+  min-height: var(--fds-sizing-10);
+  min-width: min-content;
+  display: inline-flex;
+  flex-direction: row;
+  gap: var(--fds-spacing-1);
+  align-items: center;
   cursor: pointer;
-  margin: 0;
+}
+
+.fds-checkbox-description-ad9a8b9c {
+  margin-top: calc(var(--fds-spacing-3) * -1);
+  color: var(--fds-semantic-text-neutral-subtle);
+  grid-column: 2;
 }
 
 .fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-input-ad9a8b9c,
 .fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-label-ad9a8b9c,
-.fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-input-ad9a8b9c::before {
   cursor: not-allowed;
 }
 
 .fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-label-ad9a8b9c,
-.fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-label-ad9a8b9c::before,
+.fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-input-ad9a8b9c,
 .fds-checkbox-disabled-ad9a8b9c > .fds-checkbox-description-ad9a8b9c {
   opacity: var(--fds-opacity-disabled);
 }
 
-.fds-checkbox-input-ad9a8b9c:focus-visible + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-label-ad9a8b9c,
+.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c,
+.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c::before {
+  cursor: default;
+}
+
+.fds-checkbox-input-ad9a8b9c:focus-visible {
+  outline-offset: 0;
   outline: var(--fds-checkbox-focus-border-width) solid var(--fds-semantic-border-focus-outline);
   box-shadow: inset 0 0 0 var(--fds-checkbox-focus-border-width) var(--fds-semantic-border-focus-boxshadow);
 }
 
-.fds-checkbox-input-ad9a8b9c:checked + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-input-ad9a8b9c:checked {
   --fds-checkbox-border-color: var(--fds-semantic-border-input-hover);
 
   background: var(--fds-checkbox-border-color);
   background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M18.5509 6.32414C18.9414 6.71467 18.9414 7.34783 18.5509 7.73836L10.5821 15.7071C10.1916 16.0976 9.55842 16.0976 9.16789 15.7071L4.94914 11.4884C4.55862 11.0978 4.55862 10.4647 4.94914 10.0741C5.33967 9.68362 5.97283 9.68362 6.36336 10.0741L9.875 13.5858L17.1366 6.32414C17.5272 5.93362 18.1603 5.93362 18.5509 6.32414Z' fill='white'/%3E%3C/svg%3E%0A");
 }
 
-.fds-checkbox-input-ad9a8b9c:indeterminate + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-input-ad9a8b9c:indeterminate {
   --fds-checkbox-border-color: var(--fds-semantic-border-input-hover);
 
   background-color: var(--fds-checkbox-border-color);
@@ -1589,32 +1567,27 @@
   background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.25 11.25C4.25 10.4216 4.92157 9.75 5.75 9.75H16.75C17.5784 9.75 18.25 10.4216 18.25 11.25C18.25 12.0784 17.5784 12.75 16.75 12.75H5.75C4.92157 12.75 4.25 12.0784 4.25 11.25Z' fill='white' /%3E%3C/svg%3E%0A");
 }
 
-.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c {
   --fds-checkbox-border-color: var(--fds-semantic-border-neutral-subtle);
   --fds-checkbox-background: var(--fds-semantic-surface-neutral-subtle);
 }
 
-.fds-checkbox-input-ad9a8b9c:checked:not(:focus-visible) + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-input-ad9a8b9c:checked:not(:focus-visible) {
   box-shadow: inset 0 0 0 2px var(--fds-checkbox-border-color);
 }
 
-.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c,
-.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-label-ad9a8b9c {
-  cursor: default;
-}
-
-.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c:checked + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c:checked {
   background: var(--fds-checkbox-background);
   background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M18.5509 6.32414C18.9414 6.71467 18.9414 7.34783 18.5509 7.73836L10.5821 15.7071C10.1916 16.0976 9.55842 16.0976 9.16789 15.7071L4.94914 11.4884C4.55862 11.0978 4.55862 10.4647 4.94914 10.0741C5.33967 9.68362 5.97283 9.68362 6.36336 10.0741L9.875 13.5858L17.1366 6.32414C17.5272 5.93362 18.1603 5.93362 18.5509 6.32414Z' fill='%2368707c'/%3E%3C/svg%3E%0A");
 }
 
-.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c:indeterminate + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-readonly-ad9a8b9c > .fds-checkbox-input-ad9a8b9c:indeterminate {
   background: var(--fds-checkbox-background);
   background-repeat: no-repeat;
   background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 23 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.25 11.25C4.25 10.4216 4.92157 9.75 5.75 9.75H16.75C17.5784 9.75 18.25 10.4216 18.25 11.25C18.25 12.0784 17.5784 12.75 16.75 12.75H5.75C4.92157 12.75 4.25 12.0784 4.25 11.25Z' fill='%2368707c' /%3E%3C/svg%3E%0A");
 }
 
-.fds-checkbox-error-ad9a8b9c > .fds-checkbox-input-ad9a8b9c:not(:disabled, :focus-visible) + .fds-checkbox-label-ad9a8b9c::before {
+.fds-checkbox-error-ad9a8b9c > .fds-checkbox-input-ad9a8b9c:not(:disabled, :focus-visible) {
   --fds-checkbox-border-color: var(--fds-semantic-border-danger-default);
 }
 
@@ -1626,71 +1599,81 @@
     color: var(--fds-semantic-text-action-hover);
   }
 
-  .fds-checkbox-container-ad9a8b9c:not(.fds-checkbox-readonly-ad9a8b9c, .fds-checkbox-disabled-ad9a8b9c) > .fds-checkbox-input-ad9a8b9c:hover:not(:checked) + .fds-checkbox-label-ad9a8b9c::before {
+  .fds-checkbox-container-ad9a8b9c:not(.fds-checkbox-readonly-ad9a8b9c, .fds-checkbox-disabled-ad9a8b9c) > .fds-checkbox-input-ad9a8b9c:hover:not(:checked) {
     --fds-checkbox-border-color: var(--fds-semantic-border-input-hover);
 
     box-shadow: var(--fds-checkbox-border__hover), inset 0 0 0 2px var(--fds-checkbox-border-color);
   }
 
-  .fds-checkbox-container-ad9a8b9c:not(.fds-checkbox-readonly-ad9a8b9c, .fds-checkbox-disabled-ad9a8b9c) > .fds-checkbox-input-ad9a8b9c:hover:checked + .fds-checkbox-label-ad9a8b9c::before {
+  .fds-checkbox-container-ad9a8b9c:not(.fds-checkbox-readonly-ad9a8b9c, .fds-checkbox-disabled-ad9a8b9c) > .fds-checkbox-input-ad9a8b9c:hover:checked {
     --fds-checkbox-border-color: var(--fds-semantic-border-input-hover);
 
     box-shadow: var(--fds-checkbox-border__hover), inset 0 0 0 2px var(--fds-checkbox-border-color);
   }
 
-  .fds-checkbox-container-ad9a8b9c:not(.fds-checkbox-readonly-ad9a8b9c, .fds-checkbox-disabled-ad9a8b9c) > .fds-checkbox-input-ad9a8b9c:hover:checked:focus-visible + .fds-checkbox-label-ad9a8b9c::before {
+  .fds-checkbox-container-ad9a8b9c:not(.fds-checkbox-readonly-ad9a8b9c, .fds-checkbox-disabled-ad9a8b9c) > .fds-checkbox-input-ad9a8b9c:hover:checked:focus-visible {
     box-shadow: var(--fds-checkbox-border__hover), inset 0 0 0 var(--fds-checkbox-focus-border-width) var(--fds-semantic-border-focus-boxshadow);
   }
 }
 
 /** Sizing */
 
-.fds-checkbox-small-ad9a8b9c,
-.fds-checkbox-small-ad9a8b9c .fds-checkbox-label-ad9a8b9c {
+.fds-checkbox-small-ad9a8b9c {
+  --fds-checkbox-size: 1.5rem;
+
   min-height: var(--fds-sizing-8);
 }
 
-.fds-checkbox-medium-ad9a8b9c,
-.fds-checkbox-medium-ad9a8b9c .fds-checkbox-label-ad9a8b9c {
+.fds-checkbox-medium-ad9a8b9c {
+  --fds-checkbox-size: 1.75rem;
+
   min-height: var(--fds-sizing-10);
 }
 
-.fds-checkbox-large-ad9a8b9c,
-.fds-checkbox-large-ad9a8b9c .fds-checkbox-label-ad9a8b9c {
+.fds-checkbox-large-ad9a8b9c {
+  --fds-checkbox-size: 2rem;
+
   min-height: var(--fds-sizing-12);
 }
 
-.fds-checkbox-small-ad9a8b9c {
-  --fds-checkbox-size: 1.5rem;
-
-  min-width: var(--fds-sizing-8);
+.fds-fieldset-fieldset-2b3c05fc {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  min-width: 0;
 }
 
-.fds-checkbox-small-ad9a8b9c .fds-checkbox-input-ad9a8b9c {
-  left: -0.25rem;
-  top: -0.25rem;
+.fds-fieldset-withSpacing-2b3c05fc {
+  display: flex;
+  flex-direction: column;
+  gap: var(--fds-spacing-2);
 }
 
-.fds-checkbox-medium-ad9a8b9c {
-  --fds-checkbox-size: 1.75rem;
+.fds-fieldset-description-2b3c05fc {
+  color: var(--fds-semantic-text-neutral-subtle);
+  font-weight: 400;
+}
 
-  min-width: var(--fds-sizing-10);
+.fds-fieldset-legend-2b3c05fc {
+  display: contents;
 }
 
-.fds-checkbox-medium-ad9a8b9c .fds-checkbox-input-ad9a8b9c {
-  left: 0;
-  top: 0;
+.fds-fieldset-readonly-2b3c05fc .fds-fieldset-legendContent-2b3c05fc {
+  display: inline-flex;
 }
 
-.fds-checkbox-large-ad9a8b9c {
-  --fds-checkbox-size: 2rem;
+.fds-fieldset-readonly-2b3c05fc .fds-fieldset-padlock-2b3c05fc {
+  height: 1.2em;
+  width: 1.2em;
+}
 
-  min-width: var(--fds-sizing-12);
+.fds-fieldset-disabled-2b3c05fc .fds-fieldset-legend-2b3c05fc,
+.fds-fieldset-disabled-2b3c05fc .fds-fieldset-description-2b3c05fc {
+  color: var(--fds-semantic-border-neutral-subtle);
 }
 
-.fds-checkbox-large-ad9a8b9c .fds-checkbox-input-ad9a8b9c {
-  left: 0;
-  top: 0.25rem;
+.fds-fieldset-errorWrapper-2b3c05fc {
+  display: contents;
 }
 
 .fds-radio-container-7a9bd584 {
@@ -1698,92 +1681,105 @@
   --fds-radio-focus-border-width: 3px;
   --fds-radio-background: var(--fds-semantic-background-default);
   --fds-radio-border-color: var(--fds-semantic-border-input-default);
-  --fds-radio-border__hover: 0 0 0 6px var(--fds-semantic-surface-info-subtle-hover);
+  --fds-radio-border__hover: 0 0 0 calc((2.75rem - var(--fds-radio-size)) / 2) var(--fds-semantic-surface-info-subtle-hover);
 
-  position: relative;
+  display: grid;
 }
 
-.fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-10);
-  min-width: min-content;
-  display: inline-flex;
-  flex-direction: row;
-  gap: var(--fds-spacing-1);
-  align-items: center;
-  cursor: pointer;
+.fds-radio-container-7a9bd584:has(.fds-radio-label-7a9bd584) {
+  grid-template-columns: var(--fds-radio-size) auto;
+  gap: var(--fds-spacing-2);
 }
 
 /* Radio */
-.fds-radio-label-7a9bd584::before {
-  content: '';
+.fds-radio-input-7a9bd584 {
+  position: relative;
   width: var(--fds-radio-size);
   height: var(--fds-radio-size);
+  z-index: 1;
+  appearance: none;
+  outline: none;
+  cursor: pointer;
+  margin: 0;
+  align-self: center;
   box-shadow: inset 0 0 0 2px var(--fds-radio-border-color);
   background: var(--fds-radio-background);
   border-radius: 50%;
-  flex-shrink: 0;
-  margin-inline: 6px;
-  margin-block: 6px;
-}
-
-.fds-radio-description-7a9bd584 {
-  padding-left: calc(var(--fds-radio-size) + 12px + var(--fds-spacing-1));
-  margin-top: calc(var(--fds-spacing-2) * -1);
-  color: var(--fds-semantic-text-neutral-subtle);
 }
 
-.fds-radio-input-7a9bd584 {
+.fds-radio-input-7a9bd584::before {
   position: absolute;
+  content: '';
+  display: block;
   width: 2.75rem;
   height: 2.75rem;
-  z-index: 1;
-  opacity: 0;
+  transform: translate(-50%, -50%);
+  top: 50%;
+  left: 50%;
   cursor: pointer;
-  margin: 0;
+  border-radius: var(--fds-border_radius-medium);
+}
+
+.fds-radio-label-7a9bd584 {
+  min-height: var(--fds-sizing-10);
+  min-width: min-content;
+  display: inline-flex;
+  flex-direction: row;
+  gap: var(--fds-spacing-1);
+  align-items: center;
+  cursor: pointer;
+}
+
+.fds-radio-description-7a9bd584 {
+  margin-top: calc(var(--fds-spacing-3) * -1);
+  color: var(--fds-semantic-text-neutral-subtle);
+  grid-column: 2;
 }
 
 .fds-radio-disabled-7a9bd584 > .fds-radio-input-7a9bd584,
 .fds-radio-disabled-7a9bd584 > .fds-radio-label-7a9bd584,
-.fds-radio-disabled-7a9bd584 > .fds-radio-label-7a9bd584::before {
+.fds-radio-disabled-7a9bd584 > .fds-radio-input-7a9bd584::before {
   cursor: not-allowed;
 }
 
 .fds-radio-disabled-7a9bd584 > .fds-radio-label-7a9bd584,
-.fds-radio-disabled-7a9bd584 > .fds-radio-label-7a9bd584::before,
+.fds-radio-disabled-7a9bd584 > .fds-radio-input-7a9bd584,
 .fds-radio-disabled-7a9bd584 > .fds-radio-description-7a9bd584 {
   opacity: var(--fds-opacity-disabled);
 }
 
-.fds-radio-input-7a9bd584:focus-visible + .fds-radio-label-7a9bd584::before {
+.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584,
+.fds-radio-readonly-7a9bd584 > .fds-radio-label-7a9bd584,
+.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584::before {
+  cursor: default;
+}
+
+.fds-radio-input-7a9bd584:focus-visible {
+  outline-offset: 0;
   outline: var(--fds-radio-focus-border-width) solid var(--fds-semantic-border-focus-outline);
   box-shadow: inset 0 0 0 var(--fds-radio-focus-border-width) var(--fds-semantic-border-focus-boxshadow), inset 0 0 0 6px var(--fds-radio-background);
 }
 
-.fds-radio-input-7a9bd584:checked + .fds-radio-label-7a9bd584::before {
+.fds-radio-input-7a9bd584:checked {
   --fds-radio-border-color: var(--fds-semantic-border-input-hover);
 
   background: var(--fds-radio-border-color);
 }
 
-.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584 + .fds-radio-label-7a9bd584::before {
+.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584 {
   --fds-radio-border-color: var(--fds-semantic-border-neutral-subtle);
   --fds-radio-background: var(--fds-semantic-surface-neutral-subtle);
 }
 
-.fds-radio-input-7a9bd584:checked:not(:focus-visible) + .fds-radio-label-7a9bd584::before {
+.fds-radio-input-7a9bd584:checked:not(:focus-visible) {
   box-shadow: inset 0 0 0 2px var(--fds-radio-border-color), inset 0 0 0 6px var(--fds-radio-background);
 }
 
-.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584,
-.fds-radio-readonly-7a9bd584 > .fds-radio-label-7a9bd584 {
-  cursor: default;
-}
-
-.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584:checked + .fds-radio-label-7a9bd584::before {
+.fds-radio-readonly-7a9bd584 > .fds-radio-input-7a9bd584:checked {
   background: var(--fds-semantic-border-neutral-default);
 }
 
-.fds-radio-error-7a9bd584 > .fds-radio-input-7a9bd584:not(:disabled, :focus-visible) + .fds-radio-label-7a9bd584::before {
+.fds-radio-error-7a9bd584 > .fds-radio-input-7a9bd584:not(:disabled, :focus-visible) {
   --fds-radio-border-color: var(--fds-semantic-border-danger-default);
 }
 
@@ -1795,19 +1791,19 @@
     color: var(--fds-semantic-text-action-hover);
   }
 
-  .fds-radio-container-7a9bd584:not(.fds-radio-readonly-7a9bd584, .fds-radio-disabled-7a9bd584) > .fds-radio-input-7a9bd584:hover:not(:checked) + .fds-radio-label-7a9bd584::before {
+  .fds-radio-container-7a9bd584:not(.fds-radio-readonly-7a9bd584, .fds-radio-disabled-7a9bd584) > .fds-radio-input-7a9bd584:hover:not(:checked) {
     --fds-radio-border-color: var(--fds-semantic-border-input-hover);
 
     box-shadow: var(--fds-radio-border__hover), inset 0 0 0 2px var(--fds-radio-border-color);
   }
 
-  .fds-radio-container-7a9bd584:not(.fds-radio-readonly-7a9bd584, .fds-radio-disabled-7a9bd584) > .fds-radio-input-7a9bd584:hover:checked + .fds-radio-label-7a9bd584::before {
+  .fds-radio-container-7a9bd584:not(.fds-radio-readonly-7a9bd584, .fds-radio-disabled-7a9bd584) > .fds-radio-input-7a9bd584:hover:checked {
     --fds-radio-border-color: var(--fds-semantic-border-input-hover);
 
     box-shadow: var(--fds-radio-border__hover), inset 0 0 0 2px var(--fds-radio-border-color), inset 0 0 0 6px var(--fds-radio-background);
   }
 
-  .fds-radio-container-7a9bd584:not(.fds-radio-readonly-7a9bd584, .fds-radio-disabled-7a9bd584) > .fds-radio-input-7a9bd584:hover:checked:focus-visible + .fds-radio-label-7a9bd584::before {
+  .fds-radio-container-7a9bd584:not(.fds-radio-readonly-7a9bd584, .fds-radio-disabled-7a9bd584) > .fds-radio-input-7a9bd584:hover:checked:focus-visible {
     box-shadow: var(--fds-radio-border__hover), inset 0 0 0 var(--fds-radio-focus-border-width) var(--fds-semantic-border-focus-boxshadow),
       inset 0 0 0 6px var(--fds-radio-background);
   }
@@ -1815,52 +1811,22 @@
 
 /** Sizing */
 
-.fds-radio-small-7a9bd584,
-.fds-radio-small-7a9bd584 .fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-8);
-}
-
-.fds-radio-medium-7a9bd584,
-.fds-radio-medium-7a9bd584 .fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-10);
-}
-
-.fds-radio-large-7a9bd584,
-.fds-radio-large-7a9bd584 .fds-radio-label-7a9bd584 {
-  min-height: var(--fds-sizing-12);
-}
-
 .fds-radio-small-7a9bd584 {
   --fds-radio-size: 1.5rem;
 
-  min-width: var(--fds-sizing-8);
-}
-
-.fds-radio-small-7a9bd584 .fds-radio-input-7a9bd584 {
-  left: -0.25rem;
-  top: -0.25rem;
+  min-height: var(--fds-sizing-8);
 }
 
 .fds-radio-medium-7a9bd584 {
   --fds-radio-size: 1.75rem;
 
-  min-width: var(--fds-sizing-10);
-}
-
-.fds-radio-medium-7a9bd584 .fds-radio-input-7a9bd584 {
-  left: 0;
-  top: 0;
+  min-height: var(--fds-sizing-10);
 }
 
 .fds-radio-large-7a9bd584 {
   --fds-radio-size: 2rem;
 
-  min-width: var(--fds-sizing-12);
-}
-
-.fds-radio-large-7a9bd584 .fds-radio-input-7a9bd584 {
-  left: 0;
-  top: 0.25rem;
+  min-height: var(--fds-sizing-12);
 }
 
 .fds-group-inline-f6df9230 {

package/dist/types/components/ErrorSummary/ErrorSummaryList.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { List } from '../List';
 export type ErrorSummaryListProps = React.ComponentProps<typeof List.Unordered>;
 declare function ErrorSummaryList({ ...rest }: ErrorSummaryListProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/ErrorSummary/ErrorSummaryList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorSummaryList.d.ts","sourceRoot":"","sources":["../../../../src/components/ErrorSummary/ErrorSummaryList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;AAEhF,iBAAwB,gBAAgB,CAAC,EAAE,GAAG,IAAI,EAAE,EAAE,qBAAqB,2CAE1E;kBAFuB,gBAAgB;;;eAAhB,gBAAgB"}
+{"version":3,"file":"ErrorSummaryList.d.ts","sourceRoot":"","sources":["../../../../src/components/ErrorSummary/ErrorSummaryList.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,SAAS,CAAC,CAAC;AAEhF,iBAAwB,gBAAgB,CAAC,EAAE,GAAG,IAAI,EAAE,EAAE,qBAAqB,2CAE1E;kBAFuB,gBAAgB;;;eAAhB,gBAAgB"}

package/dist/types/components/List/ListHeading.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { type HeadingProps } from '../Typography';
 export type ListHeadingProps = HeadingProps;
 export declare const ListHeading: import("react").ForwardRefExoticComponent<{

package/dist/types/components/List/ListHeading.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListHeading.d.ts","sourceRoot":"","sources":["../../../../src/components/List/ListHeading.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAa3D,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC;AAE5C,eAAO,MAAM,WAAW;;;;;2GAyBvB,CAAC"}
+{"version":3,"file":"ListHeading.d.ts","sourceRoot":"","sources":["../../../../src/components/List/ListHeading.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAa3D,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC;AAE5C,eAAO,MAAM,WAAW;;;;;2GAyBvB,CAAC"}

package/dist/types/components/Modal/ModalRoot.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export type ModalContextProps = {
     closeModal?: () => void;
     modalRef: React.RefObject<HTMLDialogElement>;

package/dist/types/components/Modal/ModalRoot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalRoot.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/ModalRoot.tsx"],"names":[],"mappings":";AAEA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC7C,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,YAAY,4CAIvB,CAAC;AAEH,eAAO,MAAM,SAAS;mBAAkB,cAAc;;CAgBrD,CAAC"}
+{"version":3,"file":"ModalRoot.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/ModalRoot.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC7C,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,YAAY,4CAIvB,CAAC;AAEH,eAAO,MAAM,SAAS;mBAAkB,cAAc;;CAgBrD,CAAC"}

package/dist/types/components/Modal/useScrollLock.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 export declare function useScrollLock(modalRef: React.RefObject<HTMLDialogElement>, bodyClass: string): void;
 //# sourceMappingURL=useScrollLock.d.ts.map

package/dist/types/components/Modal/useScrollLock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useScrollLock.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/useScrollLock.ts"],"names":[],"mappings":";AAEA,wBAAgB,aAAa,CAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAC5C,SAAS,EAAE,MAAM,QAmBlB"}
+{"version":3,"file":"useScrollLock.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/useScrollLock.ts"],"names":[],"mappings":"AAEA,wBAAgB,aAAa,CAC3B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,EAC5C,SAAS,EAAE,MAAM,QAmBlB"}

package/dist/types/components/Pagination/PaginationButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ButtonProps } from '../Button';
 export type PaginationButtonProps = {
     /**

package/dist/types/components/Pagination/PaginationButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/PaginationButton.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAK7C,MAAM,MAAM,qBAAqB,GAAG;IAClC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEvC,eAAO,MAAM,gBAAgB;IAP3B;;;OAGG;;0FAoBH,CAAC"}
+{"version":3,"file":"PaginationButton.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/PaginationButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAK7C,MAAM,MAAM,qBAAqB,GAAG;IAClC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AAEvC,eAAO,MAAM,gBAAgB;IAP3B;;;OAGG;;0FAoBH,CAAC"}

package/dist/types/components/Pagination/PaginationEllipsis.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ParagraphProps } from '../Typography';
 export type PaginationEllipsisProps = Omit<ParagraphProps, 'size' | 'spacing' | 'short'>;
 export declare const PaginationEllipsis: import("react").ForwardRefExoticComponent<PaginationEllipsisProps & import("react").RefAttributes<HTMLParagraphElement>>;

package/dist/types/components/Pagination/PaginationEllipsis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationEllipsis.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/PaginationEllipsis.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAMpD,MAAM,MAAM,uBAAuB,GAAG,IAAI,CACxC,cAAc,EACd,MAAM,GAAG,SAAS,GAAG,OAAO,CAC7B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0HAgB7B,CAAC;AAEH,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"PaginationEllipsis.d.ts","sourceRoot":"","sources":["../../../../src/components/Pagination/PaginationEllipsis.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAMpD,MAAM,MAAM,uBAAuB,GAAG,IAAI,CACxC,cAAc,EACd,MAAM,GAAG,SAAS,GAAG,OAAO,CAC7B,CAAC;AAEF,eAAO,MAAM,kBAAkB,0HAgB7B,CAAC;AAEH,eAAe,kBAAkB,CAAC"}

package/dist/types/components/Pagination/PaginationNextPrev.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { PaginationButtonProps } from './PaginationButton';
 export type PaginationNextProps = PaginationButtonProps;
 export declare const PaginationNext: import("react").ForwardRefExoticComponent<{