@digdir/designsystemet-react 1.0.0-rc.5 → 1.0.0-rc.6

package/dist/cjs/components/Accordion/Accordion.js

@@ -6,7 +6,7 @@ var React = require('react');
 var lite = require('../../node_modules/clsx/dist/lite.js');
 
 const Accordion = React.forwardRef(({ border = false, color = 'neutral', className, ...rest }, ref) => {
-    return (jsxRuntime.jsx("div", { className: lite.clsx('fds-accordion', border && 'fds-accordion--border', color && `fds-accordion--${color}`, className), ref: ref, ...rest }));
+    return (jsxRuntime.jsx("div", { className: lite.clsx('ds-accordion', border && 'ds-accordion--border', color && `ds-accordion--${color}`, className), ref: ref, ...rest }));
 });
 Accordion.displayName = 'Accordion';
 

package/dist/cjs/components/Accordion/{AccordionContent/AccordionContent.js → AccordionContent.js}

@@ -2,11 +2,11 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var lite = require('../../../node_modules/clsx/dist/lite.js');
+var lite = require('../../node_modules/clsx/dist/lite.js');
 var React = require('react');
-var AccordionItem = require('../AccordionItem/AccordionItem.js');
-var AnimateHeight = require('../../../utilities/AnimateHeight/AnimateHeight.js');
-var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
+var AccordionItem = require('./AccordionItem.js');
+var AnimateHeight = require('../../utilities/AnimateHeight/AnimateHeight.js');
+var Paragraph = require('../Typography/Paragraph/Paragraph.js');
 
 const AccordionContent = React.forwardRef(({ children, className, ...rest }, ref) => {
     const context = React.useContext(AccordionItem.AccordionItemContext);
@@ -14,7 +14,7 @@ const AccordionContent = React.forwardRef(({ children, className, ...rest }, ref
         console.error('<Accordion.Content> has to be used within an <Accordion.Item>');
         return null;
     }
-    return (jsxRuntime.jsx(AnimateHeight.AnimateHeight, { id: context.contentId, open: context.open, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: 'sm', children: jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('fds-accordion__content', className), ...rest, children: children }) }) }));
+    return (jsxRuntime.jsx(AnimateHeight.AnimateHeight, { id: context.contentId, open: context.open, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: 'sm', children: jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('ds-accordion__content', className), ...rest, children: children }) }) }));
 });
 AccordionContent.displayName = 'AccordionContent';
 

package/dist/cjs/components/Accordion/AccordionHeader.js

@@ -0,0 +1,26 @@
+'use client';
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var akselIcons = require('@navikt/aksel-icons');
+var lite = require('../../node_modules/clsx/dist/lite.js');
+var React = require('react');
+var AccordionItem = require('./AccordionItem.js');
+var Heading = require('../Typography/Heading/Heading.js');
+var Paragraph = require('../Typography/Paragraph/Paragraph.js');
+
+const AccordionHeader = React.forwardRef(({ level = 1, children, className, onHeaderClick, ...rest }, ref) => {
+    const context = React.useContext(AccordionItem.AccordionItemContext);
+    if (context === null) {
+        console.error('<Accordion.Header> has to be used within an <Accordion.Item>');
+        return null;
+    }
+    const handleClick = (e) => {
+        context.toggleOpen();
+        onHeaderClick && onHeaderClick(e);
+    };
+    return (jsxRuntime.jsx(Heading.Heading, { ref: ref, size: 'xs', level: level, className: lite.clsx('ds-accordion__header', className), ...rest, children: jsxRuntime.jsxs("button", { type: 'button', className: lite.clsx('ds-accordion__button', `ds-focus`), onClick: handleClick, "aria-expanded": context.open, "aria-controls": context.contentId, children: [jsxRuntime.jsx(akselIcons.ChevronDownIcon, { "aria-hidden": true, className: 'ds-accordion__expand-icon', fontSize: '1.5rem' }), jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: 'sm', children: jsxRuntime.jsx("span", { children: children }) })] }) }));
+});
+AccordionHeader.displayName = 'AccordionHeader';
+
+exports.AccordionHeader = AccordionHeader;

package/dist/cjs/components/Accordion/{AccordionItem/AccordionItem.js → AccordionItem.js}

