@digdir/designsystemet-react 1.17.0 → 1.19.0

package/dist/esm/components/popover/popover.js

@@ -7,6 +7,7 @@ import '@digdir/designsystemet-web';
 import { useMergeRefs } from '../../utilities/hooks/use-merge-refs/use-merge-refs.js';
 import { Context } from './popover-trigger-context.js';
 
+const IS_DROPDOWN = /(?:^|\s)ds-dropdown(?:\s|$)/;
 /**
  * Popover component, used to display content in a popover over an element.
  *
@@ -24,7 +25,7 @@ import { Context } from './popover-trigger-context.js';
  *   Content
  * </Popover>
  */
-const Popover = forwardRef(function Popover({ id, className, onClose, onOpen, open, variant, placement = 'top', autoPlacement = true, asChild = false, ...rest }, ref) {
+const Popover = forwardRef(function Popover({ id, className = '', onClose, onOpen, open, variant, placement = 'top', autoPlacement = true, asChild = false, ...rest }, ref) {
     const Component = asChild ? Slot : 'div';
     const popoverRef = useRef(null);
     const mergedRefs = useMergeRefs([popoverRef, ref]);
@@ -59,10 +60,12 @@ const Popover = forwardRef(function Popover({ id, className, onClose, onOpen, op
             }
         };
         popover?.togglePopover?.(controlledOpen);
-        if (controlledOpen) {
-            const options = { detail: document.querySelector(trigger) };
-            popover?.dispatchEvent(new CustomEvent('ds-toggle-source', options)); // Since togglePopover({ source }) is not supported in all browsers yet
-        }
+        if (controlledOpen)
+            popover?.dispatchEvent(new CustomEvent('ds-toggle-source', {
+                bubbles: true,
+                composed: true, // Enable bubbling out of shadow DOM boundaries
+                detail: document.querySelector(trigger), // Since togglePopover({ source }) is not supported in all browsers yet
+            }));
         document.addEventListener('click', handleClick, true); // Use capture to execute before React event API
         document.addEventListener('keydown', handleKeydown);
         return () => {
@@ -75,7 +78,9 @@ const Popover = forwardRef(function Popover({ id, className, onClose, onOpen, op
         if (id)
             setPopoverId?.(id);
     }, [id]);
-    return (jsx(Component, { className: cl('ds-popover', className), id: id || popoverId, popover: 'manual', "data-placement": placement, "data-variant": variant, ref: mergedRefs, suppressHydrationWarning // Since _ds-floating adds attributes
+    return (jsx(Component, { className: 
+        // Prevent double className when using Dropdown component
+        cl(IS_DROPDOWN.test(className) ? undefined : 'ds-popover', className), id: id || popoverId, popover: 'manual', "data-placement": placement, "data-variant": variant, ref: mergedRefs, suppressHydrationWarning // Since _ds-floating adds attributes
         : true, ...rest }));
 });
 // NOTE: This is not able to check if the popover is the most recently added #topLayer,

package/dist/esm/components/suggestion/index.js

@@ -5,6 +5,7 @@ import { SuggestionEmpty } from './suggestion-empty.js';
 import { SuggestionInput } from './suggestion-input.js';
 import { SuggestionList } from './suggestion-list.js';
 import { SuggestionOption } from './suggestion-option.js';
+import { SuggestionToggle } from './suggestion-toggle.js';
 
 /**
  * A component that provides a suggestion list for an input field.
@@ -12,6 +13,7 @@ import { SuggestionOption } from './suggestion-option.js';
  * @example
  * <Suggestion>
  *   <Suggestion.Input />
+ *   <Suggestion.Toggle />
  *   <Suggestion.Clear />
  *   <Suggestion.List>
  *     <Suggestion.Empty>Tomt</Suggestion.Empty>
@@ -25,6 +27,7 @@ const EXPERIMENTAL_Suggestion = Object.assign(Suggestion, {
     Input: SuggestionInput,
     Empty: SuggestionEmpty,
     Option: SuggestionOption,
+    Toggle: SuggestionToggle,
     Clear: SuggestionClear,
 });
 EXPERIMENTAL_Suggestion.displayName = 'EXPERIMENTAL_Suggestion';
@@ -32,6 +35,7 @@ EXPERIMENTAL_Suggestion.List.displayName = 'EXPERIMENTAL_Suggestion.List';
 EXPERIMENTAL_Suggestion.Input.displayName = 'EXPERIMENTAL_Suggestion.Input';
 EXPERIMENTAL_Suggestion.Empty.displayName = 'EXPERIMENTAL_Suggestion.Empty';
 EXPERIMENTAL_Suggestion.Option.displayName = 'EXPERIMENTAL_Suggestion.Option';
+EXPERIMENTAL_Suggestion.Toggle.displayName = 'EXPERIMENTAL_Suggestion.Toggle';
 EXPERIMENTAL_Suggestion.Clear.displayName = 'EXPERIMENTAL_Suggestion.Clear';
 
-export { EXPERIMENTAL_Suggestion, SuggestionClear as EXPERIMENTAL_SuggestionClear, SuggestionEmpty as EXPERIMENTAL_SuggestionEmpty, SuggestionInput as EXPERIMENTAL_SuggestionInput, SuggestionList as EXPERIMENTAL_SuggestionList, SuggestionOption as EXPERIMENTAL_SuggestionOption };
+export { EXPERIMENTAL_Suggestion, SuggestionClear as EXPERIMENTAL_SuggestionClear, SuggestionEmpty as EXPERIMENTAL_SuggestionEmpty, SuggestionInput as EXPERIMENTAL_SuggestionInput, SuggestionList as EXPERIMENTAL_SuggestionList, SuggestionOption as EXPERIMENTAL_SuggestionOption, SuggestionToggle as EXPERIMENTAL_SuggestionToggle };

package/dist/esm/components/suggestion/suggestion-clear.js

@@ -10,6 +10,7 @@ import { forwardRef } from 'react';
  * @example
  * <Suggestion>
  *   <Suggestion.Input />
+ *   <Suggestion.Toggle />
  *   <Suggestion.Clear />
  *   <Suggestion.List />
  * </Suggestion>

package/dist/esm/components/suggestion/suggestion-empty.js

@@ -1,7 +1,6 @@
 'use client';
 import { jsx } from 'react/jsx-runtime';
-import { forwardRef, useContext } from 'react';
-import { SuggestionContext } from './suggestion.js';
+import { forwardRef } from 'react';
 import '@digdir/designsystemet-web';
 
 /**
@@ -15,9 +14,8 @@ import '@digdir/designsystemet-web';
  * </Suggestion.List>
  */
 const SuggestionEmpty = forwardRef(function SuggestionEmpty(rest, ref) {
-    const { isEmpty } = useContext(SuggestionContext);
-    return isEmpty ? (jsx("u-option", { "data-empty": true, ref: ref, suppressHydrationWarning // Since <u-option> adds attributes
-        : true, value: '', ...rest })) : null;
+    return (jsx("u-option", { "data-empty": true, ref: ref, suppressHydrationWarning // Since <u-option> adds attributes
+        : true, ...rest }));
 });
 
 export { SuggestionEmpty };

package/dist/esm/components/suggestion/suggestion-toggle.js

@@ -0,0 +1,23 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+
+/**
+ * Component that provides a toggle button for the Suggestion list.
+ *
+ * Place as a descendant of `Suggestion`
+ *
+ * @example
+ * <Suggestion>
+ *   <Suggestion.Input />
+ *   <Suggestion.Toggle />
+ *   <Suggestion.Clear />
+ *   <Suggestion.List />
+ * </Suggestion>
+ */
+const SuggestionToggle = forwardRef(function SuggestionToggle({ 'aria-label': label = 'Valg', ...rest }, ref) {
+    return (jsx("button", { "aria-expanded": 'false', "aria-label": label, ref: ref, suppressHydrationWarning // Since <ds-suggestion> adds attributes
+        : true, type: 'button', ...rest }));
+});
+
+export { SuggestionToggle };

package/dist/esm/components/suggestion/suggestion.js

@@ -26,7 +26,6 @@ const Suggestion = forwardRef(function Suggestion({ children, className, creatab
     const selectId = rest.id ? `${rest.id}-select` : genId;
     const isControlled = selected !== undefined;
     const mergedRefs = useMergeRefs([ref, dsSuggestionRef]);
-    const [isEmpty, setIsEmpty] = useState(false);
     const [defaultItems, setDefaultItems] = useState(sanitizeItems(defaultSelected));
     const selectedItems = selected ? sanitizeItems(selected) : defaultItems;
     const onSelectedChangeRef = useRef(onSelectedChange);
@@ -46,8 +45,11 @@ const Suggestion = forwardRef(function Suggestion({ children, className, creatab
         const beforeChange = (event) => {
             event.preventDefault();
             const multiple = combobox?.multiple;
+            const input = combobox?.control;
             const data = event.detail;
             const nextItem = nextItems(data, selectedItemsRef.current, multiple);
+            if (!multiple && input)
+                input.value = data?.textContent || ''; // Sync input value for single selection
             onSelectedChangeRef.current?.(nextItem || null);
             if (!isControlled)
                 setDefaultItems(sanitizeItems(nextItem));
@@ -67,7 +69,7 @@ const Suggestion = forwardRef(function Suggestion({ children, className, creatab
         const filterFn = filter === true ? defaultFilter : filter;
         let disabled = 0;
         let index = 0;
-        for (const option of options)
+        for (const option of Array.from(options))
             if (!option.hasAttribute('data-empty')) {
                 if (filterFn && input)
                     option.disabled =
@@ -81,9 +83,8 @@ const Suggestion = forwardRef(function Suggestion({ children, className, creatab
                         }) && Boolean(++disabled);
                 index++; // Increment index for each <option>
             }
-        setIsEmpty(index === disabled);
     }, [filter]);
-    return (jsx(SuggestionContext.Provider, { value: { isEmpty, handleFilter, dsSuggestionRef }, children: jsxs("ds-suggestion", { "data-multiple": multiple || undefined, "data-creatable": creatable || undefined, class: cl('ds-suggestion', className), ref: mergedRefs, suppressHydrationWarning // Since <ds-suggestion> adds attributes
+    return (jsx(SuggestionContext.Provider, { value: { handleFilter, dsSuggestionRef }, children: jsxs("ds-suggestion", { "data-multiple": multiple || undefined, "data-creatable": creatable || undefined, class: cl('ds-suggestion', className), ref: mergedRefs, suppressHydrationWarning // Since <ds-suggestion> adds attributes
             : true, ...rest, children: [selectedItems.map((item) => (jsx("data", { value: item.value, children: renderSelected(item) }, item.value))), children, !!name && (jsx("select", { name: name, multiple: true, hidden: true, id: selectId }))] }) }));
 });
 const SuggestionContext = createContext({

package/dist/esm/components/textfield/textfield.js

@@ -18,8 +18,8 @@ import { FieldAffixes, FieldAffix } from '../field/field-affix.js';
  * @example
  * <Textfield label="Textfield label">
  */
-const Textfield = forwardRef(function Textfield({ label, description, error, multiline, prefix, suffix, 'data-size': size, counter, style, className, ...rest }, ref) {
-    return (jsxs(FieldComponent, { className: className, "data-size": size, style: style, children: [!!label && jsx(Label, { children: label }), !!description && jsx(FieldDescription, { children: description }), jsxs(FieldAffixes, { children: [prefix === undefined || jsx(FieldAffix, { children: prefix }), multiline === true ? (jsx(Textarea, { ref: ref, "aria-invalid": Boolean(error) || undefined, ...rest })) : (jsx(Input, { ref: ref, "aria-invalid": Boolean(error) || undefined, ...rest })), suffix === undefined || jsx(FieldAffix, { children: suffix })] }), !!counter && (jsx(FieldComponent.Counter, { ...(typeof counter === 'number' ? { limit: counter } : counter) })), !!error && jsx(ValidationMessage, { children: error })] }));
+const Textfield = forwardRef(function Textfield({ label, description, error, multiline, prefix, suffix, 'data-color': color, 'data-size': size, counter, style, className, ...rest }, ref) {
+    return (jsxs(FieldComponent, { className: className, "data-color": color, "data-size": size, style: style, children: [!!label && jsx(Label, { children: label }), !!description && jsx(FieldDescription, { children: description }), jsxs(FieldAffixes, { children: [prefix === undefined || jsx(FieldAffix, { children: prefix }), multiline === true ? (jsx(Textarea, { ref: ref, "aria-invalid": Boolean(error) || undefined, ...rest })) : (jsx(Input, { ref: ref, "aria-invalid": Boolean(error) || undefined, ...rest })), suffix === undefined || jsx(FieldAffix, { children: suffix })] }), !!counter && (jsx(FieldComponent.Counter, { ...(typeof counter === 'number' ? { limit: counter } : counter) })), !!error && jsx(ValidationMessage, { children: error })] }));
 });
 
 export { Textfield };

package/dist/esm/components/toggle-group/index.js

@@ -6,7 +6,7 @@ import { ToggleGroupItem } from './toggle-group-item.js';
  * Display a group of buttons that can be toggled between.
  *
  * @example
- * <ToggleGroup data-toggle-group="Label" onChange={(value) => console.log(value)}>
+ * <ToggleGroup aria-label="Label" onChange={(value) => console.log(value)}>
  *   <ToggleGroup.Item value='1'>Toggle 1</ToggleGroup.Item>
  *   <ToggleGroup.Item value='2'>Toggle 2</ToggleGroup.Item>
  *   <ToggleGroup.Item value='3'>Toggle 3</ToggleGroup.Item>

package/dist/esm/components/toggle-group/toggle-group-item.js

@@ -14,8 +14,8 @@ const ToggleGroupItem = forwardRef(function ToggleGroupItem({ className, childre
     const toggleGroup = useContext(ToggleGroupContext);
     const value = rawValue ?? genValue;
     const active = toggleGroup.value === value;
-    const { 'aria-disabled': ariaDisabled, disabled, form, formAction, formEncType, formMethod, formNoValidate, formTarget, required, ...labelProps } = rest;
-    return (jsxs("label", { ref: ref, ...labelProps, className: cl('ds-button', className), "data-variant": 'tertiary', "aria-disabled": ariaDisabled ?? disabled, children: [jsx("input", { "aria-disabled": ariaDisabled, checked: active, disabled: disabled, form: form, formAction: formAction, formEncType: formEncType, formMethod: formMethod, formNoValidate: formNoValidate, formTarget: formTarget, name: toggleGroup.name, onChange: () => toggleGroup.onChange?.(value), required: required, type: 'radio', value: value }), children] }));
+    const { 'aria-disabled': ariaDisabled, disabled, readOnly, form, formAction, formEncType, formMethod, formNoValidate, formTarget, required, ...labelProps } = rest;
+    return (jsxs("label", { ref: ref, ...labelProps, className: cl('ds-button', className), "data-variant": 'tertiary', "aria-disabled": ariaDisabled ?? disabled, children: [jsx("input", { "aria-disabled": ariaDisabled, checked: active, disabled: disabled, readOnly: readOnly, form: form, formAction: formAction, formEncType: formEncType, formMethod: formMethod, formNoValidate: formNoValidate, formTarget: formTarget, name: toggleGroup.name, onChange: () => toggleGroup.onChange?.(value), required: required, type: 'radio', value: value }), children] }));
 });
 
 export { ToggleGroupItem };

package/dist/esm/components/toggle-group/toggle-group.js

@@ -8,13 +8,13 @@ const ToggleGroupContext = createContext({});
  * Display a group of buttons that can be toggled between.
  *
  * @example
- * <ToggleGroup data-toggle-group="Label" onChange={(value) => console.log(value)}>
+ * <ToggleGroup aria-label="Label" onChange={(value) => console.log(value)}>
  *   <ToggleGroup.Item value='1'>Toggle 1</ToggleGroup.Item>
  *   <ToggleGroup.Item value='2'>Toggle 2</ToggleGroup.Item>
  *   <ToggleGroup.Item value='3'>Toggle 3</ToggleGroup.Item>
  * </ToggleGroup>
  */
-const ToggleGroup = forwardRef(function ToggleGroup({ children, className, defaultValue, name, onChange, value, variant, ...rest }, ref) {
+const ToggleGroup = forwardRef(function ToggleGroup({ 'data-toggle-group': label, children, className, defaultValue, name, onChange, value, variant, ...rest }, ref) {
     const nameId = useId();
     const isControlled = value !== undefined;
     const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);
@@ -32,9 +32,8 @@ const ToggleGroup = forwardRef(function ToggleGroup({ children, className, defau
             onChange: onValueChange,
             value,
             variant,
-        }, children: jsx("fieldset", { className: cl('ds-toggle-group', className), "data-toggle-group": '' // Default to empty string to ensure attribute is present
-            , "data-variant": variant, suppressHydrationWarning // Since @digdir/designsystemet-web adds attributes
-            : true, ref: ref, ...rest, children: children }) }));
+        }, children: jsx("fieldset", { "aria-label": label, className: cl('ds-toggle-group', className), "data-variant": variant, focusgroup: 'radiogroup', ref: ref, suppressHydrationWarning // Since @digdir/designsystemet-web adds attributes
+            : true, ...rest, children: children }) }));
 });
 
 export { ToggleGroup, ToggleGroupContext };

package/dist/esm/index.js

@@ -17,6 +17,7 @@ export { Dropdown } from './components/dropdown/index.js';
 export { ErrorSummary } from './components/error-summary/index.js';
 export { Field } from './components/field/index.js';
 export { Fieldset } from './components/fieldset/index.js';
+export { EXPERIMENTAL_FileUpload } from './components/file-upload/index.js';
 export { Heading } from './components/heading/heading.js';
 export { Input } from './components/input/input.js';
 export { Label } from './components/label/label.js';
@@ -76,6 +77,7 @@ export { SuggestionEmpty as EXPERIMENTAL_SuggestionEmpty } from './components/su
 export { SuggestionInput as EXPERIMENTAL_SuggestionInput } from './components/suggestion/suggestion-input.js';
 export { SuggestionList as EXPERIMENTAL_SuggestionList } from './components/suggestion/suggestion-list.js';
 export { SuggestionOption as EXPERIMENTAL_SuggestionOption } from './components/suggestion/suggestion-option.js';
+export { SuggestionToggle as EXPERIMENTAL_SuggestionToggle } from './components/suggestion/suggestion-toggle.js';
 export { ErrorSummaryHeading } from './components/error-summary/error-summary-heading.js';
 export { ErrorSummaryItem } from './components/error-summary/error-summary-item.js';
 export { ErrorSummaryLink } from './components/error-summary/error-summary-link.js';

package/dist/react-types.d.ts

@@ -1,25 +1,24 @@
-import type { Color, ColorScheme, Size } from '@digdir/designsystemet-types';
+import type { ColorScheme } from '@digdir/designsystemet-types';
+import type { DefaultProps } from './types';
 
 declare global {
   namespace React {
     interface HTMLAttributes<T> {
       /**
-       * Represents the recommended size options for the Designsystemet variables.
-       * - `'sm'`: Use the small size.
-       * - `'md'`: Use the medium size.
-       * - `'lg'`: Use the large size.
+       * Use `data-size` to change the size for descendant Designsystemet components and variables.
+       *
+       * Select from predefined sizes or define your own size.
        */
-      'data-size'?: Size | (string & {});
+      'data-size'?: DefaultProps['data-size'];
       /**
-       * Represents the available color options for the Designsystemet variables.
-       *
-       * These are augmented based on your theme configuration.
+       * Use `data-color` to change the color for descendant Designsystemet components and variables.
        *
+       * Select from predefined colors and colors defined using theme.designsystemet.no.
        * @link https://theme.designsystemet.no
        */
-      'data-color'?: Color | (string & {});
+      'data-color'?: DefaultProps['data-color'];
       /**
-       * Represents the available color scheme options for the Designsystemet variables.
+       * Use `data-color-scheme` to change the color scheme for descendant Designsystemet components. Select from predefined color schemes.
        * - `'light'`: Use the light color scheme.
        * - `'dark'`: Use the dark color scheme.
        * - `'auto'`: Automatically select the color scheme based on system preferences.
@@ -28,6 +27,10 @@ declare global {
       // Make React 18 support popover attributes https://github.com/facebook/react/issues/27479
       popovertarget?: string;
       popover?: '' | 'auto' | 'manual' | 'hint';
+
+      // Make React support focusgroup attribute
+      focusgroup?: string;
+      focusgroupstart?: boolean | undefined;
     }
     // Make React support command attributes https://github.com/facebook/react/issues/27479
     interface ButtonHTMLAttributes<T> extends React.HTMLAttributes<T> {

package/dist/types/colors.d.ts

@@ -1,2 +1 @@
 export type { Color, SeverityColors, } from '@digdir/designsystemet-types';
-//# sourceMappingURL=colors.d.ts.map

package/dist/types/components/Combobox/Combobox.d.ts

@@ -206,7 +206,7 @@ export declare const ComboboxComponent: import("react").ForwardRefExoticComponen
     description?: ReactNode;
     id?: string;
     readOnly?: boolean;
-    size?: import("packages/types/dist/types").Size;
+    size?: import("@digdir/designsystemet-types").Size;
 } & Pick<import("react").HTMLAttributes<HTMLElement>, "aria-describedby"> & Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & import("react").RefAttributes<HTMLInputElement>>;
 export declare const Combobox: import("react").ForwardRefExoticComponent<{
     /**
@@ -312,6 +312,5 @@ export declare const Combobox: import("react").ForwardRefExoticComponent<{
     description?: ReactNode;
     id?: string;
     readOnly?: boolean;
-    size?: import("packages/types/dist/types").Size;
+    size?: import("@digdir/designsystemet-types").Size;
 } & Pick<import("react").HTMLAttributes<HTMLElement>, "aria-describedby"> & Omit<InputHTMLAttributes<HTMLInputElement>, "size"> & import("react").RefAttributes<HTMLInputElement>>;
-//# sourceMappingURL=Combobox.d.ts.map

package/dist/types/components/Combobox/ComboboxContext.d.ts

@@ -39,4 +39,3 @@ export type ComboboxContextType = {
     setListRef: (index: number, ref: HTMLElement | null) => void;
 };
 export declare const ComboboxContext: import("react").Context<ComboboxContextType | undefined>;
-//# sourceMappingURL=ComboboxContext.d.ts.map

package/dist/types/components/Combobox/ComboboxIdContext.d.ts

@@ -16,4 +16,3 @@ export declare const ComboboxIdProvider: ({ children }: {
 export declare function useComboboxIdDispatch(): Dispatch<SetActiveIndexAction>;
 export declare function useComboboxId(): ComboboxIdContextType;
 export {};
-//# sourceMappingURL=ComboboxIdContext.d.ts.map

package/dist/types/components/Combobox/Custom.d.ts

@@ -30,4 +30,3 @@ export type ComboboxCustomProps = {
 } & HTMLAttributes<HTMLDivElement> & (InteractiveProps | NonInteractiveProps);
 declare const ComboboxCustom: import("react").ForwardRefExoticComponent<ComboboxCustomProps & import("react").RefAttributes<HTMLDivElement>>;
 export { ComboboxCustom };
-//# sourceMappingURL=Custom.d.ts.map

package/dist/types/components/Combobox/Empty.d.ts

@@ -2,4 +2,3 @@ import type { HTMLAttributes } from 'react';
 export type ComboboxEmptyProps = HTMLAttributes<HTMLDivElement>;
 declare const ComboboxEmpty: import("react").ForwardRefExoticComponent<ComboboxEmptyProps & import("react").RefAttributes<HTMLDivElement>>;
 export { ComboboxEmpty };
-//# sourceMappingURL=Empty.d.ts.map

package/dist/types/components/Combobox/Option/Description.d.ts

@@ -2,4 +2,3 @@ import type { HTMLAttributes } from 'react';
 type ComboboxOptionDescriptionProps = HTMLAttributes<HTMLSpanElement>;
 declare const ComboboxOptionDescription: import("react").ForwardRefExoticComponent<ComboboxOptionDescriptionProps & import("react").RefAttributes<HTMLSpanElement>>;
 export default ComboboxOptionDescription;
-//# sourceMappingURL=Description.d.ts.map

package/dist/types/components/Combobox/Option/Option.d.ts

@@ -31,4 +31,3 @@ declare const ComboboxOption: import("react").NamedExoticComponent<{
 } & ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
 export { ComboboxOption };
 export declare function isComboboxOption(child: ReactNode): child is ReactElement<ComboboxOptionProps>;
-//# sourceMappingURL=Option.d.ts.map

package/dist/types/components/Combobox/Option/SelectedIcon.d.ts

@@ -7,4 +7,3 @@ declare const SelectedIcon: {
     displayName: string;
 };
 export { SelectedIcon };
-//# sourceMappingURL=SelectedIcon.d.ts.map

package/dist/types/components/Combobox/Option/useComboboxOption.d.ts

@@ -14,4 +14,3 @@ type UseComboboxOptionReturn = {
 };
 export declare const useComboboxOption: ({ id, ref, value, }: UseComboboxOptionProps) => UseComboboxOptionReturn;
 export {};
-//# sourceMappingURL=useComboboxOption.d.ts.map

package/dist/types/components/Combobox/data/data.d.ts

@@ -4,4 +4,3 @@ export declare const data: {
     targetCode: string;
     targetName: string;
 }[];
-//# sourceMappingURL=data.d.ts.map

package/dist/types/components/Combobox/index.d.ts

@@ -13,4 +13,3 @@ export type { ComboboxProps } from './Combobox';
 export type { ComboboxEmptyProps } from './Empty';
 export type { ComboboxOptionProps } from './Option/Option';
 export { Combobox, ComboboxEmpty, ComboboxOption };
-//# sourceMappingURL=index.d.ts.map

package/dist/types/components/Combobox/internal/ComboboxChips.d.ts

@@ -3,4 +3,3 @@ declare const ComboboxChips: {
     displayName: string;
 };
 export default ComboboxChips;
-//# sourceMappingURL=ComboboxChips.d.ts.map

package/dist/types/components/Combobox/internal/ComboboxClearButton.d.ts

@@ -1,4 +1,3 @@
 import type { ButtonHTMLAttributes } from 'react';
 declare const ComboboxClearButton: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;
 export default ComboboxClearButton;
-//# sourceMappingURL=ComboboxClearButton.d.ts.map

package/dist/types/components/Combobox/internal/ComboboxError.d.ts

@@ -10,4 +10,3 @@ declare const ComboboxError: {
     displayName: string;
 };
 export default ComboboxError;
-//# sourceMappingURL=ComboboxError.d.ts.map

package/dist/types/components/Combobox/internal/ComboboxInput.d.ts

@@ -12,4 +12,3 @@ declare const ComboboxInput: {
     displayName: string;
 };
 export default ComboboxInput;
-//# sourceMappingURL=ComboboxInput.d.ts.map

package/dist/types/components/Combobox/internal/ComboboxLabel.d.ts

@@ -13,4 +13,3 @@ declare const ComboboxLabel: {
     displayName: string;
 };
 export default ComboboxLabel;
-//# sourceMappingURL=ComboboxLabel.d.ts.map

package/dist/types/components/Combobox/internal/ComboboxNative.d.ts

@@ -12,4 +12,3 @@ declare const ComboboxNative: {
     displayName: string;
 };
 export default ComboboxNative;
-//# sourceMappingURL=ComboboxNative.d.ts.map

package/dist/types/components/Combobox/omit/omit.d.ts

@@ -10,4 +10,3 @@ type UnknownRecord = Record<string | number | symbol, unknown>;
  */
 export declare const omit: (names: string[], obj: UnknownRecord) => object;
 export {};
-//# sourceMappingURL=omit.d.ts.map

package/dist/types/components/Combobox/useCombobox.d.ts

@@ -31,4 +31,3 @@ export declare function useCombobox({ children, inputValue, multiple, filter, in
         [key: string]: Option;
     }>>;
 };
-//# sourceMappingURL=useCombobox.d.ts.map

package/dist/types/components/Combobox/useComboboxKeyboard.d.ts

@@ -17,4 +17,3 @@ type UseComboboxKeyboardProps = {
 };
 export declare const useComboboxKeyboard: ({ readOnly, disabled, interactiveChildren, filteredOptions, inputValue, selectedOptions, multiple, open, options, setOpen, handleSelectOption, }: UseComboboxKeyboardProps) => (...args: KeyboardEvent<Element>[]) => void;
 export {};
-//# sourceMappingURL=useComboboxKeyboard.d.ts.map

package/dist/types/components/Combobox/useFloatingCombobox.d.ts

@@ -16,4 +16,3 @@ export declare const useFloatingCombobox: ({ listRef, }: UseFloatingComboboxProp
     getItemProps: ReturnType<typeof useInteractions>["getItemProps"];
 };
 export {};
-//# sourceMappingURL=useFloatingCombobox.d.ts.map

package/dist/types/components/Combobox/useFormField/FieldsetContext.d.ts

@@ -1,4 +1,3 @@
 import type { FormFieldProps } from './useFormField';
 export type FieldsetContextType = Pick<FormFieldProps, 'error' | 'errorId' | 'disabled' | 'size'>;
 export declare const FieldsetContext: import("react").Context<FieldsetContextType | null>;
-//# sourceMappingURL=FieldsetContext.d.ts.map

package/dist/types/components/Combobox/useFormField/useFormField.d.ts

@@ -33,4 +33,3 @@ export type FormField = {
  * Handles props and their state for various form-fields in context with Fieldset
  */
 export declare const useFormField: (props: FormFieldProps, prefix: string) => FormField;
-//# sourceMappingURL=useFormField.d.ts.map

package/dist/types/components/Combobox/utilities.d.ts

@@ -16,4 +16,3 @@ type ReactInternalHack = {
 };
 export declare const setReactInputValue: (input: HTMLInputElement & ReactInternalHack, value: string) => void;
 export {};
-//# sourceMappingURL=utilities.d.ts.map

package/dist/types/components/alert/alert.d.ts

@@ -1,27 +1,10 @@
-import type { SeverityColors } from '@digdir/designsystemet-types';
 import type { HTMLAttributes } from 'react';
 import type { DefaultProps } from '../../types';
-import type { MergeRight } from '../../utilities';
-export type AlertProps = MergeRight<DefaultProps & HTMLAttributes<HTMLDivElement>, {
-    /**
-     * Sets color and icon.
-     *
-     * @default 'info'
-     */
-    'data-color'?: SeverityColors;
-}>;
+export type AlertProps = DefaultProps & HTMLAttributes<HTMLDivElement>;
 /**
  * Alerts are used to inform users about important information, warnings, errors, or success.
  *
  * @example
  * <Alert data-color='info'>Dette er en informasjonsmelding</Alert>
  */
-export declare const Alert: import("react").ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLDivElement>, "data-color"> & {
-    /**
-     * Sets color and icon.
-     *
-     * @default 'info'
-     */
-    'data-color'?: SeverityColors;
-} & import("react").RefAttributes<HTMLDivElement>>;
-//# sourceMappingURL=alert.d.ts.map
+export declare const Alert: import("react").ForwardRefExoticComponent<DefaultProps & HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/types/components/avatar/avatar.d.ts

@@ -61,4 +61,3 @@ export type AvatarProps = MergeRight<DefaultProps & HTMLAttributes<HTMLSpanEleme
  */
 export declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
 export {};
-//# sourceMappingURL=avatar.d.ts.map

package/dist/types/components/avatar-stack/avatar-stack.d.ts

@@ -67,4 +67,3 @@ export declare const EXPERIMENTAL_AvatarStack: import("react").ForwardRefExoticC
      */
     expandable?: "fixed" | true;
 } & HTMLAttributes<HTMLSpanElement> & import("react").RefAttributes<HTMLSpanElement>>;
-//# sourceMappingURL=avatar-stack.d.ts.map

package/dist/types/components/badge/badge-position.d.ts

@@ -38,4 +38,3 @@ export declare const BadgePosition: import("react").ForwardRefExoticComponent<Om
      */
     overlap?: "circle" | "rectangle";
 } & import("react").RefAttributes<HTMLSpanElement>>;
-//# sourceMappingURL=badge-position.d.ts.map

package/dist/types/components/badge/badge.d.ts

@@ -1,4 +1,3 @@
-import type { Color, SeverityColors } from '@digdir/designsystemet-types';
 import { type HTMLAttributes } from 'react';
 import type { DefaultProps } from '../../types';
 import type { MergeRight } from '../../utilities';
@@ -17,10 +16,6 @@ export type BadgeProps = MergeRight<DefaultProps & HTMLAttributes<HTMLSpanElemen
      * @default 'base'
      */
     variant?: 'base' | 'tinted';
-    /**
-     * Change the color scheme of the badge
-     */
-    'data-color'?: Color | SeverityColors;
     children?: never;
 }>;
 /**
@@ -34,7 +29,7 @@ export type BadgeProps = MergeRight<DefaultProps & HTMLAttributes<HTMLSpanElemen
  *   <Icon />
  * </Badge>
  */
-export declare const Badge: import("react").ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLSpanElement>, "data-color" | "children" | "variant" | "count" | "maxCount"> & {
+export declare const Badge: import("react").ForwardRefExoticComponent<Omit<DefaultProps & HTMLAttributes<HTMLSpanElement>, "children" | "variant" | "count" | "maxCount"> & {
     /**
      * The number to display in the badge
      */
@@ -49,10 +44,5 @@ export declare const Badge: import("react").ForwardRefExoticComponent<Omit<Defau
      * @default 'base'
      */
     variant?: "base" | "tinted";
-    /**
-     * Change the color scheme of the badge
-     */
-    'data-color'?: Color | SeverityColors;
     children?: never;
 } & import("react").RefAttributes<HTMLSpanElement>>;
-//# sourceMappingURL=badge.d.ts.map

package/dist/types/components/badge/index.d.ts

@@ -5,11 +5,10 @@ import { BadgePosition } from './badge-position';
  * @example without children
  * <Badge count={5} maxCount={10} />
  */
-declare const Badge: import("react").ForwardRefExoticComponent<Omit<import("../..").DefaultProps & import("react").HTMLAttributes<HTMLSpanElement>, "data-color" | "children" | "variant" | "count" | "maxCount"> & {
+declare const Badge: import("react").ForwardRefExoticComponent<Omit<import("../..").DefaultProps & import("react").HTMLAttributes<HTMLSpanElement>, "children" | "variant" | "count" | "maxCount"> & {
     count?: number;
     maxCount?: number;
     variant?: "base" | "tinted";
-    'data-color'?: import("packages/types/dist/types").Color | import("packages/types/dist/types").SeverityColors;
     children?: never;
 } & import("react").RefAttributes<HTMLSpanElement>> & {
     Position: import("react").ForwardRefExoticComponent<Omit<import("../..").DefaultProps & import("react").HTMLAttributes<HTMLSpanElement>, "overlap" | "placement"> & {
@@ -20,4 +19,3 @@ declare const Badge: import("react").ForwardRefExoticComponent<Omit<import("../.
 export type { BadgeProps } from './badge';
 export type { BadgePositionProps } from './badge-position';
 export { Badge, BadgePosition };
-//# sourceMappingURL=index.d.ts.map

package/dist/types/components/breadcrumbs/breadcrumbs-item.d.ts

@@ -1,4 +1,3 @@
 import { type HTMLAttributes } from 'react';
 export type BreadcrumbsItemProps = HTMLAttributes<HTMLLIElement>;
 export declare const BreadcrumbsItem: import("react").ForwardRefExoticComponent<BreadcrumbsItemProps & import("react").RefAttributes<HTMLLIElement>>;
-//# sourceMappingURL=breadcrumbs-item.d.ts.map

package/dist/types/components/breadcrumbs/breadcrumbs-link.d.ts

@@ -4,4 +4,3 @@ export declare const BreadcrumbsLink: import("react").ForwardRefExoticComponent<
     children: import("react").ReactNode;
     asChild?: boolean;
 } & import("react").RefAttributes<HTMLAnchorElement>>;
-//# sourceMappingURL=breadcrumbs-link.d.ts.map

package/dist/types/components/breadcrumbs/breadcrumbs-list.d.ts

@@ -1,4 +1,3 @@
 import { type HTMLAttributes } from 'react';
 export type BreadcrumbsListProps = HTMLAttributes<HTMLOListElement>;
 export declare const BreadcrumbsList: import("react").ForwardRefExoticComponent<BreadcrumbsListProps & import("react").RefAttributes<HTMLOListElement>>;
-//# sourceMappingURL=breadcrumbs-list.d.ts.map

package/dist/types/components/breadcrumbs/breadcrumbs.d.ts

@@ -35,4 +35,3 @@ export declare const Breadcrumbs: import("react").ForwardRefExoticComponent<Omit
      */
     'aria-label'?: string;
 } & import("react").RefAttributes<DSBreadcrumbsElement>>;
-//# sourceMappingURL=breadcrumbs.d.ts.map

package/dist/types/components/breadcrumbs/index.d.ts

@@ -70,4 +70,3 @@ export type { BreadcrumbsItemProps } from './breadcrumbs-item';
 export type { BreadcrumbsLinkProps } from './breadcrumbs-link';
 export type { BreadcrumbsListProps } from './breadcrumbs-list';
 export { BreadcrumbsComponent as Breadcrumbs, BreadcrumbsItem, BreadcrumbsLink, BreadcrumbsList, };
-//# sourceMappingURL=index.d.ts.map