v1.11.0

@digdir/[email protected]

Minor Changes

• Version 1.10.0 was released by accident, and we are skipping to 1.11.0 (#4392)
  • Version 1.10.0 is deprecated on npm, and not accessible on Github. Use 1.11.0 or newer.

Patch Changes

• update npm non-major dependencies (#4373)

• Update dependency zod-validation-error to v5 (#4401)

• Update dependency colorjs.io to ^0.6.0 (#4372)

• Remove change-case as dependency (#4343)

• Update @types/node to 24.10.7 (#4396)

  • This does not affect the node versions we support

• update npm non-major dependencies (#4336)

• update npm non-major dependencies (#4398)

• Update npm non-major dependencies (#4347)

• Updated dependencies [4d48a81]:

  • @digdir/[email protected]

@digdir/[email protected]

Minor Changes

• Version 1.10.0 was released by accident, and we are skipping to 1.11.0 (#4392)

  • Version 1.10.0 is deprecated on npm, and not accessible on Github. Use 1.11.0 or newer.

• avatar-stack: New experimental component (#4331)

Patch Changes

• avatar: added --dsc-avatar-font-size to easier override font size (#4331)

• Hover styles for cards containing <a> inside a heading will no longer propagate to wrapping cards (#4360)

• update npm non-major dependencies (#4336)

• card: Fix focus being clipped on nested <summary> (#4379)

• Dialog: removed media-query that forces 100% width under 640px (#4345)

• dialog: More gentle animations when using data-placement (#4350)

• Updated dependencies [4d48a81]:

  • @digdir/[email protected]

@digdir/[email protected]

Minor Changes

• Version 1.10.0 was released by accident, and we are skipping to 1.11.0 (#4392)

  • Version 1.10.0 is deprecated on npm, and not accessible on Github. Use 1.11.0 or newer.

• Avatar: added asChild prop (#4331)

• AvatarStack: New experimental component (#4331)

• Suggestion: Add new prop autoPlacement, which is by default true (#4359)

  • This means that Suggestion will now try to stay within the viewport on the y-axis

Patch Changes

• update npm non-major dependencies (#4373)

• Removed sideEffects:false property used by some bundlers to help tree-shake cjs files. (#4376)

• update npm non-major dependencies (#4336)

• update npm non-major dependencies (#4398)

• Suggestion: Always call onSelectedChange, and return null instead of undefined (#4388)

• Update npm non-major dependencies (#4347)

• Updated dependencies [4d48a81]:

  • @digdir/[email protected]

@digdir/[email protected]

Minor Changes

• Version 1.10.0 was released by accident, and we are skipping to 1.11.0 (#4392)

  • Version 1.10.0 is deprecated on npm, and not accessible on Github. Use 1.11.0 or newer.

• ⚠️ THIS PACKAGE IS DEPRECATED ⚠️ (#4366)
  Use @digdir/designsystemet-css/theme for default theme or make your own using the Theme builder

Patch Changes

• Updated dependencies [4d48a81]:
  • @digdir/[email protected]

@digdir/[email protected]

Minor Changes

• Version 1.10.0 was released by accident, and we are skipping to 1.11.0 (#4392)
  • Version 1.10.0 is deprecated on npm, and not accessible on Github. Use 1.11.0 or newer.

v1.9.0

@digdir/[email protected]

Minor Changes

• Add ability to override focus colors from config: (#4320)

  {
    "overrides": {
      "focus": {
        "inner": { "light": "HEX", "dark": "HEX" },
        "outer": { "light": "HEX", "dark": "HEX" }
      }
    }
  }

  This comes with a change to you design tokens, where focus colors are now on the theme layer.
  Make sure you rebuild your tokens: npx @digdir/designsystemet tokens create <options> --clean

Patch Changes

• Update @tokens-studio/sd-transforms to 2.0.3 (#4315)

• Updated dependencies []:

  • @digdir/[email protected]

@digdir/[email protected]

Minor Changes

• Dialog: data-placement selector styles the Dialog as a "drawer"-component from the direction given (left | right | top | bottom or center which is the default) (#4323)
  Added 3 new local variables:
  • --dsc-dialog-placement-inline-max-width (max-width when placement="left | right")
  • --dsc-dialog-placement-block-max-width (max-width when placement="top | bottom")
  • --dsc-dialog-transition-duration (duration for the slide in animations)

Patch Changes

• Input, Search, Suggestion, Textfield: Uppercase Å was cut off at the top in Chrome and Safari, making it look like Ă (#4301)

• link: Style background, border, and padding regardless of default browser styles (#4231) (#4302)

• Add export for a default theme under /theme. (#4328)
  If you are using the default theme from @digdir/designsystemet-theme, we recommend importing the CSS from @digdir/designsystemet-css/theme.css and removing @digdir/designsystemet-theme from your dependencies.

@digdir/[email protected]

Minor Changes

• Dialog: added placement prop. This will set data-placement and style the Dialog as a "drawer"-component from the direction given: left | right | top | bottom or center (default) (#4323)

Patch Changes

• SuggestionClear: send onClick. In earlier versions onClick was never called (#4327)

• Popover: Fix controlled open state going out of sync (#4314)

• Update npm non-major dependencies (#4308)

• Updated dependencies []:

  • @digdir/[email protected]

@digdir/[email protected]

Patch Changes

• Export designsystemet.css under @digdir/designsystemet-theme/index.css (#4291)

• Updated dependencies []:

  • @digdir/[email protected]

@digdir/[email protected]

v1.8.0

@digdir/designsystemet-theme

Minor Changes

• Move submodule @digdir/designsystemet/types to a new package @digdir/designsystemet-types and change all references. (#4241)

  After re-running tokens build downstream, this removes transitive dependencies on runtime dependencies on CLI tools like commander and style-dictionary which are never used in runtime, but are required for the CLI to function. It also makes code which doesn't use the CLI unaffected by our node version limitations (currently >= 22 due to style-dictionary).

  @digdir/designsystemet/types is preserved for now as a deprecated re-export of @digdir/designsystemet-types to avoid breaking people's builds.

Patch Changes

• Update npm non-major dependencies (#4262)

• Updated dependencies [c2faf2e]:

  • @digdir/[email protected]

@digdir/designsystemet-react

Minor Changes

• Move submodule @digdir/designsystemet/types to a new package @digdir/designsystemet-types and change all references. (#4241)

  After re-running tokens build downstream, this removes transitive dependencies on runtime dependencies on CLI tools like commander and style-dictionary which are never used in runtime, but are required for the CLI to function. It also makes code which doesn't use the CLI unaffected by our node version limitations (currently >= 22 due to style-dictionary).

  @digdir/designsystemet/types is preserved for now as a deprecated re-export of @digdir/designsystemet-types to avoid breaking people's builds.

Patch Changes

• Update npm non-major dependencies (#4275)

• Update npm non-major dependencies (#4242)

• Popover: Fix unnecesary call of onOpen and missing call of onClose (#4230)

  • Don't call onOpen when clicking Popover.Trigger when Popover is already open.
  • Call onClose when a controlled Popover is closed by clicking on Popover.Trigger.

• Update npm non-major dependencies (#4262)

• Update react and react-dom to 19.2.1 (#4276)

• Updated dependencies [c2faf2e]:

  • @digdir/[email protected]

@digdir/designsystemet-css

Patch Changes

• badge: Set display: inline-flex on .ds-badge (#4269)

• Update npm non-major dependencies (#4242)

• select: Fix :hover on <label> adding border to <select> (#4248)

• Update npm non-major dependencies (#4262)

@digdir/designsystemet

Minor Changes

• Move submodule @digdir/designsystemet/types to a new package @digdir/designsystemet-types and change all references. (#4241)

  After re-running tokens build downstream, this removes transitive dependencies on runtime dependencies on CLI tools like commander and style-dictionary which are never used in runtime, but are required for the CLI to function. It also makes code which doesn't use the CLI unaffected by our node version limitations (currently >= 22 due to style-dictionary).

  @digdir/designsystemet/types is preserved for now as a deprecated re-export of @digdir/designsystemet-types to avoid breaking people's builds.

Patch Changes

• Update npm non-major dependencies (#4275)

• Update npm non-major dependencies (#4242)

• Update npm non-major dependencies (#4262)

• Update dependency @tokens-studio/sd-transforms to v2 (#4271)

• Updated dependencies [c2faf2e]:

  • @digdir/[email protected]

@digdir/[email protected]

Minor Changes

• Move submodule @digdir/designsystemet/types to a new package @digdir/designsystemet-types and change all references. (#4241)

  After re-running tokens build downstream, this removes transitive dependencies on runtime dependencies on CLI tools like commander and style-dictionary which are never used in runtime, but are required for the CLI to function. It also makes code which doesn't use the CLI unaffected by our node version limitations (currently >= 22 due to style-dictionary).

  @digdir/designsystemet/types is preserved for now as a deprecated re-export of @digdir/designsystemet-types to avoid breaking people's builds.

v1.7.3

@digdir/[email protected]

@digdir/[email protected]

@digdir/[email protected]

Patch Changes

• Update npm non-major dependencies (#4233)

• Tooltip: Check if trim() is available (#4239)

  • Fixes if Tooltip has <svg> as a child

@digdir/[email protected]

v1.7.2

@digdir/[email protected]

Patch Changes

• Add option to override linkVisited color in config: (#4182)

  "theme": {
    "overrides": {
      "linkVisited": {
        "light": "#ff1234",
        "dark": "#1234ff"
      }
    }
  }

• New command that lets you generate a config file from your design tokens: (#4207)
  npx @digdir/designsystemet generate-config-from-tokens --dir <path to design tokens>

  • This command does not include any overrides you may have done.

• Update npm non-major dependencies (#4193)

• Update npm non-major dependencies (#4214)

• For your config file, you can now get the schema file from designsystemet.no (#4195)

  "$schema": "https://designsystemet.no/schemas/cli/[VERSION].json"

@digdir/[email protected]

Patch Changes

• input: Remove hover effect when <label> is hovered (#4196)

• tag: Add new variant, [data-variant="outline"]. (#4173)

  • To use the old variant, either don't set data-variant, or set it to default.

• Update npm non-major dependencies (#4214)

• card: Add support for <picture> (#4137)

• search: Don't set position: relative, but use isolation: isolate on .ds-search (#4212)

  • This removes z-index on button[type="reset"]

• tag: New css variables to go with [data-variant="outline"]: (#4173)

  • --dsc-tag-border-width
  • --dsc-tag-border-color
  • --dsc-tag-border-style

@digdir/[email protected]

Patch Changes

• Update @u-elements/combobox to v1.0.4 (#4226)

• Dialog: If the browser supports closedBy on <dialog>, we let the browser handle it (#4210)

• Tooltip: Tooltip is now automatically aria-describedby or aria-labelledby based on the content of the trigger component. (#4202)

  • This can be overridden with the new type-prop that accepts decribedby or labelledby.

• Update npm non-major dependencies (#4193)

• Update npm non-major dependencies (#4214)

• Tag: Add new prop variant (#4173)

  • Accepts default|outline. default is the default value.

@digdir/[email protected]

Patch Changes

• Update npm non-major dependencies (#4214)

v1.7.1

@digdir/[email protected]

@digdir/[email protected]

@digdir/[email protected]

Patch Changes

• Suggestion: Fix onSelectedChange not always calling the latest callback (#4176)

@digdir/[email protected]

v1.7.0

@digdir/[email protected]

Minor Changes

• Restructure design tokens: (#4105)

  • Removes primitives/modes/color-scheme/[dark/light]/global.json
  • Removes global colors (red, green, blue, orange, purple)
  • Moved severity colors directly to your theme file
  • "link.color.visited" now references "$value": "color.link.visited" from your theme file

  Make sure to regenerate your design tokens: npx @digdir/designsystemet tokens create <options> --clean

Patch Changes

• Update npm non-major dependencies (#4147)

• Export zod schema and type for config file: (#4170)

  • configSchema
  • type ConfigSchema

• Add option override severity colors from config. (#4105)
  You can override the base-hexcode, as well as individual steps:

  "theme": {
    "overrides": {
      "colors": {
        "danger": {
          "background-default": {
            "light": "#0000ff",
            "dark": "#0000ff"
          }
        }
      },
      "severity": {
        "danger": "#ff00ff"
      }
    }
  }

• Update npm non-major dependencies (#4167)

• Update dependency ramda to ^0.32.0 (#4146)

@digdir/[email protected]

Patch Changes

• Field: Set display: block on <label> (#4134)

• ToggleGroup: ensure ToggleGroup has same height as Button, and that individual buttons within the group never wrap their text (#4139)

• ToggleGroup: use correct border-color (--ds-color-text-default) to match text/icon color on selected button in secondary variant (#4139)

• Label: Use line-height: var(--ds-body-md-line-height); (#4134)

• Field: data-field="description" no longer gets margin-top (#4134)

• chip: Remove hover effect on .ds-input (#4165)

@digdir/[email protected]

Patch Changes

• Update npm non-major dependencies (#4147)

• Suggestion, Tooltip, Popover: Positioning of floating elements rounded to nearest pixel (#4142)

• Update npm non-major dependencies (#4167)

• Dialog: Removed the autofocus attribute from built in closeButton, which prevented setting autofocus on other elements in Dialog. (#4159)

• Field.Counter: Adjustments to how it works internally. (#4140)
  Now, none of the validation messages underneath are aria-described on the input/textarea. This is done by an aria-live region only for screenreaders.

  A new hint prop has been added, to announce how many characters are allowed when entering the input/textarea. Default value is 'Maks %d tegn tillatt.'.

@digdir/[email protected]

Patch Changes

• Update design-tokens to reflect changes made in @digdir/designsystemet. See changelog for changes (#4105)

v1.6.1

@digdir/[email protected]

Patch Changes

• Update npm non-major dependencies (#4129)

• Update npm non-major dependencies (#4110)

@digdir/[email protected]

Patch Changes

• pagination: If direct child of li has aria-hidden="true" it sets visibility: hidden; (#4123)

• input: Add outline on :hover when not :focus-visible, :disabled or [readonly]. This adds a few new CSS variables: (#4125)

  • --dsc-input-outline-color--hover
  • --dsc-input-outline-color--toggle--hover
  • --dsc-input-outline-width--hover
  • --dsc-input-outline-style--hover

• Chip, Tag: Ensure font size scales correctly with the current size mode by using the token --ds-body-sm-font-size. Note: there might be a small visual change for Chip used without explicit data-size, since it used to have font-size: 90%. (#4098)

@digdir/[email protected]

Patch Changes

• Button: For icon-buttons, dont render children if loading is true (#4023)

• Update npm non-major dependencies (#4129)

• Suggestion: Updated u-combobox to 1.0.2 to fix a bug where input would not clear in conrolled mode (#4119)

• Update npm non-major dependencies (#4110)

• usePagination: Hide prev/next buttons with aria-hidden="true" and visibility: hidden; instead of disabling (#4123)

• Textfield: Move counter error message before error (#4104)

@digdir/[email protected]

v1.6.0

@digdir/[email protected]

Patch Changes

• Add possiblity to override colors in config: (#4073)

  "theme": {
    "overrides": {
      "colors": {
        "dominant": {
          "background-default": {
            "light": "#ff0000",
            "dark": "#000fff"
          },
          "background-tinted": {
            "light": "#f0ff00",
            "dark": "#ff00ff"
          }
        }
      }
    }
  }

• Font size variables are now rounded to the nearest pixel. This affects size modes "sm" and "lg", which had subpixel values after v1.5.0. (#4070)

• Update npm non-major dependencies (#4093)

• Update supported engines. Now supports node >=20 <25 (#3925)

@digdir/[email protected]

Minor Changes

• toggle-group: Added new secondary design available with data-variant="secondary" (or variant="secondary" in react) (#4092)

• toggle-group: Changed border-radius to --ds-border-radius-default, border-color to --ds-color-border-default and color to --ds-color-text-default. (#4092)

Patch Changes

• link: Change :focus-visible styling to use border, not background (#4095)

  • Removes --dsc-link-background--focus
  • Removes --dsc-link-color--focus

• link: Add --dsc-link-border-radius, default is var(--ds-border-radius-md) (#4095)

• Dropdown: Dropdown.Heading (h2-h6) - changed color to text-default and font-weight to 500 (#4076)

@digdir/[email protected]

Minor Changes

• ToggleGroup: Added new prop variant to enable new secondary design option (#4092)

Patch Changes

• Spinner: Allow using aria-hidden when aria-label is set, which can be useful to hide or show the element from the accessibility tree based on some UI state like whether a visual label is also rendered. (#4077)

• Update npm non-major dependencies (#4093)

• Avatar: Allow using aria-hidden instead of aria-label in situations with visible text (#4077)

@digdir/[email protected]

Patch Changes

• Font size variables are now rounded to the nearest pixel. This affects size modes "sm" and "lg", which had subpixel values after v1.5.0. (#4070)

v1.5.1

@digdir/[email protected]

Patch Changes

• Update dependency @types/ramda to ^0.31.1 (#4060)

@digdir/[email protected]

Patch Changes

• Field: Make sure <select> and <textarea> is not on same line as label (#4048)

@digdir/[email protected]

Patch Changes

• Field.Counter: Update count when react controls the input (#4047)

• Popover: Only call onClose when Popover is open (#4065)

@digdir/[email protected]