@@ -2,14 +2,14 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var lite = require('../../../node_modules/clsx/dist/lite.js');
+var lite = require('../../node_modules/clsx/dist/lite.js');
 var React = require('react');
 
 const AccordionItemContext = React.createContext(null);
 const AccordionItem = React.forwardRef(({ children, className, open, defaultOpen = false, ...rest }, ref) => {
     const [internalOpen, setInternalOpen] = React.useState(defaultOpen);
     const contentId = React.useId();
-    return (jsxRuntime.jsx("div", { className: lite.clsx('fds-accordion__item', (open ?? internalOpen) && 'fds-accordion__item--open', className), ref: ref, ...rest, children: jsxRuntime.jsx(AccordionItemContext.Provider, { value: {
+    return (jsxRuntime.jsx("div", { className: lite.clsx('ds-accordion__item', (open ?? internalOpen) && 'ds-accordion__item--open', className), ref: ref, ...rest, children: jsxRuntime.jsx(AccordionItemContext.Provider, { value: {
                 open: open ?? internalOpen,
                 toggleOpen: () => {
                     if (open === undefined) {

package/dist/cjs/components/Accordion/index.js

@@ -2,9 +2,9 @@
 'use strict';
 
 var Accordion$1 = require('./Accordion.js');
-var AccordionHeader = require('./AccordionHeader/AccordionHeader.js');
-var AccordionContent = require('./AccordionContent/AccordionContent.js');
-var AccordionItem = require('./AccordionItem/AccordionItem.js');
+var AccordionItem = require('./AccordionItem.js');
+var AccordionContent = require('./AccordionContent.js');
+var AccordionHeader = require('./AccordionHeader.js');
 
 const Accordion = Accordion$1.Accordion;
 Accordion.Header = AccordionHeader.AccordionHeader;
@@ -14,7 +14,7 @@ Accordion.Header.displayName = 'Accordion.Header';
 Accordion.Content.displayName = 'Accordion.Content';
 Accordion.Item.displayName = 'Accordion.Item';
 
-exports.AccordionHeader = AccordionHeader.AccordionHeader;
-exports.AccordionContent = AccordionContent.AccordionContent;
 exports.AccordionItem = AccordionItem.AccordionItem;
+exports.AccordionContent = AccordionContent.AccordionContent;
+exports.AccordionHeader = AccordionHeader.AccordionHeader;
 exports.Accordion = Accordion;

package/dist/cjs/components/Alert/Alert.js

@@ -21,7 +21,7 @@ const icons = {
 };
 const Alert = React.forwardRef(({ severity = 'info', elevated, iconTitle, children, size = 'md', className, ...rest }, ref) => {
     const { Icon, title } = icons[severity];
-    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('fds-alert', `fds-alert--${size}`, `fds-alert--${severity}`, elevated && `fds-alert--elevated`, className), ...rest, children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Icon, { title: iconTitle || title, className: 'fds-alert__icon' }), jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, className: 'fds-alert__content', children: jsxRuntime.jsx("span", { children: children }) })] }) }));
+    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('ds-alert', `ds-alert--${size}`, `ds-alert--${severity}`, elevated && `ds-alert--elevated`, className), ...rest, children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Icon, { title: iconTitle || title, className: 'ds-alert__icon' }), jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, className: 'ds-alert__content', children: jsxRuntime.jsx("span", { children: children }) })] }) }));
 });
 Alert.displayName = 'Alert';
 

package/dist/cjs/components/Box/Box.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const Box = React.forwardRef(({ shadow, borderColor, borderRadius, background = 'default', children, asChild = false, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx(shadow && `fds-box--${shadow}-shadow`, borderColor && `fds-box--${borderColor}-border-color`, borderRadius && `fds-box--${borderRadius}-border-radius`, `fds-box--${background}-background`, className), ...rest, children: children }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx(shadow && `ds-box--${shadow}-shadow`, borderColor && `ds-box--${borderColor}-border-color`, borderRadius && `ds-box--${borderRadius}-border-radius`, `ds-box--${background}-background`, className), ...rest, children: children }));
 });
 Box.displayName = 'Box';
 

package/dist/cjs/components/Button/Button.js

@@ -11,7 +11,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
  */
 const Button = React.forwardRef(({ children, variant = 'primary', color = 'accent', fullWidth = false, icon = false, type = 'button', size = 'md', asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'button';
-    return (jsxRuntime.jsx(Component, { ref: ref, type: type, className: lite.clsx('fds-btn', `fds-focus`, `fds-btn--${size}`, `fds-btn--${variant}`, `fds-btn--${color}`, fullWidth && 'fds-btn--full-width', icon && 'fds-btn--icon-only', className), ...rest, children: children }));
+    return (jsxRuntime.jsx(Component, { ref: ref, type: type, className: lite.clsx('ds-btn', `ds-focus`, `ds-btn--${size}`, `ds-btn--${variant}`, `ds-btn--${color}`, fullWidth && 'ds-btn--full-width', icon && 'ds-btn--icon-only', className), ...rest, children: children }));
 });
 Button.displayName = 'Button';
 

package/dist/cjs/components/Card/Card.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const Card = React.forwardRef(({ isLink = false, asChild = false, color = 'neutral', className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx(`fds-card`, `fds-card--${color}`, isLink && `fds-card--link`, isLink && `fds-focus`, className), ...rest }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx(`ds-card`, `ds-card--${color}`, isLink && `ds-card--link`, isLink && `ds-focus`, className), ...rest }));
 });
 Card.displayName = 'Card';
 

package/dist/cjs/components/Card/CardContent.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const CardContent = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx(`fds-card__content`, className), ref: ref, ...rest }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx(`ds-card__content`, className), ref: ref, ...rest }));
 });
 CardContent.displayName = 'CardContent';
 

package/dist/cjs/components/Card/CardFooter.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const CardFooter = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx(`fds-card__footer`, className), ref: ref, ...rest }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx(`ds-card__footer`, className), ref: ref, ...rest }));
 });
 CardFooter.displayName = 'CardFooter';
 

package/dist/cjs/components/Card/CardHeader.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const CardHeader = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx(`fds-card__header`, className), ref: ref, ...rest }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx(`ds-card__header`, className), ref: ref, ...rest }));
 });
 CardHeader.displayName = 'CardHeader';
 

package/dist/cjs/components/Card/CardMedia.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const CardMedia = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx(`fds-card__media`, className), ref: ref, ...rest }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx(`ds-card__media`, className), ref: ref, ...rest }));
 });
 CardMedia.displayName = 'CardMedia';
 

package/dist/cjs/components/Chip/Group/Group.js

@@ -7,7 +7,7 @@ var lite = require('../../../node_modules/clsx/dist/lite.js');
 
 const ChipGroupContext = React.createContext(null);
 const Group = React.forwardRef(({ size = 'md', children, className, ...rest }, ref) => {
-    return (jsxRuntime.jsx("ul", { ref: ref, className: lite.clsx(`fds-chip--group-container`, `fds-chip--${size}`, className), ...rest, children: jsxRuntime.jsx(ChipGroupContext.Provider, { value: { size }, children: React.Children.toArray(children).map((child, index) => React.isValidElement(child) ? (jsxRuntime.jsx("li", { children: child }, `chip-${index}`)) : null) }) }));
+    return (jsxRuntime.jsx("ul", { ref: ref, className: lite.clsx(`ds-chip--group-container`, `ds-chip--${size}`, className), ...rest, children: jsxRuntime.jsx(ChipGroupContext.Provider, { value: { size }, children: React.Children.toArray(children).map((child, index) => React.isValidElement(child) ? (jsxRuntime.jsx("li", { children: child }, `chip-${index}`)) : null) }) }));
 });
 Group.displayName = 'ChipGroup';
 

