Version Packages (#2708 )

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Date/MonthPicker: Justeringer JSDOC og eksempel-desc (#2704 )
2026-10-13 17:22:02 +00:00 · 2024-02-07 12:26:07 +01:00 · 2024-02-07 09:42:37 +01:00 · 2024-02-07 09:30:27 +01:00 · 2024-02-06 18:02:00 +01:00 · 2024-02-06 18:01:43 +01:00
31 changed files with 321 additions and 127 deletions
@@ -2,6 +2,9 @@ name: Release

 on:
  push:
+    paths:
+      - ".changeset/**"
+      - "@navikt/**"
    branches:
      - main
  workflow_dispatch:
@@ -1,5 +1,7 @@
 # @navikt/aksel-icons

+## 5.18.0
+
 ## 5.17.5

 ## 5.17.4
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/aksel-icons",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "author": "Aksel | NAV",
  "homepage": "https://aksel.nav.no/ikoner",
  "repository": {
@@ -1,5 +1,7 @@
 # @navikt/aksel-stylelint

+## 5.18.0
+
 ## 5.17.5

 ## 5.17.4
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/aksel-stylelint",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "author": "Aksel | NAV",
  "homepage": "https://aksel.nav.no/grunnleggende/kode/stylelint",
  "repository": {
@@ -35,8 +35,8 @@
    "dev": "yarn watch:lint"
  },
  "devDependencies": {
-    "@navikt/ds-css": "^5.17.5",
-    "@navikt/ds-tokens": "^5.17.5",
+    "@navikt/ds-css": "^5.18.0",
+    "@navikt/ds-tokens": "^5.18.0",
    "@types/jest": "^29.0.0",
    "concurrently": "7.2.1",
    "copyfiles": "2.4.1",
@@ -1,5 +1,12 @@
 # @navikt/aksel

+## 5.18.0
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-css@5.18.0
+
 ## 5.17.5

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/aksel",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "description": "Aksel command line interface. Handles css-imports, codemods and more",
  "author": "Aksel | NAV designsystem team",
  "license": "MIT",
@@ -29,7 +29,7 @@
  },
  "homepage": "https://aksel.nav.no/grunnleggende/kode/kommandolinje",
  "dependencies": {
-    "@navikt/ds-css": "5.17.5",
+    "@navikt/ds-css": "5.18.0",
    "axios": "1.6.0",
    "chalk": "4.1.0",
    "clipboardy": "^2.3.0",
@@ -1,5 +1,7 @@
 # @navikt/ds-css

+## 5.18.0
+
 ## 5.17.5

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-css",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "description": "CSS for NAV Designsystem",
  "author": "Aksel | NAV designsystem team",
  "keywords": [
@@ -27,7 +27,7 @@
    "css:get-version": "node config/get-version.js"
  },
  "devDependencies": {
-    "@navikt/ds-tokens": "^5.17.5",
+    "@navikt/ds-tokens": "^5.18.0",
    "cssnano": "6.0.0",
    "fast-glob": "3.2.11",
    "lodash": "4.17.21",
@@ -1,5 +1,17 @@
 # @navikt/ds-react

+## 5.18.0
+
+### Minor Changes
+
+- Portal: Ny komponent `Portal` som lar deg enkelt bruke `createPortal`, også på serversiden ([#2697](https://github.com/navikt/aksel/pull/2697))
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @navikt/ds-tokens@5.18.0
+  - @navikt/aksel-icons@5.18.0
+
 ## 5.17.5

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-react",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "description": "Aksel react-components for NAV designsystem",
  "author": "Aksel | NAV designsystem team",
  "license": "MIT",
@@ -38,8 +38,8 @@
  },
  "dependencies": {
    "@floating-ui/react": "0.25.4",
-    "@navikt/aksel-icons": "^5.17.5",
-    "@navikt/ds-tokens": "^5.17.5",
+    "@navikt/aksel-icons": "^5.18.0",
+    "@navikt/ds-tokens": "^5.18.0",
    "@radix-ui/react-tabs": "1.0.0",
    "@radix-ui/react-toggle-group": "1.0.0",
    "clsx": "^1.2.1",
@@ -53,7 +53,7 @@ export interface UseDatepickerOptions
   * Allows input of with 'yy' year format.
   * @default true
   * @Note Decision between 20th and 21st century is based on before(todays year - 80) ? 21st : 20th.
-   * In 2023 this equals to 1943 - 2042
+   * In 2024 this equals to 1944 - 2043
   */
  allowTwoDigitYear?: boolean;
  /**
@@ -39,7 +39,7 @@ export interface UseMonthPickerOptions
   * Allows input of with 'yy' year format.
   * @default true
   * @Note Decision between 20th and 21st century is based on before(todays year - 80) ? 21st : 20th.
-   * In 2023 this equals to 1943 - 2042
+   * In 2024 this equals to 1944 - 2043
   */
  allowTwoDigitYear?: boolean;
  /**
@@ -15,7 +15,7 @@ export interface DateInputProps
   */
  label: React.ReactNode;
  /**
-   * Shows label and description for screenreaders-only
+   * Shows label and description for screen readers only
   * @default false
   */
  hideLabel?: boolean;
@@ -10,6 +10,7 @@ export * from "./expansion-card";
 export * from "./form";
 export * from "./grid";
 export * from "./guide-panel";
+export * from "./overlays";
 export * from "./help-text";
 export * from "./internal-header";
 export * from "./link";
@@ -0,0 +1,2 @@
+export { Portal } from "./portal/Portal";
+export type { PortalProps } from "./portal/Portal";
@@ -0,0 +1,99 @@
+import React from "react";
+import { Box } from "../../layout/box";
+import { Provider } from "../../provider";
+import { Portal } from "./Portal";
+
+export default {
+  title: "Utilities/Portal",
+  parameters: {
+    chromatic: { disable: true },
+  },
+};
+
+export const Default = () => {
+  return (
+    <Box background="surface-neutral-subtle" border>
+      <h1>In regular DOM tree</h1>
+      <p>
+        Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus
+        necessitatibus quis esse nesciunt est velit voluptatibus. Distinctio eum
+        commodi tempora unde. Nulla vel tempora incidunt? Voluptatem molestias
+        impedit commodi. Tenetur!
+      </p>
+      <Portal>
+        <h1>Inside Portal to different DOM tree</h1>
+        <p>
+          Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus
+          necessitatibus quis esse nesciunt est velit voluptatibus. Distinctio
+          eum commodi tempora unde. Nulla vel tempora incidunt? Voluptatem
+          molestias impedit commodi. Tenetur!
+        </p>
+      </Portal>
+    </Box>
+  );
+};
+
+export const CustomPortalRoot = () => {
+  const [portalContainer, setPortalContainer] =
+    React.useState<HTMLDivElement | null>(null);
+
+  return (
+    <Box background="surface-neutral-subtle">
+      <Box background="surface-alt-1-subtle">
+        <h1>Tree A</h1>
+        <Portal rootElement={portalContainer}>
+          <p>This is mounted to Tree B, while created inside Tree A</p>
+        </Portal>
+      </Box>
+      <Box background="surface-alt-3-subtle" ref={setPortalContainer}>
+        <h1>Tree B</h1>
+      </Box>
+    </Box>
+  );
+};
+
+export const CustomPortalRootFromProvider = () => {
+  const [portalContainer, setPortalContainer] =
+    React.useState<HTMLDivElement>();
+
+  return (
+    <Provider rootElement={portalContainer}>
+      <Box background="surface-neutral-subtle">
+        <Box background="surface-alt-1-subtle">
+          <h1>Tree A</h1>
+          <Portal>
+            <p>This is mounted to Tree B, while created inside Tree A</p>
+          </Portal>
+        </Box>
+        <Box background="surface-alt-3-subtle" ref={setPortalContainer}>
+          <h1>Tree B</h1>
+        </Box>
+      </Box>
+    </Provider>
+  );
+};
+
+export const AsChild = () => {
+  return (
+    <Box background="surface-neutral-subtle" border>
+      <h1>In regular DOM tree</h1>
+      <p>
+        Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus
+        necessitatibus quis esse nesciunt est velit voluptatibus. Distinctio eum
+        commodi tempora unde. Nulla vel tempora incidunt? Voluptatem molestias
+        impedit commodi. Tenetur!
+      </p>
+      <Portal asChild>
+        <div data-this-is-the-child>
+          <h1>Inside Portal to different DOM tree</h1>
+          <p>
+            Lorem ipsum dolor sit amet consectetur adipisicing elit. Temporibus
+            necessitatibus quis esse nesciunt est velit voluptatibus. Distinctio
+            eum commodi tempora unde. Nulla vel tempora incidunt? Voluptatem
+            molestias impedit commodi. Tenetur!
+          </p>
+        </div>
+      </Portal>
+    </Box>
+  );
+};
@@ -0,0 +1,32 @@
+import React, { HTMLAttributes, forwardRef } from "react";
+import ReactDOM from "react-dom";
+import { useProvider } from "../../provider";
+import { Slot } from "../../util/Slot";
+import { AsChildProps } from "../../util/types";
+
+interface PortalBaseProps extends HTMLAttributes<HTMLDivElement> {
+  /**
+   * An optional container where the portaled content should be appended.
+   */
+  rootElement?: HTMLElement | null;
+}
+
+export type PortalProps = PortalBaseProps & AsChildProps;
+
+export const Portal = forwardRef<HTMLDivElement, PortalProps>(
+  ({ rootElement, asChild, ...rest }, ref) => {
+    const contextRoot = useProvider()?.rootElement;
+    const root = rootElement ?? contextRoot ?? globalThis?.document?.body;
+
+    const Component = asChild ? Slot : "div";
+
+    return root
+      ? ReactDOM.createPortal(
+          <Component ref={ref} data-aksel-portal="" {...rest} />,
+          root,
+        )
+      : null;
+  },
+);
+
+export default Portal;
@@ -1,5 +1,4 @@
 import {
-  FloatingPortal,
  autoUpdate,
  arrow as flArrow,
  flip,
@@ -21,7 +20,7 @@ import React, {
  useRef,
 } from "react";
 import { ModalContext } from "../modal/ModalContext";
-import { useProvider } from "../provider";
+import Portal from "../overlays/portal/Portal";
 import { Detail } from "../typography";
 import { useId } from "../util/hooks";
 import { useControllableState } from "../util/hooks/useControllableState";
@@ -123,10 +122,7 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(

    const arrowRef = useRef<HTMLDivElement | null>(null);
    const modalContext = useContext(ModalContext);
-    const providerRootElement = useProvider()?.rootElement;
-    const rootElement = modalContext
-      ? modalContext.ref.current
-      : providerRootElement;
+    const rootElement = modalContext ? modalContext.ref.current : undefined;

    const {
      x,
@@ -199,7 +195,7 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(
              : children?.props["aria-describedby"],
          }),
        )}
-        <FloatingPortal root={rootElement}>
+        <Portal rootElement={rootElement}>
          {_open && (
            <div
              {...getFloatingProps({
@@ -253,7 +249,7 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipProps>(
              )}
            </div>
          )}
-        </FloatingPortal>
+        </Portal>
      </>
    );
  },
@@ -20,10 +20,12 @@ export const Slot = React.forwardRef<HTMLElement, SlotProps>(
    }

    if (React.Children.count(children) > 1) {
-      console.error(
+      const error = new Error(
        "Aksel: Components using 'asChild' expects to recieve a single React element child.",
      );
-      return React.Children.only(null);
+      error.name = "SlotError";
+      Error.captureStackTrace?.(error, Slot);
+      throw error;
    }

    return null;
@@ -0,0 +1,37 @@
+export type AsChildProps =
+  | {
+      children: React.ReactElement | false | null;
+      /**
+       * Renders the component and its child as a single element,
+       * merging the props of the component with the props of the child.
+       *
+       * @example
+       * ```tsx
+       * <Component asChild data-prop>
+       *   <ChildComponent data-child />
+       * </Component>
+       *
+       * // Renders
+       * <MergedComponent data-prop data-child />
+       * ```
+       */
+      asChild: true;
+    }
+  | {
+      children: React.ReactNode;
+      /**
+       * Renders the component and its child as a single element,
+       * merging the props of the component with the props of the child.
+       *
+       * @example
+       * ```tsx
+       * <Component asChild data-prop>
+       *   <ChildComponent data-child />
+       * </Component>
+       *
+       * // Renders
+       * <MergedComponent data-prop data-child />
+       * ```
+       */
+      asChild?: false;
+    };
@@ -1 +1,2 @@
 export type { OverridableComponent } from "./OverridableComponent";
+export type { AsChildProps } from "./AsChildProps";
@@ -1,5 +1,7 @@
 # @navikt/ds-tailwind

+## 5.18.0
+
 ## 5.17.5

 ## 5.17.4
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-tailwind",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "description": "Tailwind config based on @navikt/ds-tokens",
  "author": "Aksel | NAV designsystem team",
  "keywords": [
@@ -24,7 +24,7 @@
    "directory": "@navikt/core/tailwind"
  },
  "devDependencies": {
-    "@navikt/ds-tokens": "^5.17.5",
+    "@navikt/ds-tokens": "^5.18.0",
    "@types/jest": "^29.0.0",
    "color": "4.2.3",
    "jest": "^29.0.0",
@@ -1,5 +1,7 @@
 # @navikt/ds-tokens

+## 5.18.0
+
 ## 5.17.5

 ## 5.17.4
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-tokens",
-  "version": "5.17.5",
+  "version": "5.18.0",
  "description": "Design-tokens for NAV designsystem",
  "author": "Aksel | NAV designsystem team",
  "keywords": [
@@ -1,5 +1,11 @@
 # Changelog

+## 5.18
+
+### @navikt/ds-react
+
+- Portal: Ny komponent `Portal` som lar deg enkelt bruke `createPortal`, også på serversiden ([#2697](https://github.com/navikt/aksel/pull/2697))
+
 ## 5.17

 ### @navikt/ds-css
@@ -80,6 +86,10 @@

 - Page: Lagt til ny bakgrunnsfarge `surface-subtle` og ny maksbredde på Page.Block `text` ([#2572](https://github.com/navikt/aksel/pull/2572))

+### @navikt/ds-tokens
+
+- Tokens: Ny token `--a-text-width-max: 576px` ([#2572](https://github.com/navikt/aksel/pull/2572))
+
 ### @navikt/ds-react

 - Accordion.Item, Dropdown, ReadMore og Tooltip: Har en ny prop `onOpenChange?: (open: boolean) => void;` som forteller nå-state når `open`-state endrer seg. Dette vil være nyttig hvis man ikke bruker controlled-state, men fortsatt ønsker å vite om komponenten er `open` eller ikke (f.eks logging). ([#2585](https://github.com/navikt/aksel/pull/2585))
@@ -88,10 +98,6 @@

 * Page: Lagt til ny bakgrunnsfarge `surface-subtle` og ny maksbredde på Page.Block `text` ([#2572](https://github.com/navikt/aksel/pull/2572))

-### @navikt/ds-tokens
-
- Tokens: Ny token `--a-text-width-max: 576px` ([#2572](https://github.com/navikt/aksel/pull/2572))
-
 ## 5.12

 ### @navikt/aksel-stylelint
@@ -256,6 +262,10 @@

 - :lipstick: CopyButton: Justert padding, gap og animasjon ([#2355](https://github.com/navikt/aksel/pull/2355))

+### @navikt/ds-tokens
+
+- Ny spacing token på 0.375rem ([#2370](https://github.com/navikt/aksel/pull/2370))
+
 ### @navikt/ds-react

 - :lipstick: Chips.Toggle: Ikon i uvalgt tilstand ([#2395](https://github.com/navikt/aksel/pull/2395))
@@ -276,10 +286,6 @@

 - :lipstick: CopyButton: Justert padding, gap og animasjon ([#2355](https://github.com/navikt/aksel/pull/2355))

-### @navikt/ds-tokens
-
- Ny spacing token på 0.375rem ([#2370](https://github.com/navikt/aksel/pull/2370))
-
 ### @navikt/aksel-icons

 - Ikoner: Nye ikoner `ChevronLeftFirstCircle` og `ChevronRightLastCircle` ([#2365](https://github.com/navikt/aksel/pull/2365))
@@ -306,6 +312,10 @@

 - MonthPicker: Tilpasset padding og sizing på mobil. ([#2311](https://github.com/navikt/aksel/pull/2311))

+### @navikt/ds-tokens
+
+- Tokens: Tilbyr nå token literals for typer, tidligere string literals ([#2342](https://github.com/navikt/aksel/pull/2342))
+
 ### @navikt/ds-react

 - Datepicker: Popover legger seg nå ikke ovenfor input ([#2349](https://github.com/navikt/aksel/pull/2349))
@@ -332,10 +342,6 @@

 - Remove tabIndex="-1" on Popover to fix VoiceOver navigation issue inside Popover ([#2303](https://github.com/navikt/aksel/pull/2303))

-### @navikt/ds-tokens
-
- Tokens: Tilbyr nå token literals for typer, tidligere string literals ([#2342](https://github.com/navikt/aksel/pull/2342))
-
 ### @navikt/aksel-icons

 - Ikoner: SVG export setter nå `height="1em"`, `width="1em"` og `fill="currentColor"`. ([#2300](https://github.com/navikt/aksel/pull/2300))
@@ -352,16 +358,16 @@

 * Skeleton: Width fungerer nå med inline-variant av Skeleton ([#2273](https://github.com/navikt/aksel/pull/2273))

+### @navikt/ds-tokens
+
+- Box: Ny primitive, erstatter dagens `Panel` ([#2195](https://github.com/navikt/aksel/pull/2195))
+
 ### @navikt/ds-react

 - Box: Ny primitive, erstatter dagens `Panel` ([#2195](https://github.com/navikt/aksel/pull/2195))

 * Skeleton: Width fungerer nå med inline-variant av Skeleton ([#2273](https://github.com/navikt/aksel/pull/2273))

-### @navikt/ds-tokens
-
- Box: Ny primitive, erstatter dagens `Panel` ([#2195](https://github.com/navikt/aksel/pull/2195))
-
 ## 5.4

 ### @navikt/ds-css
@@ -370,6 +376,10 @@

 * ErrorSummary: Har nå 8px border-radius ([#2256](https://github.com/navikt/aksel/pull/2256))

+### @navikt/ds-tokens
+
+- Tokens: `data-theme="light"` vil nå tilbakestille theming ([#2238](https://github.com/navikt/aksel/pull/2238))
+
 ### @navikt/ds-react

 - MonthPicker: Fikset kalkulering av fromDate/toDate ([#2269](https://github.com/navikt/aksel/pull/2269))
@@ -378,10 +388,6 @@

 - Search: Kjører nå bare preventDefault ved Escape når `input` inneholder tekst ([#2245](https://github.com/navikt/aksel/pull/2245))

-### @navikt/ds-tokens
-
- Tokens: `data-theme="light"` vil nå tilbakestille theming ([#2238](https://github.com/navikt/aksel/pull/2238))
-
 ## 5.3

 ### @navikt/ds-css
@@ -481,6 +487,16 @@

 * Table: Alle størrelser har justert padding. Small-size table bruker nå også standard typografi-størrelse (18px). ([#2178](https://github.com/navikt/aksel/pull/2178))

+### @navikt/ds-tokens
+
+- ConfirmationPanel: Fikset opplesing av feilmelding ([#2199](https://github.com/navikt/aksel/pull/2199))
+
+- Tokens: `--a-icon-alt-3` er nå i synk med figma ([#2199](https://github.com/navikt/aksel/pull/2199))
+
+* Gray: Gråfarger er nå mindre varme ([#2092](https://github.com/navikt/aksel/pull/2092))
+
+* Action: Selected-varianter av action er nå 'blue' ('deepblue' før) ([#2092](https://github.com/navikt/aksel/pull/2092))
+
 ### @navikt/ds-react

 - ConfirmationPanel: Fikset opplesing av feilmelding ([#2199](https://github.com/navikt/aksel/pull/2199))
@@ -497,16 +513,6 @@

 * Table: Har lagt til ny size: 'large'. ([#2178](https://github.com/navikt/aksel/pull/2178))

-### @navikt/ds-tokens
-
- ConfirmationPanel: Fikset opplesing av feilmelding ([#2199](https://github.com/navikt/aksel/pull/2199))
-
- Tokens: `--a-icon-alt-3` er nå i synk med figma ([#2199](https://github.com/navikt/aksel/pull/2199))
-
-* Gray: Gråfarger er nå mindre varme ([#2092](https://github.com/navikt/aksel/pull/2092))
-
-* Action: Selected-varianter av action er nå 'blue' ('deepblue' før) ([#2092](https://github.com/navikt/aksel/pull/2092))
-
 ## 4.12

 ### @navikt/ds-css
@@ -661,6 +667,10 @@

 * Shadow-tokens er oppdatert: Datepicker har nå ikke border, Modal bruker shadow-xlarge, LinkCard bruker shadow-xsmall ([PR](https://github.com/navikt/aksel/pull/2041))

+### @navikt/ds-tokens
+
+- Shadow-tokens er oppdatert til mer tydeligere varianter ([PR](https://github.com/navikt/aksel/pull/2041))
+
 ### @navikt/ds-tailwind

 - Shadow-tokens er oppdatert ([PR](https://github.com/navikt/aksel/pull/2041))
@@ -673,10 +683,6 @@

 * Fikset klassenavn brukt for popover i Datepicker og Monthpicker ([PR](https://github.com/navikt/aksel/pull/2041))

-### @navikt/ds-tokens
-
- Shadow-tokens er oppdatert til mer tydeligere varianter ([PR](https://github.com/navikt/aksel/pull/2041))
-
 ## 4.3

 ### @navikt/ds-css
@@ -715,6 +721,12 @@

 - Alle description-felter på fieldsets har nå `text-subtle` som farge. ([PR](https://github.com/navikt/aksel/pull/2036))

+### @navikt/ds-tokens
+
+- :tada: Fargetokens for datavisualisering. ([PR](https://github.com/navikt/aksel/pull/2032))
+
+- Oppdatert text-subtle og icon-subtle tokens til 700-skala (tidligere 600). ([PR](https://github.com/navikt/aksel/pull/2036))
+
 ### @navikt/ds-tailwind

 - :tada: Fargetokens for datavisualisering. ([PR](https://github.com/navikt/aksel/pull/2032))
@@ -743,24 +755,12 @@

 - Accordion: La til `indent`-prop ([PR](https://github.com/navikt/aksel/pull/2027))

-### @navikt/ds-tokens
-
- :tada: Fargetokens for datavisualisering. ([PR](https://github.com/navikt/aksel/pull/2032))
-
- Oppdatert text-subtle og icon-subtle tokens til 700-skala (tidligere 600). ([PR](https://github.com/navikt/aksel/pull/2036))
-
 ### @navikt/aksel-icons

 - Nye ikoner `ChevronRightLast` og `ChevronLeftLast` ([PR](https://github.com/navikt/aksel/pull/2054))

 ## 4.0

-### @navikt/aksel
-
- Codemod for migrering av Datepicker/Monthpicker ut av Beta. `npx @navikt/aksel codemod v4-date` ([PR](https://github.com/navikt/aksel/pull/2026))
-
- Codemods for migrering fra `@navikt/ds-react-internal` til `@navikt/ds-react` [Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h3b8538e1981d) ([PR](https://github.com/navikt/aksel/pull/2026))
-
 ### @navikt/ds-css

 - All styling fra `@navikt/ds-css-internal` er flyttet til `@navikt/ds-css`. ([PR](https://github.com/navikt/aksel/pull/2026))
@@ -777,6 +777,12 @@

 - Komponenter i `@navikt/ds-react-internal` er flyttet over til `@navikt/ds-react`. [Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h3b8538e1981d) ([PR](https://github.com/navikt/aksel/pull/2026))

+### @navikt/aksel
+
+- Codemod for migrering av Datepicker/Monthpicker ut av Beta. `npx @navikt/aksel codemod v4-date` ([PR](https://github.com/navikt/aksel/pull/2026))
+
+- Codemods for migrering fra `@navikt/ds-react-internal` til `@navikt/ds-react` [Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h3b8538e1981d) ([PR](https://github.com/navikt/aksel/pull/2026))
+
 ## 3.4

 ### @navikt/aksel-stylelint
@@ -859,10 +865,6 @@

 ## 2.9

-### @navikt/aksel
-
- :truck: Flyttet Codemods fra `@navikt/ds-codemods` -> `@navikt/aksel`. `@navikt/ds-codemods` regnes nå som deprecated ([PR](https://github.com/navikt/aksel/pull/1952))
-
 ### @navikt/ds-css

 - CSS nå tilgjengelig som separate filer: Kan lastest fra CDN, minified-versjoner tilgjengelig ([PR](https://github.com/navikt/aksel/pull/1941))
@@ -871,6 +873,10 @@

 - ExpansionCard: Støtter nå `aria-labelledby` i tillegg til `aria-label` ([PR](https://github.com/navikt/aksel/pull/1944))

+### @navikt/aksel
+
+- :truck: Flyttet Codemods fra `@navikt/ds-codemods` -> `@navikt/aksel`. `@navikt/ds-codemods` regnes nå som deprecated ([PR](https://github.com/navikt/aksel/pull/1952))
+
 ### @navikt/aksel-icons

 - Oppdatert Statusikoner til å være tydeligere og mer konsistente. ([PR](https://github.com/navikt/aksel/pull/1959))
@@ -955,6 +961,10 @@

 ## 2.5

+### @navikt/ds-tokens
+
+- Breakpoint-tokens lagt til ([PR](https://github.com/navikt/aksel/pull/1832))
+
 ### @navikt/ds-tailwind

 - Breakpoint-tokens er lagt til. Overskriver native tailwind-breakpoints ([PR](https://github.com/navikt/aksel/pull/1832))
@@ -963,10 +973,6 @@

 - List: Refaktorert nestede lister

-### @navikt/ds-tokens
-
- Breakpoint-tokens lagt til ([PR](https://github.com/navikt/aksel/pull/1832))
-
 ## 2.4

 ### @navikt/ds-css
@@ -1001,24 +1007,28 @@

 - Button: `Neutral`-variant.

-### @navikt/ds-react
-
- ToggleGroup: `neutral`-variant ([PR](https://github.com/navikt/aksel/pull/1789))
-
- Button: `neutral`-variant ([PR](https://github.com/navikt/aksel/pull/1789))
-
 ### @navikt/ds-tokens

 - Justeringer av semantiske fargetokens, statusfarger nå mer tydelig ([PR](https://github.com/navikt/aksel/pull/1787))

 - Oppdatert neutral-tokens ([PR](https://github.com/navikt/aksel/pull/1789))

+### @navikt/ds-react
+
+- ToggleGroup: `neutral`-variant ([PR](https://github.com/navikt/aksel/pull/1789))
+
+- Button: `neutral`-variant ([PR](https://github.com/navikt/aksel/pull/1789))
+
 ## 2.1

 ### @navikt/ds-css

 - TextField: `small`-variant har nå 8px horisontal padding (før 4px)

+### @navikt/ds-tokens
+
+- Fikset feil danger-hover token ([PR](https://github.com/navikt/aksel/pull/1665))
+
 ### @navikt/ds-react

 - Datepicker: Fikset rekkefølge på `onValidate` og `onRangeChange` i useRangepicker-hook
@@ -1035,10 +1045,6 @@

 - Datepicker/Monthpicker: år med 2 siffer i input fungerer nå

-### @navikt/ds-tokens
-
- Fikset feil danger-hover token ([PR](https://github.com/navikt/aksel/pull/1665))
-
 ## 2.0

 ### @navikt/ds-css
@@ -1053,6 +1059,10 @@

 * Tokens: Alle komponenter bruker nå semantiske tokens for som standard, med innebygd støtte for komponent-spesifikke tokens.

+### @navikt/ds-tokens
+
+- Alle token er oppdatert til nytt format. ([Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h76f47744d112))
+
 ### @navikt/ds-tailwind

 - Alle token er oppdatert til nytt format. ([Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h76f47744d112))
@@ -1075,10 +1085,6 @@

 * Fonter blir bruk i all typografi blir nå lastet fra CDN

-### @navikt/ds-tokens
-
- Alle token er oppdatert til nytt format. ([Guide](https://aksel.nav.no/grunnleggende/kode/migrering#h76f47744d112))
-
 ## 1.5

 ### @navikt/ds-css
@@ -16,10 +16,10 @@
    "playroom"
  ],
  "dependencies": {
-    "@navikt/aksel-icons": "^5.17.5",
-    "@navikt/ds-css": "^5.17.5",
-    "@navikt/ds-react": "^5.17.5",
-    "@navikt/ds-tailwind": "^5.17.5",
-    "@navikt/ds-tokens": "^5.17.5"
+    "@navikt/aksel-icons": "^5.18.0",
+    "@navikt/ds-css": "^5.18.0",
+    "@navikt/ds-react": "^5.18.0",
+    "@navikt/ds-tailwind": "^5.18.0",
+    "@navikt/ds-tokens": "^5.18.0"
  }
 }
@@ -44,5 +44,5 @@ export const Demo = {

 export const args = {
  index: 7,
-  desc: "Før du belger å bruke range, vurder om to enkelte datepickere for start/slutt-dato ville vært bedre. Range fungerer bedre for korte perioder innenfor en måned.",
+  desc: "Før du velger å bruke range, vurder om to separate datepickere i single mode er bedre. Range fungerer best for korte perioder innenfor en måned.",
 };
@@ -32,5 +32,5 @@ export const Demo = {

 export const args = {
  index: 10,
-  desc: "Prop allowTwoDigitYear legger til støtte for 'yy'-format. Tilgjengelig year-range vil være fra 1943-2042 (2023).",
+  desc: "Prop 'allowTwoDigitYear' legger til støtte for 'yy'-format. Tilgjengelig year-range vil være 80 år bakover og 19 år framover. I 2024 tilsvarer det 1944-2043.",
 };
@@ -7,20 +7,12 @@ const options: docgen.ParserOptions = {
  shouldRemoveUndefinedFromOptional: true,

  propFilter: (prop) => {
-    if (prop.name === "className") return true;
-    if (prop.declarations !== undefined && prop.declarations.length > 0) {
-      const hasPropAdditionalDescription = prop.declarations.some(
-        (declaration) => {
-          return (
-            !declaration.fileName.includes("node_modules") ||
-            declaration.name === "RefAttributes"
-          );
-        },
-      );
-
-      return hasPropAdditionalDescription;
+    if (prop.name === "className" || prop.parent?.name === "RefAttributes") {
+      return true;
+    }
+    if (prop.parent?.fileName.includes("/node_modules/@types/react/")) {
+      return false;
    }
-
    return true;
  },
 };
@@ -36,7 +28,7 @@ const genDocs = () => {
        !x.toLowerCase().includes("pictogram"),
    );

-  const res: any[] = [];
+  const res: docgen.ComponentDoc[][] = [];
  const fails: string[] = [];

  files.forEach((file) => {
@@ -50,17 +42,11 @@ const genDocs = () => {

  console.log({ Documented: res.length, fails });

-  const cleaned = res.flat().reduce(
-    (old, cur) => [
-      ...old,
-      {
-        filePath: cur.filePath,
-        displayName: cur.displayName,
-        props: cur.props,
-      },
-    ],
-    [],
-  );
+  const cleaned = res.flat().map((file) => ({
+    filePath: file.filePath,
+    displayName: file.displayName,
+    props: file.props,
+  }));

  writeFileSync(`_docs.json`, JSON.stringify(cleaned, null, 2));
 };
Author	SHA1	Message	Date
github-actions[bot]andgithub-actions[bot]	7e4ee40a7f	Version Packages (#2708 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2024-02-07 12:26:07 +01:00
Halvor Haugan	2be97970d6	Date/MonthPicker: Justeringer JSDOC og eksempel-desc (#2704 )	2024-02-07 09:42:37 +01:00
Halvor Haugan	5b3c1f33c4	Eksterne typer kommer nå med i docgen (#2705 )	2024-02-07 09:30:27 +01:00
KenandHalvor Haugan	f44ff44410	Bytter ut FloatingPortal med egen implementasjon (#2697 ) * 🎉 Egen Portal-komponent * 🎨 Portal og Overlay exportert i root * ♻️ Tooltip bruker egen Portal * 📝 Changeset * 🔥 Fjernet ID på Portal-element * 🎉 Ny type WithAsChild * ♻️ Mer robust sjekk for conditional elements i WithAsChild * 📝 WithAsChild JSDOC * 📝 WithAsChild JSDOC 2 * Update .changeset/lovely-points-heal.md Co-authored-by: Halvor Haugan <83693529+HalvorHaugan@users.noreply.github.com> * ♻️ Fikset kommentarer fra git-pr --------- Co-authored-by: Halvor Haugan <83693529+HalvorHaugan@users.noreply.github.com>	2024-02-06 18:02:00 +01:00
Ken	855669538e	⚡ Kjører bare release-workflow når nødvendige filer er endret (#2701 )	2024-02-06 18:01:43 +01:00