@dep-dio/dio-designsystem 0.3.0 → 0.5.0

package/README.md

@@ -38,6 +38,14 @@ import "@dep-dio/dio-designsystem/web"
 
 Registers Designsystemet web components and DIO custom elements.
 
+### React components
+
+```ts
+import { Button } from "@dep-dio/dio-designsystem/react"
+```
+
+Use React components when the consuming application is built with React. For server-rendered HTML, CMS templates (for example Optimizely) and other stacks, use plain HTML markup with styles and web components instead.
+
 ### Nav icons (Aksel)
 
 ```ts
@@ -77,9 +85,7 @@ import "@dep-dio/dio-designsystem/svg-icons-register"
 
 ## Publishing
 
-The package is published to [npm](https://www.npmjs.com/package/@dep-dio/dio-designsystem) as a public scoped package. Only `@dep-dio/dio-designsystem` is versioned and published; Storybook and other workspace packages are private and listed in `.changeset/config.json` under `ignore`.
-
-### Versioning
+`@dep-dio/dio-designsystem` is published to [npm](https://www.npmjs.com/package/@dep-dio/dio-designsystem) as a public scoped package. Storybook (`@design/storybook`) is private and ignored by Changesets.
 
 Versions follow [Semantic Versioning](https://semver.org/):
 
@@ -87,11 +93,11 @@ Versions follow [Semantic Versioning](https://semver.org/):
 - **minor** — new components, new exports, backward-compatible features
 - **major** — breaking API, class name, or markup changes for consumers
 
-Each release gets a changelog entry in [`CHANGELOG.md`](./CHANGELOG.md) (created when versions are bumped).
+Changelog entries land in [`CHANGELOG.md`](./CHANGELOG.md) when the version is bumped.
 
-### Changesets workflow
+### 1. Add a changeset (every PR that should release)
 
-Releases use [Changesets](https://github.com/changesets/changesets). Contributors describe their change when opening a PR:
+Releases use [Changesets](https://github.com/changesets/changesets). On the feature branch:
 
 ```bash
 npx changeset
@@ -99,55 +105,36 @@ npx changeset
 
 1. Choose **@dep-dio/dio-designsystem**
 2. Pick **patch**, **minor**, or **major**
-3. Write a short summary (becomes the changelog line)
-
-This adds a markdown file under `.changeset/`. Commit it with the code change.
-
-When changesets on `main` are ready to release:
-
-1. **Version** — bump `package.json` and update changelogs:
+3. Write the release note: a plain **summary** line first, then optional bullet **details**
 
-    ```bash
-    npm run version-packages
-    ```
+The changelog prefixes the summary with the commit hash (`- abc1234: …`). Do not start the summary with `-`, or the first line looks mangled. Prefer:
 
-    Or merge the **“chore: version packages”** PR that the release workflow opens (see below).
+```markdown
+Typography, theme colors, SCSS utils, and new icons
 
-2. **Publish** — build and push to npm:
-
-    ```bash
-    npm run release
-    ```
-
-    This runs `npm run build:package` then `changeset publish`. You need `npm login` or an `NPM_TOKEN` with publish access to the `@dep-dio` scope.
-
-### Automated release (GitHub Actions)
-
-The [Release workflow](../../.github/workflows/release.yml) uses [changesets/action](https://github.com/changesets/action). It is triggered manually (**Actions → Release → Run workflow**).
-
-With pending changesets on `main`, the workflow either:
+- Explicit DIO font-size overrides (small `1–4`, medium `1–5`)
+- `./mixins` export replaced by `./scss-utils`
+```
 
-- opens a PR that runs `npm run version-packages` (version bump + changelog), or
-- runs `npm run release` and publishes to npm if versions were already bumped and no unpublished changesets remain
+Edit the generated `.changeset/*.md` if the interactive prompt only captured a single line. Commit it with the code change, then merge the PR to `main`.
 
-Repository setup:
+### 2. Release via GitHub Actions
 