package/dist/cjs/components/Chip/Removable/Removable.js

@@ -10,7 +10,7 @@ var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
 
 const RemovableChip = React.forwardRef(({ size = 'md', children, className, ...rest }, ref) => {
     const group = React.useContext(Group.ChipGroupContext);
-    return (jsxRuntime.jsx("button", { type: 'button', ref: ref, className: lite.clsx(`fds-focus`, `fds-chip--button`, `fds-chip--removable`, `fds-chip--${group?.size || size}`, className), ...rest, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: group?.size || size, variant: 'short', children: jsxRuntime.jsxs("span", { className: `fds-chip__label`, children: [jsxRuntime.jsx("span", { children: children }), jsxRuntime.jsx("span", { className: `fds-chip__x-mark`, "aria-hidden": true, children: jsxRuntime.jsx(akselIcons.XMarkIcon, { className: `fds-chip__icon` }) })] }) }) }));
+    return (jsxRuntime.jsx("button", { type: 'button', ref: ref, className: lite.clsx(`ds-focus`, `ds-chip--button`, `ds-chip--removable`, `ds-chip--${group?.size || size}`, className), ...rest, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: group?.size || size, variant: 'short', children: jsxRuntime.jsxs("span", { className: `ds-chip__label`, children: [jsxRuntime.jsx("span", { children: children }), jsxRuntime.jsx("span", { className: `ds-chip__x-mark`, "aria-hidden": true, children: jsxRuntime.jsx(akselIcons.XMarkIcon, { className: `ds-chip__icon` }) })] }) }) }));
 });
 RemovableChip.displayName = 'ChipRemovable';
 

package/dist/cjs/components/Chip/Toggle/Toggle.js

@@ -11,7 +11,7 @@ var Paragraph = require('../../Typography/Paragraph/Paragraph.js');
 const ToggleChip = React.forwardRef(({ children, selected = false, checkmark = true, size = 'md', className, ...rest }, ref) => {
     const shouldDisplayCheckmark = checkmark && selected;
     const group = React.useContext(Group.ChipGroupContext);
-    return (jsxRuntime.jsx("button", { ref: ref, type: 'button', "aria-pressed": selected, className: lite.clsx(`fds-focus`, `fds-chip--button`, `fds-chip--${group?.size || size}`, shouldDisplayCheckmark && `fds-chip--spacing`, className), ...rest, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: group?.size || size, variant: 'short', children: jsxRuntime.jsxs("span", { className: `fds-chip__label`, children: [shouldDisplayCheckmark && (jsxRuntime.jsx(akselIcons.CheckmarkIcon, { className: `fds-chip__checkmark-icon`, "aria-hidden": true })), jsxRuntime.jsx("span", { children: children })] }) }) }));
+    return (jsxRuntime.jsx("button", { ref: ref, type: 'button', "aria-pressed": selected, className: lite.clsx(`ds-focus`, `ds-chip--button`, `ds-chip--${group?.size || size}`, shouldDisplayCheckmark && `ds-chip--spacing`, className), ...rest, children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: group?.size || size, variant: 'short', children: jsxRuntime.jsxs("span", { className: `ds-chip__label`, children: [shouldDisplayCheckmark && (jsxRuntime.jsx(akselIcons.CheckmarkIcon, { className: `ds-chip__checkmark-icon`, "aria-hidden": true })), jsxRuntime.jsx("span", { children: children })] }) }) }));
 });
 ToggleChip.displayName = 'ChipToggle';
 

package/dist/cjs/components/Divider/Divider.js

@@ -6,7 +6,7 @@ var lite = require('../../node_modules/clsx/dist/lite.js');
 var React = require('react');
 
 const Divider = React.forwardRef(({ color = 'default', className, ...rest }, ref) => {
-    return (jsxRuntime.jsx("hr", { className: lite.clsx('fds-divider', `fds-divider--${color}`, className), ref: ref, ...rest }));
+    return (jsxRuntime.jsx("hr", { className: lite.clsx('ds-divider', `ds-divider--${color}`, className), ref: ref, ...rest }));
 });
 Divider.displayName = 'Divider';
 Divider.displayName = 'Divider';

package/dist/cjs/components/DropdownMenu/DropdownMenuContent.js

@@ -67,7 +67,7 @@ const DropdownMenuContent = React.forwardRef(({ className, children, ...rest },
     return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: internalOpen && (jsxRuntime.jsx(floatingUi_react.FloatingFocusManager, { context: context, guards: false, modal: false, children: jsxRuntime.jsx(Container, { children: jsxRuntime.jsx("ul", { role: 'menu', "aria-hidden": !internalOpen, "data-placement": flPlacement, ref: floatingRef, style: floatingStyles, ...getFloatingProps({
                         ref: floatingRef,
                         tabIndex: undefined,
-                    }), className: lite.clsx('fds-dropdownmenu', `fds-dropdownmenu--${size}`, className), ...rest, children: children }) }) })) }));
+                    }), className: lite.clsx('ds-dropdownmenu', `ds-dropdownmenu--${size}`, className), ...rest, children: children }) }) })) }));
 });
 DropdownMenuContent.displayName = 'DropdownMenuContent';
 

package/dist/cjs/components/DropdownMenu/DropdownMenuGroup.js

