feat: `@digdir/designsystemet-web` #4409

Barsnes · 2026-01-20T11:41:35Z

resolves #1044
resolves #3348
resolves #4369
resolves #4433

Edit by @mimarz: Moved some links to resolving issues from other closed PRs which feat was moved to this PR instead.

Summary

First implementation of a new package that properly uses pure web, and has no dependencies like react.
Related to #1044

You can test this package with the npm tag test.

The preview comment is a bit buried, so putting links here as well:

Checks

I have read the contribution guidelines
I have added a changeset (run pnpm changeset if relevant)

changeset-bot · 2026-01-20T11:41:39Z

🦋 Changeset detected

Latest commit: 398c2a4

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages

Name	Type
@digdir/designsystemet-react	Patch
@digdir/designsystemet-css	Patch
@digdir/designsystemet	Patch
@digdir/designsystemet-types	Patch
@digdir/designsystemet-web	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

…dency (#4402)

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Tobias Barsnes <tobias.barsnes@digdir.no> Co-authored-by: Oddbjørn Øvernes <oddbjorn.overnes@gmail.com>

…f Designsystemet (#4321) Co-authored-by: Barsnes <tobias.barsnes@digdir.no> Co-authored-by: Michael Marszalek <mimarz@gmail.com>

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Michael Marszalek <mimarz@gmail.com>

Co-authored-by: Michael Marszalek <mimarz@gmail.com>

github-actions · 2026-01-20T12:35:08Z

Preview deployments for this pull request:

storybook - 12. Feb 2026 - 16:24

themebuilder - 12. Feb 2026 - 16:24

www - 12. Feb 2026 - 16:31

packages/react/src/components/dropdown/dropdown.tsx

packages/react/src/components/input/input.tsx

packages/react/src/components/popover/popover.tsx

.changeset/rich-ravens-remain.md

Co-authored-by: Michael Marszalek <mimarz@gmail.com>

mimarz · 2026-02-11T08:38:09Z

packages/web/main.ts

@@ -0,0 +1,4 @@
+import '@digdir/designsystemet-css';
+import '@digdir/designsystemet-theme';


Assume this was supposed to be theme file?

Suggested change

import '@digdir/designsystemet-theme';

import '@digdir/designsystemet-css/theme';

no, and we should not merge this.
We augment in vite so we can use that import:

ok, but why alias a deprecated package at not just use the new package/method for fetching theme, or for that matter just relative paths?

oddvernes · 2026-02-12T14:22:52Z

apps/www/app/content/components/dialog/no/code.mdx


+### Med command og uten context
+
+Dersom du ikke vil bruke `Dialog.TriggerContext`, kan du bruke `command="show-modal"` eller `command="--show-non-modal"` og `commandfor="DIALOG-ID"` for å åpne dialogen fra en ekstern trigger.


Given that this may be the first place some developers see command and commandfor, should we perhaps add a little info-box or something in these places invoker-commands are mentioned, that this is actually a new part of the web standard, link to the google developers post or mdn article, and note that we automatically polyfill this (I know it is mentioned in the readme, but it is maybe useful to include here as well)?

unekinn and others added 8 commits January 20, 2026 13:26

chore: script "update:theme" in root didn't work due to lacking depen…

f6904cb

…dency (#4402)

fix(deps): update dependency zod-validation-error to v5 (#4401)

8397877

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Tobias Barsnes <tobias.barsnes@digdir.no> Co-authored-by: Oddbjørn Øvernes <oddbjorn.overnes@gmail.com>

docs: simplify the getting started process and clarify the benefits o…

7a930a5

…f Designsystemet (#4321) Co-authored-by: Barsnes <tobias.barsnes@digdir.no> Co-authored-by: Michael Marszalek <mimarz@gmail.com>

chore(deps): update node.js to v24 (#4400)

0bf20a3

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com> Co-authored-by: Michael Marszalek <mimarz@gmail.com>

chore: fix docker image sha

9c26144

feat(react): enable sideEffects (#4376)

12acd76

Co-authored-by: Michael Marszalek <mimarz@gmail.com>

gerge remote-tracking branch 'origin/main' into fix/designsystemet-web

d371944

add web command to root

060040f

eirikbacker and others added 20 commits January 20, 2026 13:37

fix: more css moving

5e47823

style all buttons and a in pagination

c76e4d4

togglegroup style label as button

e5e5dfc

togglegroup fix

a4fcb61

fix: rewrite field and fieldset

92ddf1e

fix: index.html

0a178de

pagination current

bf21985

update todos

6bf9655

autoplacement attr for pop

9ebdaa6

fix: more work on field

02e8396

start implementing tabs

4ee9085

update u-tabs

0406358

tabs "working" in react

a855199

types in react

d5207e4

working better but not controlled

3cec8aa

controlled tabs

af2790a

fix: tooltip and start counter

51edb35

start porting tooltip

2cf7c68

make string tooltips work

8b513d8

add support for placement and autoplacement on target

29eae83

Barsnes added 6 commits February 11, 2026 07:39

Create rich-ravens-remain.md

e898466

Create old-eyes-listen.md

0fba68e

Create brave-berries-kneel.md

bc228b9

Create calm-weeks-rescue.md

1d23397

Create swift-planes-admire.md

57a49ce

Create ten-crabs-wave.md

418a6c7

Barsnes commented Feb 11, 2026

View reviewed changes

packages/react/src/components/dropdown/dropdown.tsx Outdated Show resolved Hide resolved

Barsnes added 2 commits February 11, 2026 07:48

Create silent-needles-smash.md

a33b681

Create real-worms-act.md

3038907

Barsnes commented Feb 11, 2026

View reviewed changes

packages/react/src/components/input/input.tsx Outdated Show resolved Hide resolved

Create neat-boats-learn.md

e389c5a

Barsnes commented Feb 11, 2026

View reviewed changes

packages/react/src/components/popover/popover.tsx Show resolved Hide resolved

Barsnes and others added 7 commits February 11, 2026 07:57

Create silent-coins-begin.md

026a565

Create gentle-eagles-cry.md

4bffe4f

Create stupid-tigers-judge.md

c0b35c0

Create small-baboons-grin.md

d4e25bf

biome

6f71d28

fix changeset package

c5347ca

fix(suggestion): add placement as css prop

989666a

mimarz reviewed Feb 11, 2026

View reviewed changes

.changeset/rich-ravens-remain.md Outdated Show resolved Hide resolved

eirikbacker and others added 2 commits February 11, 2026 09:31

fix: use shared placement prop

cd9016c

Update .changeset/rich-ravens-remain.md

2537e93

Co-authored-by: Michael Marszalek <mimarz@gmail.com>

mimarz reviewed Feb 11, 2026

View reviewed changes

eirikbacker and others added 5 commits February 11, 2026 13:34

fix(tooltip): performance and esc-button fix

59d003d

revert deprecated togglegroup file

ae023f0

Create long-moose-join.md

cc96c01

suggestion: fix a minor typo in warning text

9df9a0f

add web package test to test workflow

c92d7f2

oddvernes reviewed Feb 12, 2026

View reviewed changes

fix test

398c2a4

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: `@digdir/designsystemet-web` #4409

feat: `@digdir/designsystemet-web` #4409

Barsnes commented Jan 20, 2026 •

edited by mimarz

Loading

Uh oh!

changeset-bot bot commented Jan 20, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Jan 20, 2026 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

mimarz Feb 11, 2026

Uh oh!

Barsnes Feb 11, 2026

Uh oh!

mimarz Feb 12, 2026 •

edited

Loading

Uh oh!

oddvernes Feb 12, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

		@@ -0,0 +1,4 @@
		import '@digdir/designsystemet-css';
		import '@digdir/designsystemet-theme';

	import '@digdir/designsystemet-theme';
	import '@digdir/designsystemet-css/theme';


		### Med command og uten context

		Dersom du ikke vil bruke `Dialog.TriggerContext`, kan du bruke `command="show-modal"` eller `command="--show-non-modal"` og `commandfor="DIALOG-ID"` for å åpne dialogen fra en ekstern trigger.

feat: @digdir/designsystemet-web #4409

Are you sure you want to change the base?

feat: @digdir/designsystemet-web #4409

Conversation

Barsnes commented Jan 20, 2026 • edited by mimarz Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Checks

Uh oh!

changeset-bot bot commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

github-actions bot commented Jan 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

mimarz Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

Barsnes Feb 11, 2026

Choose a reason for hiding this comment

Uh oh!

mimarz Feb 12, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

oddvernes Feb 12, 2026

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

feat: `@digdir/designsystemet-web` #4409

feat: `@digdir/designsystemet-web` #4409

Barsnes commented Jan 20, 2026 •

edited by mimarz

Loading

changeset-bot bot commented Jan 20, 2026 •

edited

Loading

github-actions bot commented Jan 20, 2026 •

edited

Loading

mimarz Feb 12, 2026 •

edited

Loading