-1. Add an **`NPM_TOKEN`** secret (npm automation token with publish rights for `@dep-dio/dio-designsystem`)
-2. Ensure GitHub Actions can create pull requests (default `GITHUB_TOKEN` is used by the action)
+Publishing is done only through the [Release workflow](https://github.com/dss-web/dio-designsystemet/actions/workflows/release.yml) ([changesets/action](https://github.com/changesets/action)). It is **manual**: open that page → **Run workflow**.
 
-Typical flow:
+Each run does **one** of these (never both):
 
-1. Merge feature PRs that include `.changeset/*.md` files
-2. Run the Release workflow
-3. Merge the version PR if one is opened
-4. Run the Release workflow again to publish (or let it publish in the same run if nothing is left to version)
+| State on `main`                                         | What the workflow does                                                                                       |
+| ------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
+| Pending `.changeset/*.md` files                         | Opens or updates a **“chore: version packages”** PR (bumps version + changelog, removes consumed changesets) |
+| No pending changesets, but a new version is unpublished | Builds and publishes that version to npm                                                                     |
 
-### Local publish check
+**Release steps:**
 
-Verify the package builds before releasing:
+1. Merge feature PRs that include changeset files
+2. Run **Release** → review and merge the version PR
+3. Run **Release** again → publishes to npm
 
-```bash
-npm run build:package
-```
+You always need both workflow runs: version first, publish second.
 
-Inspect `dist/` — that is what npm consumers receive (`files` in `package.json` is `dist` only).
+**Repo setup (once):** add an `NPM_TOKEN` secret (npm automation token with publish rights for `@dep-dio/dio-designsystem`). The action uses the default `GITHUB_TOKEN` for the version PR.

package/dist/components/Alert/Alert.d.ts

@@ -0,0 +1,8 @@
+import { type AlertProps as DsAlertProps } from "@digdir/designsystemet-react";
+import type { SeverityColors } from "../../theme-colors";
+export interface AlertProps extends DsAlertProps {
+    color?: SeverityColors;
+    title?: string;
+    description?: string;
+}
+export declare function Alert({ className, color, title, description, children, ...props }: AlertProps): import("react").JSX.Element;

package/dist/components/Breadcrumbs/Breadcrumbs.d.ts

@@ -0,0 +1,18 @@
+import { type BreadcrumbsProps as DsBreadcrumbsProps } from "@digdir/designsystemet-react";
+export interface BreadcrumbItem {
+    href?: string;
+    label: string;
+    isCurrent?: boolean;
+}
+export interface BreadcrumbsProps extends DsBreadcrumbsProps {
+    items?: BreadcrumbItem[];
+}
+export declare function Breadcrumbs({ items, className, children, "aria-label": ariaLabel, ...props }: BreadcrumbsProps): import("react").JSX.Element;
+export declare namespace Breadcrumbs {
+    var Item: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").BreadcrumbsItemProps & import("react").RefAttributes<HTMLLIElement>>;
+    var Link: import("react").ForwardRefExoticComponent<Omit<import("@digdir/designsystemet-react").DefaultProps & import("react").AnchorHTMLAttributes<HTMLAnchorElement>, "asChild" | "children"> & {
+        children: import("react").ReactNode;
+        asChild?: boolean;
+    } & import("react").RefAttributes<HTMLAnchorElement>>;
+    var List: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").BreadcrumbsListProps & import("react").RefAttributes<HTMLOListElement>>;
+}

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,12 @@
+import { type ButtonProps as DsButtonProps } from "@digdir/designsystemet-react";
+import type { ThemeColor } from "../../theme-colors";
+export interface ButtonProps extends Omit<DsButtonProps, "data-color" | "loading" | "disabled" | "aria-label"> {
+    color?: ThemeColor;
+    iconLeft?: string;
+    iconRight?: string;
+    ariaLabel?: string;
+    isLoading?: DsButtonProps["loading"];
+    isDisabled?: boolean;
+    size?: "sm" | "md" | "lg";
+}
+export declare function Button({ className, color, iconLeft, iconRight, children, ariaLabel, isLoading, isDisabled, size, ...props }: ButtonProps): import("react").JSX.Element;

package/dist/components/Button/ButtonClose.d.ts

@@ -0,0 +1,8 @@
+import { type ButtonProps as DsButtonProps } from "@digdir/designsystemet-react";
+import type { MouseEventHandler } from "react";
+export type ButtonCloseProps = Omit<DsButtonProps, "icon" | "children" | "aria-label"> & {
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    ariaLabel?: string;
+    commandFor?: string;
+};
+export declare function ButtonClose({ className, onClick, ariaLabel, title, id, commandFor, variant, ...props }: ButtonCloseProps): import("react").JSX.Element;

package/dist/components/Button/ButtonLink.d.ts

@@ -0,0 +1,10 @@
+import { type LinkProps as DsLinkProps } from "@digdir/designsystemet-react";
+import type { ButtonHTMLAttributes, ReactNode } from "react";
+export type ButtonLinkProps = Omit<DsLinkProps, "href" | "children" | "onClick" | "aria-label" | "asChild"> & {
+    children?: ReactNode;
+    iconLeft?: string;
+    iconRight?: string;
+    onClick?: ButtonHTMLAttributes<HTMLButtonElement>["onClick"];
+    isDisabled?: boolean;
+};
+export declare function ButtonLink({ className, children, iconLeft, iconRight, onClick, isDisabled, ...props }: ButtonLinkProps): import("react").JSX.Element;

package/dist/components/Card/Card.d.ts

@@ -0,0 +1,20 @@
+import { type CardProps as DsCardProps } from "@digdir/designsystemet-react";
+import type { ReactNode } from "react";
+import type { Color } from "../../theme-colors";
+export type CardVariant = "default" | "tinted";
+export type CardProps = Omit<DsCardProps, "children"> & {
+    title?: string;
+    href?: string;
+    description?: string;
+    children?: ReactNode;
+    color?: Color;
+    variant?: CardVariant;
+    headingLevel?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+    hasBlocks?: boolean;
+};
+export declare function Card({ title, href, description, color, variant, children, className, headingLevel, hasBlocks, ...props }: CardProps): import("react").JSX.Element;
+export declare namespace Card {
+    var Block: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+}

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,17 @@
+import { type CheckboxProps as DsCheckboxProps } from "@digdir/designsystemet-react";
+import { type ChangeEventHandler, type ReactNode } from "react";
+export type CheckboxProps = Omit<DsCheckboxProps, "label" | "disabled" | "checked" | "required" | "defaultChecked" | "error" | "onChange"> & {
+    label?: ReactNode;
+    description?: ReactNode;
+    controlClassName?: string;
+    isValid?: boolean;
+    errorMessage?: string;
+    isValidationVisible?: boolean;
+    isDisabled?: boolean;
+    isChecked?: boolean;
+    isRequired?: boolean;
+    isDefaultChecked?: boolean;
+    requiredMessage?: string;
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+};
+export declare function Checkbox({ className, controlClassName, label, description, isValid, errorMessage, isValidationVisible, isDisabled, isChecked, isRequired, isDefaultChecked, requiredMessage, onChange, ...props }: CheckboxProps): import("react").JSX.Element;

package/dist/components/Checkbox/CheckboxFieldset.d.ts

@@ -0,0 +1,10 @@
+import { type FieldsetProps as DsFieldsetProps } from "@digdir/designsystemet-react";
+import type { CSSProperties, ReactNode } from "react";
+export interface CheckboxFieldsetProps extends DsFieldsetProps {
+    legend: string;
+    description?: ReactNode;
+    children: ReactNode;
+    direction?: "horizontal" | "vertical";
+    style?: CSSProperties;
+}
+export declare function CheckboxFieldset({ legend, description, children, direction, style, className, ...props }: CheckboxFieldsetProps): import("react").JSX.Element;

package/dist/components/ControlGroup/ControlGroup.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+export interface ControlGroupProps {
+    children: ReactNode;
+    className?: string;
+    orientation?: "horizontal" | "vertical";
+}
+export declare function ControlGroup({ children, className, orientation, }: ControlGroupProps): import("react").JSX.Element;

package/dist/components/Details/Details.d.ts

@@ -0,0 +1,18 @@
+import { type DetailsProps as DsDetailsProps } from "@digdir/designsystemet-react";
+import type { ReactNode } from "react";
+export type DetailsProps = Omit<DsDetailsProps, "children" | "open" | "onToggle" | "defaultOpen"> & {
+    children: ReactNode;
+    trigger: string;
+    triggerExtraLabel?: ReactNode;
+    contentClassName?: string;
+    isOpen?: boolean;
+    onToggle?: (event: Event) => void;
+    isDefaultOpen?: boolean;
+};
+export declare function Details({ children, trigger, triggerExtraLabel, contentClassName, className, isOpen, onToggle, isDefaultOpen, ...props }: DetailsProps): import("react").JSX.Element;
+export declare namespace Details {
+    var Summary: import("react").ForwardRefExoticComponent<{
+        children?: ReactNode;
+    } & import("react").HTMLAttributes<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
+    var Content: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").DetailsContentProps & import("react").RefAttributes<HTMLDivElement>>;
+}

package/dist/components/Dialog/Dialog.d.ts

@@ -0,0 +1,30 @@
+import { type DialogProps as DsDialogProps } from "@digdir/designsystemet-react";
+import { type ReactNode } from "react";
+export interface DialogProps extends Omit<DsDialogProps, "closeButton" | "open" | "modal"> {
+    children?: ReactNode;
+    title?: string;
+    id: string;
+    isInitialOpen?: boolean;
+    isModal?: boolean;
+    closeButtonText?: string;
+}
+export declare function Dialog({ children, className, placement, isModal, title, id, isInitialOpen, closeButtonText, onClose, ...props }: DialogProps): import("react").JSX.Element;
+export declare namespace Dialog {
+    var Block: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+    var Trigger: import("react").ForwardRefExoticComponent<Omit<Omit<import("@digdir/designsystemet-react").DefaultProps & Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "command" | "commandFor" | "commandfor">, "asChild" | "command" | "commandFor" | "commandfor" | "icon" | "loading" | "type" | "variant"> & {
+        variant?: "primary" | "secondary" | "tertiary";
+        icon?: boolean;
+        loading?: boolean | import("react").ReactNode;
+        asChild?: boolean;
+        type?: import("react").ButtonHTMLAttributes<HTMLButtonElement>["type"];
+        command?: string;
+        commandfor?: string;
+        commandFor?: string;
+    } & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    var TriggerContext: {
+        (rest: import("@digdir/designsystemet-react").DialogTriggerContextProps): import("react").JSX.Element;
+        displayName: string;
+    };
+}

package/dist/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,19 @@
+import { type DropdownProps as DsDropdownProps } from "@digdir/designsystemet-react";
+export type DropdownProps = DsDropdownProps;
+declare function DropdownRoot({ className, children, ...props }: DropdownProps): import("react").JSX.Element;
+export declare const Dropdown: typeof DropdownRoot & {
+    TriggerContext: {
+        ({ children }: import("@digdir/designsystemet-react").DropdownTriggerContextProps): import("react").JSX.Element;
+        displayName: string;
+    };
+    Trigger: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+    Heading: import("react").ForwardRefExoticComponent<{
+        level?: 1 | 2 | 3 | 4 | 5 | 6;
+        'data-size'?: "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+        asChild?: boolean;
+    } & import("react").HTMLAttributes<HTMLHeadingElement> & import("react").RefAttributes<HTMLHeadingElement>>;
+    List: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").DropdownListProps & import("react").RefAttributes<HTMLUListElement>>;
+    Item: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").DropdownItemProps & import("react").RefAttributes<HTMLLIElement>>;
+    Button: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").DropdownButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export {};

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

@@ -0,0 +1,27 @@
+import { type ErrorSummaryProps as DsErrorSummaryProps } from "@digdir/designsystemet-react";
+export interface ErrorSummaryItem {
+    label: string;
+    href: string;
+}
+export interface ErrorSummaryProps extends DsErrorSummaryProps {
+    title?: string;
+    errors?: ErrorSummaryItem[];
+}
+export declare function ErrorSummary({ title, errors, className, children, ...props }: ErrorSummaryProps): import("react").JSX.Element;
+export declare namespace ErrorSummary {
+    var Heading: import("react").ForwardRefExoticComponent<{
+        level?: 1 | 2 | 3 | 4 | 5 | 6;
+        'data-size'?: "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+        asChild?: boolean;
+    } & import("react").HTMLAttributes<HTMLHeadingElement> & import("react").RefAttributes<HTMLHeadingElement>>;
+    var List: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & import("@digdir/designsystemet-react").DefaultProps & Omit<import("react").HTMLAttributes<HTMLUListElement>, "size"> & import("react").RefAttributes<HTMLOListElement>>;
+    var Item: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & import("react").LiHTMLAttributes<HTMLLIElement> & import("react").RefAttributes<HTMLLIElement>>;
+    var Link: import("react").ForwardRefExoticComponent<Omit<import("@digdir/designsystemet-react").DefaultProps & import("react").AnchorHTMLAttributes<HTMLAnchorElement>, "asChild" | "children"> & {
+        children: import("react").ReactNode;
+        asChild?: boolean;
+    } & import("react").RefAttributes<HTMLAnchorElement>>;
+}

package/dist/components/FeedbackBanner/FeedbackBanner.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from "react";
+import type { SeverityColors } from "../../theme-colors";
+export interface FeedbackBannerProps {
+    color?: SeverityColors;
+    className?: string;
+    children?: ReactNode;
+    closeLabel?: string;
+}
+export declare function FeedbackBanner({ color, className, children, closeLabel, }: FeedbackBannerProps): import("react").JSX.Element;

package/dist/components/Form/Form.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from "react";
+export interface FormProps {
+    className?: string;
+    children: ReactNode;
+}
+export declare function Form({ className, children }: FormProps): import("react").JSX.Element;

package/dist/components/Label/Label.d.ts

@@ -0,0 +1,9 @@
+import type { HTMLAttributes, ReactNode } from "react";
+export declare const DEFAULT_REQUIRED_MESSAGE = "M\u00E5 fylles ut";
+export interface LabelProps extends HTMLAttributes<HTMLSpanElement> {
+    isRequired?: boolean;
+    isInvalid?: boolean;
+    requiredMessage?: string;
+    children: ReactNode;
+}
+export declare function Label({ className, children, isRequired, isInvalid, requiredMessage, ...props }: LabelProps): import("react").JSX.Element;

package/dist/components/LinkList/LinkList.d.ts

@@ -0,0 +1,11 @@
+export interface LinkListItem {
+    href: string;
+    label: string;
+    target?: string;
+    rel?: string;
+}
+export interface LinkListProps {
+    links?: LinkListItem[];
+    className?: string;
+}
+export declare function LinkList({ links, className }: LinkListProps): import("react").JSX.Element;

package/dist/components/NavigationalLink/NavigationalLink.d.ts

@@ -0,0 +1,8 @@
+import { type LinkProps as DsLinkProps } from "@digdir/designsystemet-react";
+import type { ReactNode } from "react";
+export type NavigationalLinkProps = Omit<DsLinkProps, "children"> & {
+    children?: ReactNode;
+    iconLeft?: string;
+    iconRight?: string;
+};
+export declare function NavigationalLink({ children, className, iconLeft, iconRight, ...props }: NavigationalLinkProps): import("react").JSX.Element;

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

@@ -0,0 +1,15 @@
+import { type PaginationProps as DsPaginationProps } from "@digdir/designsystemet-react";
+export type PaginationProps = DsPaginationProps;
+declare function PaginationRoot({ className, children, ...props }: PaginationProps): import("react").JSX.Element;
+export declare const Pagination: typeof PaginationRoot & {
+    List: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & Omit<import("react").HTMLAttributes<HTMLUListElement>, "size"> & import("react").RefAttributes<HTMLUListElement>>;
+    Item: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & Omit<import("react").HTMLAttributes<HTMLLIElement>, "size"> & import("react").RefAttributes<HTMLLIElement>>;
+    Button: import("react").ForwardRefExoticComponent<{
+        'aria-current'?: import("react").AriaAttributes["aria-current"];
+    } & Omit<import("@digdir/designsystemet-react").ButtonProps, "icon" | "loading"> & import("react").RefAttributes<HTMLButtonElement>>;
+};
+export {};

package/dist/components/Radio/Radio.d.ts

@@ -0,0 +1,9 @@
+import { type RadioProps as DsRadioProps } from "@digdir/designsystemet-react";
+import type { ChangeEventHandler } from "react";
+export type RadioProps = Omit<DsRadioProps, "disabled" | "checked" | "required" | "defaultChecked" | "error" | "onChange"> & {
+    isDisabled?: boolean;
+    isChecked?: boolean;
+    isDefaultChecked?: boolean;
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+};
+export declare function Radio({ className, isDisabled, isChecked, isDefaultChecked, onChange, ...props }: RadioProps): import("react").JSX.Element;

package/dist/components/Radio/RadioFieldset.d.ts

@@ -0,0 +1,10 @@
+import { type FieldsetProps as DsFieldsetProps } from "@digdir/designsystemet-react";
+import type { CSSProperties, ReactNode } from "react";
+export interface RadioFieldsetProps extends DsFieldsetProps {
+    legend: string;
+    description?: ReactNode;
+    children: ReactNode;
+    direction?: "horizontal" | "vertical";
+    style?: CSSProperties;
+}
+export declare function RadioFieldset({ legend, description, children, direction, style, className, ...props }: RadioFieldsetProps): import("react").JSX.Element;

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,25 @@
+import { type SelectProps as DsSelectProps } from "@digdir/designsystemet-react";
+import type { ChangeEventHandler, ReactNode } from "react";
+export interface SelectProps extends Omit<DsSelectProps, "required" | "disabled" | "onChange"> {
+    controlClassName?: string;
+    label?: ReactNode;
+    description?: ReactNode;
+    selectedValue?: string;
+    isValid?: boolean;
+    errorMessage?: string;
+    isValidationVisible?: boolean;
+    isRequired?: boolean;
+    isDisabled?: boolean;
+    requiredMessage?: string;
+    onChange?: ChangeEventHandler<HTMLSelectElement>;
+}
+declare function SelectRoot({ className, controlClassName, label, description, id, isRequired, isDisabled, selectedValue, value, onChange, isValid, errorMessage, isValidationVisible, requiredMessage, children, ...props }: SelectProps): import("react").JSX.Element;
+export declare const Select: typeof SelectRoot & {
+    Option: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & import("react").OptionHTMLAttributes<HTMLOptionElement> & import("react").RefAttributes<HTMLOptionElement>>;
+    Optgroup: import("react").ForwardRefExoticComponent<{
+        asChild?: boolean;
+    } & import("react").OptgroupHTMLAttributes<HTMLOptGroupElement> & import("react").RefAttributes<HTMLOptGroupElement>>;
+};
+export {};

package/dist/components/Spinner/Spinner.d.ts

@@ -0,0 +1,8 @@
+import { type SpinnerProps as DsSpinnerProps } from "@digdir/designsystemet-react";
+export interface SpinnerProps extends Omit<DsSpinnerProps, "data-size" | "aria-label"> {
+    size?: "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+    textBefore?: string;
+    textAfter?: string;
+    ariaLabel?: string;
+}
+export declare function Spinner({ size, textBefore, textAfter, ariaLabel, className, ...props }: SpinnerProps): import("react").JSX.Element;

package/dist/components/SvgIcon/SvgIcon.d.ts

@@ -0,0 +1,10 @@
+import type { CSSProperties } from "react";
+export interface SvgIconProps {
+    name: string;
+    width?: number;
+    height?: number;
+    className?: string;
+    label?: string;
+    style?: CSSProperties;
+}
+export declare function SvgIcon({ name, width, height, className, label, style }: SvgIconProps): import("react").JSX.Element;

package/dist/components/Switch/Switch.d.ts

@@ -0,0 +1,9 @@
+import { type SwitchProps as DsSwitchProps } from "@digdir/designsystemet-react";
+import type { ChangeEventHandler } from "react";
+export type SwitchProps = Omit<DsSwitchProps, "disabled" | "checked" | "required" | "defaultChecked" | "onChange"> & {
+    isDisabled?: boolean;
+    isChecked?: boolean;
+    isDefaultChecked?: boolean;
+    onChange?: ChangeEventHandler<HTMLInputElement>;
+};
+export declare function Switch({ className, isDisabled, isChecked, isDefaultChecked, onChange, ...props }: SwitchProps): import("react").JSX.Element;

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,13 @@
+import { type TabsProps as DsTabsProps } from "@digdir/designsystemet-react";
+export type TabsProps = DsTabsProps;
+declare function TabsRoot({ className, children, ...props }: TabsProps): import("react").JSX.Element;
+export declare const Tabs: typeof TabsRoot & {
+    List: import("react").ForwardRefExoticComponent<import("@digdir/designsystemet-react").TabsListProps & import("react").RefAttributes<import("@digdir/designsystemet-web").DSTabListElement>>;
+    Tab: import("react").ForwardRefExoticComponent<{
+        value: string;
+    } & Omit<import("react").HTMLAttributes<import("@digdir/designsystemet-web").DSTabElement>, "value"> & import("react").RefAttributes<import("@digdir/designsystemet-web").DSTabElement>>;
+    Panel: import("react").ForwardRefExoticComponent<{
+        value: string;
+    } & Omit<import("react").HTMLAttributes<import("@digdir/designsystemet-web").DSTabPanelElement>, "value"> & import("react").RefAttributes<import("@digdir/designsystemet-web").DSTabPanelElement>>;
+};
+export {};

package/dist/components/Tag/Tag.d.ts

@@ -0,0 +1,7 @@
+import { type TagProps as DsTagProps } from "@digdir/designsystemet-react";
+import type { Color } from "../../theme-colors";
+interface TagProps extends DsTagProps {
+    color?: Color;
+}
+export declare function Tag({ className, color, children, ...props }: TagProps): import("react").JSX.Element;
+export {};

package/dist/components/Textarea/Textarea.d.ts

@@ -0,0 +1,16 @@
+import { type TextareaProps as DsTextareaProps } from "@digdir/designsystemet-react";
+import type { ChangeEventHandler, ReactNode } from "react";
+export interface TextareaProps extends Omit<DsTextareaProps, "required" | "disabled" | "onChange"> {
+    controlClassName?: string;
+    label?: ReactNode;
+    description?: ReactNode;
+    isValid?: boolean;
+    errorMessage?: string;
+    isValidationVisible?: boolean;
+    isRequired?: boolean;
+    isDisabled?: boolean;
+    requiredMessage?: string;
+    value?: string;
+    onChange?: ChangeEventHandler<HTMLTextAreaElement>;
+}
+export declare function Textarea({ className, controlClassName, label, description, id, isValid, errorMessage, isValidationVisible, isRequired, isDisabled, requiredMessage, value, onChange, ...props }: TextareaProps): import("react").JSX.Element;

package/dist/components/Textfield/Textfield.d.ts

@@ -0,0 +1,15 @@
+import { type TextfieldProps as DsTextfieldProps } from "@digdir/designsystemet-react";
+import type { ChangeEventHandler, ReactNode } from "react";
+export type TextfieldProps = Omit<DsTextfieldProps, "label" | "error" | "required" | "disabled" | "onChange"> & {
+    isValid?: boolean;
+    isValidationVisible?: boolean;
+    label?: ReactNode;
+    errorMessage?: string;
+    isRequired?: boolean;
+    isDisabled?: boolean;
+    requiredMessage?: string;
+    value?: string;
+    onChange?: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
+    accept?: string;
+};
+export declare function Textfield({ className, isValid, isValidationVisible, errorMessage, isRequired, isDisabled, requiredMessage, label, value, onChange, ...props }: TextfieldProps): import("react").JSX.Element;

package/dist/components/ValidationMessage/ValidationMessage.d.ts

@@ -0,0 +1,3 @@
+import { type ValidationMessageProps as DsValidationMessageProps } from "@digdir/designsystemet-react";
+export type ValidationMessageProps = DsValidationMessageProps;
+export declare function ValidationMessage({ className, children, ...props }: ValidationMessageProps): import("react").JSX.Element;

package/dist/react.d.ts

@@ -0,0 +1,31 @@
+export { Alert, type AlertProps } from "./components/Alert/Alert";
+export { Breadcrumbs, type BreadcrumbItem, type BreadcrumbsProps, } from "./components/Breadcrumbs/Breadcrumbs";
+export { Button, type ButtonProps } from "./components/Button/Button";
+export { ButtonClose, type ButtonCloseProps } from "./components/Button/ButtonClose";
+export { ButtonLink, type ButtonLinkProps } from "./components/Button/ButtonLink";
+export { Card, type CardProps, type CardVariant } from "./components/Card/Card";
+export { Checkbox, type CheckboxProps } from "./components/Checkbox/Checkbox";
+export { CheckboxFieldset, type CheckboxFieldsetProps, } from "./components/Checkbox/CheckboxFieldset";
+export { ControlGroup, type ControlGroupProps } from "./components/ControlGroup/ControlGroup";
+export { Details, type DetailsProps } from "./components/Details/Details";
+export { Dialog, type DialogProps } from "./components/Dialog/Dialog";
+export { Dropdown, type DropdownProps } from "./components/Dropdown/Dropdown";
+export { ErrorSummary, type ErrorSummaryItem, type ErrorSummaryProps, } from "./components/ErrorSummary/ErrorSummary";
+export { FeedbackBanner, type FeedbackBannerProps, } from "./components/FeedbackBanner/FeedbackBanner";
+export { Form, type FormProps } from "./components/Form/Form";
+export { DEFAULT_REQUIRED_MESSAGE, Label, type LabelProps, } from "./components/Label/Label";
+export { LinkList, type LinkListItem, type LinkListProps } from "./components/LinkList/LinkList";
+export { NavigationalLink, type NavigationalLinkProps, } from "./components/NavigationalLink/NavigationalLink";
+export { Pagination, type PaginationProps } from "./components/Pagination/Pagination";
+export { Radio, type RadioProps } from "./components/Radio/Radio";
+export { RadioFieldset, type RadioFieldsetProps } from "./components/Radio/RadioFieldset";
+export { Select, type SelectProps } from "./components/Select/Select";
+export { Spinner, type SpinnerProps } from "./components/Spinner/Spinner";
+export { SvgIcon, type SvgIconProps } from "./components/SvgIcon/SvgIcon";
+export { Switch, type SwitchProps } from "./components/Switch/Switch";
+export { Tabs, type TabsProps } from "./components/Tabs/Tabs";
+export { Tag } from "./components/Tag/Tag";
+export { Textarea, type TextareaProps } from "./components/Textarea/Textarea";
+export { Textfield, type TextfieldProps } from "./components/Textfield/Textfield";
+export { ValidationMessage, type ValidationMessageProps, } from "./components/ValidationMessage/ValidationMessage";
+export { colors, severityColors, themeColors, type Color, type SeverityColors, type ThemeColor, } from "./theme-colors";