@@ -9,7 +9,7 @@ var Paragraph = require('../Typography/Paragraph/Paragraph.js');
 const DropdownMenuGroup = React.forwardRef(({ children, heading, className, style, ...rest }, ref) => {
     const { size } = React.useContext(DropdownMenu.DropdownMenuContext);
     const headingId = React.useId();
-    return (jsxRuntime.jsx("li", { className: className, style: style, children: jsxRuntime.jsxs("ul", { ...(heading ? { 'aria-labelledby': headingId } : {}), ref: ref, role: 'group', className: 'fds-dropdownmenu__section', ...rest, children: [heading && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("h2", { id: headingId, className: 'fds-dropdownmenu__heading', children: heading }) })), children] }) }));
+    return (jsxRuntime.jsx("li", { className: className, style: style, children: jsxRuntime.jsxs("ul", { ...(heading ? { 'aria-labelledby': headingId } : {}), ref: ref, role: 'group', className: 'ds-dropdownmenu__section', ...rest, children: [heading && (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("h2", { id: headingId, className: 'ds-dropdownmenu__heading', children: heading }) })), children] }) }));
 });
 DropdownMenuGroup.displayName = 'DropdownMenuGroup';
 

package/dist/cjs/components/DropdownMenu/DropdownMenuItem.js

@@ -8,7 +8,7 @@ var Button = require('../Button/Button.js');
 
 const DropdownMenuItem = React.forwardRef(({ children, className, style, ...rest }, ref) => {
     const { size } = React.useContext(DropdownMenu.DropdownMenuContext);
-    return (jsxRuntime.jsx("li", { className: className, style: style, children: jsxRuntime.jsx(Button.Button, { ref: ref, variant: 'tertiary', size: size, fullWidth: true, className: 'fds-dropdownmenu__item', role: 'menuitem', ...rest, children: children }) }));
+    return (jsxRuntime.jsx("li", { className: className, style: style, children: jsxRuntime.jsx(Button.Button, { ref: ref, variant: 'tertiary', size: size, fullWidth: true, className: 'ds-dropdownmenu__item', role: 'menuitem', ...rest, children: children }) }));
 });
 DropdownMenuItem.displayName = 'DropdownMenuItem';
 

package/dist/cjs/components/ErrorSummary/ErrorSummaryHeading.js

@@ -13,7 +13,7 @@ const ErrorSummaryHeading = ({ id, ...rest }) => {
             setHeadingId(id);
         }
     }, [headingId, id, setHeadingId]);
-    return (jsxRuntime.jsx(index.List.Heading, { ...rest, id: headingId, className: 'fds-error-summary__heading' }));
+    return (jsxRuntime.jsx(index.List.Heading, { ...rest, id: headingId, className: 'ds-error-summary__heading' }));
 };
 ErrorSummaryHeading.displayName = 'ErrorSummaryHeading';
 

package/dist/cjs/components/ErrorSummary/ErrorSummaryRoot.js

@@ -13,7 +13,7 @@ const ErrorSummaryContext = React.createContext({
 const ErrorSummaryRoot = React.forwardRef(({ size, role = 'alert', 'aria-live': ariaLive = 'polite', 'aria-relevant': ariaRelevant = 'all', children, ...rest }, ref) => {
     const randomId = React.useId();
     const [headingId, setHeadingId] = React.useState(randomId);
-    return (jsxRuntime.jsx(ErrorSummaryContext.Provider, { value: { headingId, setHeadingId }, children: jsxRuntime.jsx(index.Slot, { className: 'fds-error-summary', ref: ref, role: role, "aria-live": ariaLive, "aria-relevant": ariaRelevant, "aria-labelledby": headingId, ...rest, children: jsxRuntime.jsx(index$1.List.Root, { size: size, children: children }) }) }));
+    return (jsxRuntime.jsx(ErrorSummaryContext.Provider, { value: { headingId, setHeadingId }, children: jsxRuntime.jsx(index.Slot, { className: 'ds-error-summary', ref: ref, role: role, "aria-live": ariaLive, "aria-relevant": ariaRelevant, "aria-labelledby": headingId, ...rest, children: jsxRuntime.jsx(index$1.List.Root, { size: size, children: children }) }) }));
 });
 ErrorSummaryRoot.displayName = 'ErrorSummaryRoot';
 

package/dist/cjs/components/HelpText/HelpText.js

@@ -9,7 +9,7 @@ var HelpTextIcon = require('./HelpTextIcon.js');
 
 const HelpText = ({ title, placement = 'right', portal, size = 'md', className, children, ...rest }) => {
     const [open, setOpen] = React.useState(false);
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(index.Popover, { variant: 'info', placement: placement, size: size, portal: portal, open: open, onClose: () => setOpen(false), children: [jsxRuntime.jsx(index.Popover.Trigger, { asChild: true, variant: 'tertiary', children: jsxRuntime.jsxs("button", { className: lite.clsx(`fds-helptext--${size}`, 'fds-helptext__button', `fds-focus`, className), "aria-expanded": open, onClick: () => setOpen(!open), ...rest, children: [jsxRuntime.jsx(HelpTextIcon.HelpTextIcon, { filled: true, className: lite.clsx(`fds-helptext__icon`, `fds-helptext__icon--filled`, className), openState: open }), jsxRuntime.jsx(HelpTextIcon.HelpTextIcon, { className: lite.clsx(`fds-helptext__icon`, className), openState: open }), jsxRuntime.jsx("span", { className: `fds-sr-only`, children: title })] }) }), jsxRuntime.jsx(index.Popover.Content, { className: 'fds-helptext__content', children: children })] }) }));
+    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(index.Popover, { variant: 'info', placement: placement, size: size, portal: portal, open: open, onClose: () => setOpen(false), children: [jsxRuntime.jsx(index.Popover.Trigger, { asChild: true, variant: 'tertiary', children: jsxRuntime.jsxs("button", { className: lite.clsx(`ds-helptext--${size}`, 'ds-helptext__button', `ds-focus`, className), "aria-expanded": open, onClick: () => setOpen(!open), ...rest, children: [jsxRuntime.jsx(HelpTextIcon.HelpTextIcon, { filled: true, className: lite.clsx(`ds-helptext__icon`, `ds-helptext__icon--filled`, className), openState: open }), jsxRuntime.jsx(HelpTextIcon.HelpTextIcon, { className: lite.clsx(`ds-helptext__icon`, className), openState: open }), jsxRuntime.jsx("span", { className: `ds-sr-only`, children: title })] }) }), jsxRuntime.jsx(index.Popover.Content, { className: 'ds-helptext__content', children: children })] }) }));
 };
 HelpText.displayName = 'HelpText';
 

package/dist/cjs/components/Link/Link.js

@@ -6,9 +6,9 @@ var React = require('react');
 var lite = require('../../node_modules/clsx/dist/lite.js');
 var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
-const Link = React.forwardRef(({ asChild, children, className, ...rest }, ref) => {
+const Link = React.forwardRef(({ color = 'accent', asChild, children, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'a';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx('fds-link', className), ref: ref, ...rest, children: children }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx('ds-link', `ds-link__ ${color}`, className), ref: ref, ...rest, children: children }));
 });
 Link.displayName = 'Link';
 

package/dist/cjs/components/List/ListItem.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const ListItem = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'li';
-    return (jsxRuntime.jsx(Component, { className: lite.clsx('fds-list__item', className), ...rest, ref: ref }));
+    return (jsxRuntime.jsx(Component, { className: lite.clsx('ds-list__item', className), ...rest, ref: ref }));
 });
 ListItem.displayName = 'ListItem';
 

package/dist/cjs/components/List/Lists.js

@@ -11,13 +11,13 @@ var Paragraph = require('../Typography/Paragraph/Paragraph.js');
 const Unordered = React.forwardRef(({ asChild, ...rest }, ref) => {
     const { size, headingId } = React.useContext(ListRoot.ListContext);
     const Component = asChild ? index.Slot : 'ul';
-    return (jsxRuntime.jsx(Paragraph.Paragraph, { size: size, asChild: true, children: jsxRuntime.jsx(Component, { className: lite.clsx(`fds-list`, `fds-list--${size}`, rest.className), ...(headingId ? { 'aria-labelledby': headingId } : {}), ref: ref, ...rest }) }));
+    return (jsxRuntime.jsx(Paragraph.Paragraph, { size: size, asChild: true, children: jsxRuntime.jsx(Component, { className: lite.clsx(`ds-list`, `ds-list--${size}`, rest.className), ...(headingId ? { 'aria-labelledby': headingId } : {}), ref: ref, ...rest }) }));
 });
 Unordered.displayName = 'ListUnordered';
 const Ordered = React.forwardRef(({ asChild, ...rest }, ref) => {
     const { size, headingId } = React.useContext(ListRoot.ListContext);
     const Component = asChild ? index.Slot : 'ol';
-    return (jsxRuntime.jsx(Paragraph.Paragraph, { size: size, asChild: true, children: jsxRuntime.jsx(Component, { className: lite.clsx(`fds-list`, `fds-list--${size}`, rest.className), ...(headingId ? { 'aria-labelledby': headingId } : {}), ref: ref, ...rest }) }));
+    return (jsxRuntime.jsx(Paragraph.Paragraph, { size: size, asChild: true, children: jsxRuntime.jsx(Component, { className: lite.clsx(`ds-list`, `ds-list--${size}`, rest.className), ...(headingId ? { 'aria-labelledby': headingId } : {}), ref: ref, ...rest }) }));
 });
 Ordered.displayName = 'ListOrdered';
 

package/dist/cjs/components/Modal/ModaContent.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const ModalContent = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
-    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('fds-modal__content', className), ...rest }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('ds-modal__content', className), ...rest }));
 });
 ModalContent.displayName = 'ModalContent';
 

package/dist/cjs/components/Modal/ModalDialog.js

@@ -24,7 +24,7 @@ const ModalDialog = React.forwardRef(({ onInteractOutside, onClose, onBeforeClos
         modalDialogRef.current?.close();
     };
     const mergedRefs = floatingUi_react.useMergeRefs([modalRef, ref, modalDialogRef]);
-    useScrollLock.useScrollLock(modalDialogRef, 'fds-modal--lock-scroll');
+    useScrollLock.useScrollLock(modalDialogRef, 'ds-modal--lock-scroll');
     React.useEffect(() => {
         setOpen(open);
     }, [open, setOpen]);
@@ -66,7 +66,7 @@ const ModalDialog = React.forwardRef(({ onInteractOutside, onClose, onBeforeClos
         }
         modalRef.current?.close();
     };
-    return (jsxRuntime.jsx(Component, { ref: mergedRefs, className: lite.clsx('fds-modal', className), onCancel: onCancel, ...rest, children: open && (jsxRuntime.jsx(floatingUi_react.FloatingFocusManager, { context: context, children: jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }) })) }));
+    return (jsxRuntime.jsx(Component, { ref: mergedRefs, className: lite.clsx('ds-modal', className), onCancel: onCancel, ...rest, children: open && (jsxRuntime.jsx(floatingUi_react.FloatingFocusManager, { context: context, children: jsxRuntime.jsx(jsxRuntime.Fragment, { children: children }) })) }));
 });
 ModalDialog.displayName = 'ModalDialog';
 

package/dist/cjs/components/Modal/ModalFooter.js

@@ -8,7 +8,7 @@ var index = require('../../node_modules/@radix-ui/react-slot/dist/index.js');
 
 const ModalFooter = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'footer';
-    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('fds-modal__footer', className), ...rest }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('ds-modal__footer', className), ...rest }));
 });
 ModalFooter.displayName = 'ModalFooter';
 

package/dist/cjs/components/Modal/ModalHeader.js

@@ -14,7 +14,7 @@ var Heading = require('../Typography/Heading/Heading.js');
 const ModalHeader = React.forwardRef(({ closeButton = true, children, subtitle, asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'div';
     const context = React.useContext(ModalRoot.ModalContext);
-    return (jsxRuntime.jsxs(Component, { ref: ref, className: lite.clsx('fds-modal__header', !closeButton && 'fds-modal__header--no-button', className), ...rest, children: [subtitle && (jsxRuntime.jsx(Paragraph.Paragraph, { size: 'sm', variant: 'short', children: subtitle })), jsxRuntime.jsx(Heading.Heading, { level: 2, size: 'xs', children: children }), closeButton && (jsxRuntime.jsx(Button.Button, { name: 'close', variant: 'tertiary', color: 'neutral', size: 'md', onClick: context?.closeModal, autoFocus: true, icon: true, className: 'fds-modal__header__button', children: jsxRuntime.jsx(akselIcons.XMarkIcon, { title: 'close modal', fontSize: '1.5em' }) }))] }));
+    return (jsxRuntime.jsxs(Component, { ref: ref, className: lite.clsx('ds-modal__header', !closeButton && 'ds-modal__header--no-button', className), ...rest, children: [subtitle && (jsxRuntime.jsx(Paragraph.Paragraph, { size: 'sm', variant: 'short', children: subtitle })), jsxRuntime.jsx(Heading.Heading, { level: 2, size: 'xs', children: children }), closeButton && (jsxRuntime.jsx(Button.Button, { name: 'close', variant: 'tertiary', color: 'neutral', size: 'md', onClick: context?.closeModal, autoFocus: true, icon: true, className: 'ds-modal__header__button', children: jsxRuntime.jsx(akselIcons.XMarkIcon, { title: 'close modal', fontSize: '1.5em' }) }))] }));
 });
 ModalHeader.displayName = 'ModalHeader';
 

package/dist/cjs/components/Pagination/Pagination.js

@@ -24,13 +24,13 @@ const Pagination = React.forwardRef(({ nextLabel = '', previousLabel = '', compa
         currentPage,
         totalPages,
     });
-    return (jsxRuntime.jsx(PaginationRoot.PaginationRoot, { ref: ref, "aria-label": 'Pagination', size: size, compact: compact, ...rest, children: jsxRuntime.jsxs(PaginationContent.PaginationContent, { children: [jsxRuntime.jsx(PaginationItem.PaginationItem, { children: jsxRuntime.jsxs(PaginationNextPrev.PaginationPrevious, { className: lite.clsx(!showPreviousPage && 'fds-pagination--hidden'), onClick: () => {
+    return (jsxRuntime.jsx(PaginationRoot.PaginationRoot, { ref: ref, "aria-label": 'Pagination', size: size, compact: compact, ...rest, children: jsxRuntime.jsxs(PaginationContent.PaginationContent, { children: [jsxRuntime.jsx(PaginationItem.PaginationItem, { children: jsxRuntime.jsxs(PaginationNextPrev.PaginationPrevious, { className: lite.clsx(!showPreviousPage && 'ds-pagination--hidden'), onClick: () => {
                             onChange(currentPage - 1);
                         }, "aria-label": previousLabel, children: [jsxRuntime.jsx(akselIcons.ChevronLeftIcon, { "aria-hidden": true, fontSize: iconSize[size] }), !hideLabels && previousLabel] }) }), pages.map((page, i) => (jsxRuntime.jsx(PaginationItem.PaginationItem, { children: page === 'ellipsis' ? (jsxRuntime.jsx(PaginationEllipsis.PaginationEllipsis, {})) : (jsxRuntime.jsx(PaginationButton.PaginationButton, { "aria-current": currentPage === page, isActive: currentPage === page, "aria-label": itemLabel(page), onClick: () => {
                             onChange(page);
                         }, children: page })) }, `${page}${i}`))), jsxRuntime.jsx(PaginationItem.PaginationItem, { children: jsxRuntime.jsxs(PaginationNextPrev.PaginationNext, { "aria-label": nextLabel, onClick: () => {
                             onChange(currentPage + 1);
-                        }, className: lite.clsx(!showNextPage && 'fds-pagination--hidden'), children: [!hideLabels && nextLabel, jsxRuntime.jsx(akselIcons.ChevronRightIcon, { "aria-hidden": true, fontSize: iconSize[size] })] }) })] }) }));
+                        }, className: lite.clsx(!showNextPage && 'ds-pagination--hidden'), children: [!hideLabels && nextLabel, jsxRuntime.jsx(akselIcons.ChevronRightIcon, { "aria-hidden": true, fontSize: iconSize[size] })] }) })] }) }));
 });
 Pagination.displayName = 'Pagination';
 

package/dist/cjs/components/Pagination/PaginationContent.js

@@ -10,7 +10,7 @@ var PaginationRoot = require('./PaginationRoot.js');
 const PaginationContent = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'ul';
     const { size } = React.useContext(PaginationRoot.PaginationContext);
-    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('fds-pagination', `fds-pagination--${size}`, className), ...rest }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('ds-pagination', `ds-pagination--${size}`, className), ...rest }));
 });
 
 exports.PaginationContent = PaginationContent;

package/dist/cjs/components/Pagination/PaginationEllipsis.js

@@ -11,7 +11,7 @@ var Paragraph = require('../Typography/Paragraph/Paragraph.js');
 
 const PaginationEllipsis = React.forwardRef(({ className, ...rest }, ref) => {
     const { size } = React.useContext(PaginationRoot.PaginationContext);
-    return (jsxRuntime.jsx(Paragraph.Paragraph, { ref: ref, className: lite.clsx('fds-pagination__ellipsis', className), size: size, ...rest, children: "\u2026" }));
+    return (jsxRuntime.jsx(Paragraph.Paragraph, { ref: ref, className: lite.clsx('ds-pagination__ellipsis', className), size: size, ...rest, children: "\u2026" }));
 });
 var PaginationEllipsis$1 = PaginationEllipsis;
 

package/dist/cjs/components/Pagination/PaginationItem.js

@@ -12,7 +12,7 @@ var PaginationRoot = require('./PaginationRoot.js');
 const PaginationItem = React.forwardRef(({ asChild, className, ...rest }, ref) => {
     const Component = asChild ? index.Slot : 'li';
     const { size, compact } = React.useContext(PaginationRoot.PaginationContext);
-    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('fds-pagination__item', `fds-pagination--${size}`, compact && 'fds-pagination--compact', className), ...rest }));
+    return (jsxRuntime.jsx(Component, { ref: ref, className: lite.clsx('ds-pagination__item', `ds-pagination--${size}`, compact && 'ds-pagination--compact', className), ...rest }));
 });
 var PaginationItem$1 = PaginationItem;
 

package/dist/cjs/components/Popover/PopoverContent.js

@@ -90,10 +90,10 @@ const PopoverContent = React.forwardRef(({ className, children, style, id, ...re
     const arrowPlacement = React.useMemo(() => {
         return ARROW_PLACEMENT[flPlacement.split('-')[0]];
     }, [flPlacement]);
-    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: internalOpen && (jsxRuntime.jsx(Container, { children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { ref: floatingEl, className: lite.clsx('fds-popover', `fds-popover--${variant}`, `fds-popover--${size}`, className), "data-placement": flPlacement, ...getFloatingProps({
+    return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: internalOpen && (jsxRuntime.jsx(Container, { children: jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsxs("div", { ref: floatingEl, className: lite.clsx('ds-popover', `ds-popover--${variant}`, `ds-popover--${size}`, className), "data-placement": flPlacement, ...getFloatingProps({
                         ref: floatingRef,
                         tabIndex: undefined,
-                    }), style: { ...floatingStyles, ...style }, id: popoverId, "aria-labelledby": triggerId, ...rest, children: [children, jsxRuntime.jsx("div", { ref: arrowRef, className: lite.clsx('fds-popover__arrow', `fds-popover__arrow--${arrowPlacement}`), style: {
+                    }), style: { ...floatingStyles, ...style }, id: popoverId, "aria-labelledby": triggerId, ...rest, children: [children, jsxRuntime.jsx("div", { ref: arrowRef, className: lite.clsx('ds-popover__arrow', `ds-popover__arrow--${arrowPlacement}`), style: {
                                 height: ARROW_HEIGHT,
                                 width: ARROW_HEIGHT,
                                 ...(arrowX != null ? { left: arrowX } : {}),

package/dist/cjs/components/Skeleton/Circle/Circle.js

@@ -7,8 +7,8 @@ var useSynchronizedAnimation = require('../../../hooks/useSynchronizedAnimation.
 
 /**  Skeleton component used for indicating loading elements of circular shape */
 const Circle = ({ width, height, className, children, style, ...rest }) => {
-    const ref = useSynchronizedAnimation.useSynchronizedAnimation('fds-skeleton-opacity-fade');
-    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('fds-skeleton', 'fds-skeleton--circle', Boolean(children) && 'fds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
+    const ref = useSynchronizedAnimation.useSynchronizedAnimation('ds-skeleton-opacity-fade');
+    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('ds-skeleton', 'ds-skeleton--circle', Boolean(children) && 'ds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
 };
 Circle.displayName = 'SkeletonCircle';
 

package/dist/cjs/components/Skeleton/Rectangle/Rectangle.js

@@ -7,8 +7,8 @@ var useSynchronizedAnimation = require('../../../hooks/useSynchronizedAnimation.
 
 /**  Skeleton component used for indicating loading elements of rectangle shape */
 const Rectangle = ({ width, height, className, children, style, ...rest }) => {
-    const ref = useSynchronizedAnimation.useSynchronizedAnimation('fds-skeleton-opacity-fade');
-    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('fds-skeleton', 'fds-skeleton--rectangle', Boolean(children) && 'fds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
+    const ref = useSynchronizedAnimation.useSynchronizedAnimation('ds-skeleton-opacity-fade');
+    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('ds-skeleton', 'ds-skeleton--rectangle', Boolean(children) && 'ds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
 };
 Rectangle.displayName = 'SkeletonRectangle';
 

package/dist/cjs/components/Skeleton/Text/Text.js

@@ -7,8 +7,8 @@ var useSynchronizedAnimation = require('../../../hooks/useSynchronizedAnimation.
 
 /**  Skeleton component used for indicating loading elements of text */
 const Text = ({ width, height, className, style, children, ...rest }) => {
-    const ref = useSynchronizedAnimation.useSynchronizedAnimation('fds-skeleton-opacity-fade');
-    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('fds-skeleton', 'fds-skeleton--text', Boolean(children) && 'fds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
+    const ref = useSynchronizedAnimation.useSynchronizedAnimation('ds-skeleton-opacity-fade');
+    return (jsxRuntime.jsx("div", { ref: ref, className: lite.clsx('ds-skeleton', 'ds-skeleton--text', Boolean(children) && 'ds-skeleton--has-children', className), style: { width, height, ...style }, "aria-hidden": true, ...rest, children: children }));
 };
 Text.displayName = 'SkeletonText';
 

package/dist/cjs/components/SkipLink/SkipLink.js

@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var lite = require('../../node_modules/clsx/dist/lite.js');
 
 const SkipLink = ({ href, children, className, ...rest }) => {
-    return (jsxRuntime.jsx("a", { href: href, className: lite.clsx(`fds-sr-only`, 'fds-skiplink', className), ...rest, children: jsxRuntime.jsx("p", { className: 'fds-skiplink__content', children: children }) }));
+    return (jsxRuntime.jsx("a", { href: href, className: lite.clsx(`ds-sr-only`, 'ds-skiplink', className), ...rest, children: jsxRuntime.jsx("p", { className: 'ds-skiplink__content', children: children }) }));
 };
 SkipLink.displayName = 'SkipLink';
 

package/dist/cjs/components/Spinner/Spinner.js

@@ -15,9 +15,9 @@ const sizeMap = {
 };
 /**  Spinner component used for indicating busy or indeterminate loading */
 const Spinner = ({ title, color = 'neutral', size = 'md', className, style, ...rest }) => {
-    const svgRef = useSynchronizedAnimation.useSynchronizedAnimation('fds-spinner-rotate-animation');
-    const strokeRef = useSynchronizedAnimation.useSynchronizedAnimation('fds-spinner-stroke-animation');
-    return (jsxRuntime.jsxs("svg", { className: lite.clsx('fds-spinner', `fds-spinner--${color}`, className), style: { width: sizeMap[size], height: sizeMap[size], ...style }, viewBox: '0 0 50 50', ref: svgRef, ...rest, children: [jsxRuntime.jsx("title", { children: title }), jsxRuntime.jsx("circle", { className: lite.clsx('fds-spinner__background'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsxRuntime.jsx("circle", { className: lite.clsx(`fds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
+    const svgRef = useSynchronizedAnimation.useSynchronizedAnimation('ds-spinner-rotate-animation');
+    const strokeRef = useSynchronizedAnimation.useSynchronizedAnimation('ds-spinner-stroke-animation');
+    return (jsxRuntime.jsxs("svg", { className: lite.clsx('ds-spinner', `ds-spinner--${color}`, className), style: { width: sizeMap[size], height: sizeMap[size], ...style }, viewBox: '0 0 50 50', ref: svgRef, ...rest, children: [jsxRuntime.jsx("title", { children: title }), jsxRuntime.jsx("circle", { className: lite.clsx('ds-spinner__background'), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5' }), jsxRuntime.jsx("circle", { className: lite.clsx(`ds-spinner__circle`), cx: '25', cy: '25', r: '20', fill: 'none', strokeWidth: '5', ref: strokeRef })] }));
 };
 Spinner.displayName = 'Spinner';
 

package/dist/cjs/components/Table/Table.js

@@ -26,7 +26,7 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 const Table = React__namespace.forwardRef(({ zebra = false, stickyHeader = false, border = false, size = 'md', className, children, ...rest }, ref) => {
-    return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("table", { ref: ref, className: lite.clsx('fds-table', `fds-table--${size}`, zebra && 'fds-table--zebra', stickyHeader && 'fds-table--sticky-header', border && 'fds-table--border', className), ...rest, children: children }) }));
+    return (jsxRuntime.jsx(Paragraph.Paragraph, { asChild: true, size: size, children: jsxRuntime.jsx("table", { ref: ref, className: lite.clsx('ds-table', `ds-table--${size}`, zebra && 'ds-table--zebra', stickyHeader && 'ds-table--sticky-header', border && 'ds-table--border', className), ...rest, children: children }) }));
 });
 Table.displayName = 'Table';
 

package/dist/cjs/components/Table/TableCell.js

@@ -25,7 +25,7 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 const TableCell = React__namespace.forwardRef(({ className, children, ...rest }, ref) => {
-    return (jsxRuntime.jsx("td", { ref: ref, className: lite.clsx('fds-table__cell', className), ...rest, children: children }));
+    return (jsxRuntime.jsx("td", { ref: ref, className: lite.clsx('ds-table__cell', className), ...rest, children: children }));
 });
 TableCell.displayName = 'TableCell';
 

package/dist/cjs/components/Table/TableHead.js

@@ -25,7 +25,7 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 const TableHead = React__namespace.forwardRef(({ className, children, ...rest }, ref) => {
-    return (jsxRuntime.jsx("thead", { ref: ref, className: lite.clsx('fds-table__head', className), ...rest, children: children }));
+    return (jsxRuntime.jsx("thead", { ref: ref, className: lite.clsx('ds-table__head', className), ...rest, children: children }));
 });
 TableHead.displayName = 'TableHead';
 

package/dist/cjs/components/Table/TableHeaderCell.js

@@ -31,7 +31,7 @@ const SORT_ICON = {
 };
 const TableHeaderCell = React__namespace.forwardRef(({ sortable = false, sort, onSortClick, className, children, ...rest }, ref) => {
     const sortIcon = sort === 'ascending' || sort === 'descending' ? (SORT_ICON[sort]) : (jsxRuntime.jsx(akselIcons.ChevronUpDownIcon, {}));
-    return (jsxRuntime.jsxs("th", { className: lite.clsx('fds-table__header__cell', sortable && 'fds-table__header__cell--sortable', sort && `fds-table__header__cell--sorted`, className), "aria-sort": sort, ref: ref, ...rest, children: [sortable && (jsxRuntime.jsxs("button", { className: `fds-focus`, onClick: onSortClick, children: [children, sortIcon] })), !sortable && children] }));
+    return (jsxRuntime.jsxs("th", { className: lite.clsx('ds-table__header__cell', sortable && 'ds-table__header__cell--sortable', sort && `ds-table__header__cell--sorted`, className), "aria-sort": sort, ref: ref, ...rest, children: [sortable && (jsxRuntime.jsxs("button", { className: `ds-focus`, onClick: onSortClick, children: [children, sortIcon] })), !sortable && children] }));
 });
 TableHeaderCell.displayName = 'TableHeaderCell';
 

package/dist/cjs/components/Table/TableRow.js

@@ -25,7 +25,7 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 
 const TableRow = React__namespace.forwardRef(({ className, children, ...rest }, ref) => {
-    return (jsxRuntime.jsx("tr", { className: lite.clsx('fds-table__row', className), ref: ref, ...rest, children: children }));
+    return (jsxRuntime.jsx("tr", { className: lite.clsx('ds-table__row', className), ref: ref, ...rest, children: children }));
 });
 TableRow.displayName = 'TableRow';