Version Packages (#1756 )

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
📝 changeset
2026-10-14 09:42:02 +00:00 · 2023-01-19 15:53:44 +01:00 · 2023-01-19 15:19:46 +01:00 · 2023-01-19 10:00:56 +01:00 · 2023-01-18 15:24:10 +01:00 · 2023-01-18 15:14:13 +01:00
43 changed files with 429 additions and 107 deletions
@@ -1,5 +1,13 @@
 # @navikt/ds-codemod

+## 2.0.18
+
+## 2.0.17
+
+## 2.0.16
+
+## 2.0.15
+
 ## 2.0.14

 ## 2.0.13
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-codemod",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "Aksel codemods for NAVs designsystem",
  "author": "Aksel | NAV designsystem team",
  "license": "MIT",
@@ -39,8 +39,8 @@
    "build-pict": "svgr --silent --index-template index-template.js --out-dir src/pictograms pictograms"
  },
  "dependencies": {
-    "@navikt/ds-icons": "^2.0.14",
-    "@navikt/ds-react": "^2.0.14",
+    "@navikt/ds-icons": "^2.0.18",
+    "@navikt/ds-react": "^2.0.18",
    "clsx": "^1.1.1"
  },
  "devDependencies": {
@@ -1,5 +1,17 @@
 # @navikt/ds-css

+## 2.0.18
+
+## 2.0.17
+
+## 2.0.16
+
+## 2.0.15
+
+### Patch Changes
+
+- [#1748](https://github.com/navikt/Designsystemet/pull/1748) [`22dfd8e60`](https://github.com/navikt/Designsystemet/commit/22dfd8e60315c421749394d35e41f412a00a7593) Thanks [@KenAJoh](https://github.com/KenAJoh)! - toptextPosition prop i Chat for horisontal plassering av navn og dato.
+
 ## 2.0.14

 ## 2.0.13
@@ -77,6 +77,22 @@
  align-self: flex-end;
 }

+.navds-chat--top-text-left .navds-chat__top-text {
+  align-self: flex-start;
+}
+
+.navds-chat--top-text-right .navds-chat__top-text {
+  align-self: flex-end;
+}
+
+.navds-chat--left .navds-chat__top-text--right {
+  align-self: flex-end;
+}
+
+.navds-chat--right .navds-chat__top-text--left {
+  align-self: flex-start;
+}
+
 .navds-chat__name {
  font-weight: var(--a-font-weight-bold);
 }
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-css",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "CSS for NAV Designsystem",
  "author": "Aksel | NAV designsystem team",
  "keywords": [
@@ -20,7 +20,7 @@
    "watch": "postcss --watch --use postcss-import -o dist/index.css index.css"
  },
  "devDependencies": {
-    "@navikt/ds-tokens": "^2.0.14",
+    "@navikt/ds-tokens": "^2.0.18",
    "normalize.css": "^8.0.1",
    "postcss": "^8.4.0",
    "postcss-cli": "^9.0.0",
@@ -1,5 +1,37 @@
 # @navikt/ds-react

+## 2.0.18
+
+### Patch Changes
+
+- [`98177d0cd`](https://github.com/navikt/Designsystemet/commit/98177d0cd3802029dcf398ce93c1767d3b0860c5) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Bedre typer for ref i datepicker
+
+- Updated dependencies []:
+  - @navikt/ds-icons@2.0.18
+
+## 2.0.17
+
+### Patch Changes
+
+- Updated dependencies [[`27e3dfee0`](https://github.com/navikt/Designsystemet/commit/27e3dfee07e135893e9f62cd32f80ed83a3510de)]:
+  - @navikt/ds-icons@2.0.17
+
+## 2.0.16
+
+### Patch Changes
+
+- Updated dependencies [[`54f8b0795`](https://github.com/navikt/Designsystemet/commit/54f8b07956bbfb7de51f6682a5fc64903bfd1bdf)]:
+  - @navikt/ds-icons@2.0.16
+
+## 2.0.15
+
+### Patch Changes
+
+- [#1748](https://github.com/navikt/Designsystemet/pull/1748) [`22dfd8e60`](https://github.com/navikt/Designsystemet/commit/22dfd8e60315c421749394d35e41f412a00a7593) Thanks [@KenAJoh](https://github.com/KenAJoh)! - toptextPosition prop i Chat for horisontal plassering av navn og dato.
+
+- Updated dependencies []:
+  - @navikt/ds-icons@2.0.15
+
 ## 2.0.14

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-react",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "Aksel react-components for NAV designsystem",
  "author": "Aksel | NAV designsystem team",
  "license": "MIT",
@@ -37,7 +37,7 @@
  },
  "dependencies": {
    "@floating-ui/react": "0.17.0",
-    "@navikt/ds-icons": "^2.0.14",
+    "@navikt/ds-icons": "^2.0.18",
    "@radix-ui/react-tabs": "1.0.0",
    "@radix-ui/react-toggle-group": "1.0.0",
    "clsx": "^1.2.1",
@@ -19,6 +19,10 @@ export interface BubbleProps extends HTMLAttributes<HTMLDivElement> {
   * Background color on bubble
   */
  backgroundColor?: string;
+  /**
+   * Overrides hoizontal position of toptext
+   */
+  toptextPosition?: "left" | "right";
 }

 export type BubbleType = React.ForwardRefExoticComponent<
@@ -26,7 +30,18 @@ export type BubbleType = React.ForwardRefExoticComponent<
 >;

 const Bubble: BubbleType = forwardRef(
-  ({ children, className, name, timestamp, backgroundColor, ...rest }, ref) => {
+  (
+    {
+      children,
+      className,
+      name,
+      timestamp,
+      backgroundColor,
+      toptextPosition,
+      ...rest
+    },
+    ref
+  ) => {
    return (
      <div
        ref={ref}
@@ -35,7 +50,12 @@ const Bubble: BubbleType = forwardRef(
        {...rest}
      >
        {(timestamp || name) && (
-          <div className="navds-chat__top-text">
+          <div
+            className={cl(
+              `navds-chat__top-text`,
+              toptextPosition && `navds-chat__top-text--${toptextPosition}`
+            )}
+          >
            {name && <Detail className="navds-chat__name">{name}</Detail>}
            {timestamp && (
              <Detail className="navds-chat__timestamp">{timestamp}</Detail>
@@ -33,6 +33,11 @@ export interface ChatProps extends HTMLAttributes<HTMLDivElement> {
   * @default "left"
   */
  position?: "left" | "right";
+  /**
+   * Hoizontal position of toptext
+   * @default Same as chat
+   */
+  toptextPosition?: "left" | "right";
 }

 interface ChatComponent
@@ -53,6 +58,7 @@ export const Chat = forwardRef<HTMLDivElement, ChatProps>(
      position = "left",
      avatarBgColor,
      backgroundColor,
+      toptextPosition,
      ...rest
    },
    ref
@@ -60,7 +66,13 @@ export const Chat = forwardRef<HTMLDivElement, ChatProps>(
    return (
      <div
        ref={ref}
-        className={cl("navds-chat", className, `navds-chat--${position}`)}
+        className={cl(
+          "navds-chat",
+          className,
+          `navds-chat--${position} navds-chat--top-text-${
+            toptextPosition ?? position
+          }`
+        )}
        {...rest}
      >
        <BodyShort
@@ -116,6 +116,57 @@ export const Position = () => {
  );
 };

+export const ToptextPosition = () => {
+  return (
+    <div className="colgap">
+      <Chat
+        avatar="ON"
+        name="Ola Normann"
+        timestamp="01.01.21 14:00"
+        backgroundColor="rgba(255, 249, 240, 1)"
+        avatarBgColor="rgba(255, 236, 204, 1)"
+        toptextPosition="right"
+      >
+        <Chat.Bubble>
+          Adipisicing laborum est eu laborum est sit in commodo enim sint
+          laboris labore nisi ut.
+        </Chat.Bubble>
+      </Chat>
+      <Chat
+        avatar="KH"
+        name="Kari Høyli"
+        timestamp="01.01.21 14:32"
+        position="right"
+        backgroundColor="rgba(230, 240, 255, 1)"
+        avatarBgColor="rgba(204, 225, 255, 1)"
+        toptextPosition="left"
+      >
+        <Chat.Bubble>
+          Reprehenderit pariatur officia exercitation laboris.
+        </Chat.Bubble>
+        <Chat.Bubble>
+          Enim velit deserunt do quis. Eu fugiat magna esse dolore ad sunt sit
+          est dolore incididunt. Occaecat cupidatat magna.
+        </Chat.Bubble>
+      </Chat>
+      <Chat
+        avatar="ON"
+        name="Ola Normann"
+        timestamp="01.01.21 15:00"
+        backgroundColor="rgba(255, 249, 240, 1)"
+        avatarBgColor="rgba(255, 236, 204, 1)"
+      >
+        <Chat.Bubble toptextPosition="right">
+          Exercitation irure Lorem cupidatat culpa anim cillum esse ullamco qui
+          dolore laborum et Lorem. Labore sunt duis id Lorem voluptate commodo
+          ea esse. Dolore esse aliqua proident ea ad commodo ut dolore voluptate
+          labore sunt aute.
+        </Chat.Bubble>
+      </Chat>
+    </div>
+  );
+};
+
 export const Avatar = () => {
  return (
    <Chat avatar={<Illustration />} timestamp="01.01.21 14:00">
@@ -59,7 +59,10 @@ interface UseDatepickerValue {
  /**
   * Use: <DatePicker.Input {...inputProps}/>
   */
-  inputProps: Pick<DateInputProps, "onChange" | "onFocus" | "onBlur" | "value">;
+  inputProps: Pick<
+    DateInputProps,
+    "onChange" | "onFocus" | "onBlur" | "value"
+  > & { ref: React.RefObject<HTMLInputElement> };
  /**
   * Resets all states (callback)
   */
@@ -45,7 +45,9 @@ interface UseMonthPickerValue {
  /**
   * Use: <MonthPicker.Input {...inputProps} />
   */
-  inputProps: Pick<DateInputProps, "onChange" | "onFocus" | "value">;
+  inputProps: Pick<DateInputProps, "onChange" | "onFocus" | "value"> & {
+    ref: React.RefObject<HTMLInputElement>;
+  };
  /**
   * Currently selected Date
   * Up to user to validate value and extract month
@@ -101,7 +103,7 @@ export const useMonthpicker = (
  const today = new Date();
  const locale = getLocaleFromString(_locale);

-  const inputRef = useRef<HTMLDivElement>(null);
+  const inputRef = useRef<HTMLInputElement>(null);
  const monthpickerRef = useRef<HTMLDivElement>(null);

  // Initialize states
@@ -1,6 +1,6 @@
 import differenceInCalendarDays from "date-fns/differenceInCalendarDays";
 import isWeekend from "date-fns/isWeekend";
-import { useCallback, useEffect, useRef, useState } from "react";
+import React, { useCallback, useEffect, useRef, useState } from "react";
 import { DateRange, isMatch } from "react-day-picker";
 import { DateInputProps } from "../DateInput";
 import { DatePickerProps } from "../datepicker/DatePicker";
@@ -71,14 +71,14 @@ interface UseRangeDatepickerValue {
  fromInputProps: Pick<
    DateInputProps,
    "onChange" | "onFocus" | "onBlur" | "value"
-  >;
+  > & { ref: React.RefObject<HTMLInputElement> };
  /**
   * Use: <DatePicker.Input label="to" {...toInputProps}/>
   */
  toInputProps: Pick<
    DateInputProps,
    "onChange" | "onFocus" | "onBlur" | "value"
-  >;
+  > & { ref: React.RefObject<HTMLInputElement> };
  /**
   * Resets all states (callback)
   */
@@ -206,8 +206,8 @@ export const useRangeDatepicker = (

  const locale = getLocaleFromString(_locale);

-  const inputRefTo = useRef<HTMLDivElement>(null);
-  const inputRefFrom = useRef<HTMLDivElement>(null);
+  const inputRefTo = useRef<HTMLInputElement>(null);
+  const inputRefFrom = useRef<HTMLInputElement>(null);
  const datePickerRef = useRef<HTMLDivElement | null>(null);

  const [defaultSelected, setDefaultSelected] = useState(_defaultSelected);
@@ -1,5 +1,13 @@
 # @navikt/ds-tailwind

+## 2.0.18
+
+## 2.0.17
+
+## 2.0.16
+
+## 2.0.15
+
 ## 2.0.14

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

+## 2.0.18
+
+## 2.0.17
+
+## 2.0.16
+
+## 2.0.15
+
 ## 2.0.14

 ## 2.0.13
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-tokens",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "Design-tokens for NAV designsystem",
  "author": "Aksel | NAV designsystem team",
  "keywords": [
@@ -1,5 +1,21 @@
 # @navikt/ds-icons

+## 2.0.18
+
+## 2.0.17
+
+### Patch Changes
+
+- [`27e3dfee0`](https://github.com/navikt/Designsystemet/commit/27e3dfee07e135893e9f62cd32f80ed83a3510de) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Translate og Paragraph ikon
+
+## 2.0.16
+
+### Patch Changes
+
+- [`54f8b0795`](https://github.com/navikt/Designsystemet/commit/54f8b07956bbfb7de51f6682a5fc64903bfd1bdf) Thanks [@KenAJoh](https://github.com/KenAJoh)! - Oppdatert ikoner med feile farger
+
+## 2.0.15
+
 ## 2.0.14

 ## 2.0.13
@@ -867,13 +867,13 @@
    "name": "Eu",
    "description": "",
    "created_at": "2022-02-08T11:45:47.104Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "EuFilled",
    "description": "",
    "created_at": "2022-02-08T11:45:47.109Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "Expand",
@@ -1479,13 +1479,13 @@
    "name": "Law",
    "description": "",
    "created_at": "2020-07-01T10:37:42.819Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "LawFilled",
    "description": "",
    "created_at": "2021-01-11T13:37:55.330Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "Left",
@@ -1551,37 +1551,37 @@
    "name": "Locked",
    "description": "",
    "created_at": "2020-07-01T10:37:43.027Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "LockedFilled",
    "description": "",
    "created_at": "2021-01-11T13:37:55.325Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "Login",
    "description": "",
    "created_at": "2020-07-01T10:37:43.087Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "LoginFilled",
    "description": "",
    "created_at": "2021-01-11T13:37:55.531Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "Logout",
    "description": "",
    "created_at": "2020-07-01T10:37:42.931Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "LogoutFilled",
    "description": "",
    "created_at": "2021-01-11T13:37:55.609Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "Male",
@@ -1811,6 +1811,12 @@
    "created_at": "2021-12-15T15:16:55.869Z",
    "pageName": "People"
  },
+  {
+    "name": "Paragraph",
+    "description": "",
+    "created_at": "2023-01-17T13:24:22.989Z",
+    "pageName": "Privacy and security"
+  },
  {
    "name": "Parking",
    "description": "",
@@ -1827,13 +1833,13 @@
    "name": "Passport",
    "description": "",
    "created_at": "2020-07-01T10:37:43.078Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "PassportFilled",
    "description": "",
    "created_at": "2021-01-11T13:37:55.757Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "PensionBag",
@@ -2615,6 +2621,12 @@
    "created_at": "2021-01-28T14:00:38.585Z",
    "pageName": "Buildings"
  },
+  {
+    "name": "Translate",
+    "description": "",
+    "created_at": "2023-01-18T10:52:22.311Z",
+    "pageName": "Interface"
+  },
  {
    "name": "Truck",
    "description": "",
@@ -2643,13 +2655,13 @@
    "name": "Unlocked",
    "description": "",
    "created_at": "2020-07-01T10:37:42.823Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "UnlockedFilled",
    "description": "",
    "created_at": "2021-01-11T13:37:55.317Z",
-    "pageName": "Privacy and secutity"
+    "pageName": "Privacy and security"
  },
  {
    "name": "Up",
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-icons",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "Aksel icons for NAV",
  "author": "Aksel | NAV designsystem team",
  "repository": {
@@ -1,5 +1,5 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M11.75 2.5C6.64137 2.5 2.5 6.64137 2.5 11.75C2.5 16.8586 6.64137 21 11.75 21C16.8586 21 21 16.8586 21 11.75C21 6.64137 16.8586 2.5 11.75 2.5ZM1 11.75C1 5.81294 5.81294 1 11.75 1C17.6871 1 22.5 5.81294 22.5 11.75C22.5 17.6871 17.6871 22.5 11.75 22.5C5.81294 22.5 1 17.6871 1 11.75Z" fill="#262626"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M17 12.75H7V11.25H17V12.75Z" fill="black"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M11.25 17L11.25 7L12.75 7L12.75 17H11.25Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17 12.75H7V11.25H17V12.75Z" fill="#262626"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.25 17L11.25 7L12.75 7L12.75 17H11.25Z" fill="#262626"/>
 </svg>
@@ -1,4 +1,4 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M12 2.75C6.89137 2.75 2.75 6.89137 2.75 12C2.75 17.1086 6.89137 21.25 12 21.25C17.1086 21.25 21.25 17.1086 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75ZM1.25 12C1.25 6.06294 6.06294 1.25 12 1.25C17.9371 1.25 22.75 6.06294 22.75 12C22.75 17.9371 17.9371 22.75 12 22.75C6.06294 22.75 1.25 17.9371 1.25 12Z" fill="#262626"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M11.25 2.5H12.75V12.1729L19.5103 18.4504L18.4897 19.5496L11.25 12.8271V2.5Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.25 2.5H12.75V12.1729L19.5103 18.4504L18.4897 19.5496L11.25 12.8271V2.5Z" fill="#262626"/>
 </svg>
@@ -1,4 +1,4 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M11.75 2.5C6.64137 2.5 2.5 6.64137 2.5 11.75C2.5 16.8586 6.64137 21 11.75 21C16.8586 21 21 16.8586 21 11.75C21 6.64137 16.8586 2.5 11.75 2.5ZM1 11.75C1 5.81294 5.81294 1 11.75 1C17.6871 1 22.5 5.81294 22.5 11.75C22.5 17.6871 17.6871 22.5 11.75 22.5C5.81294 22.5 1 17.6871 1 11.75Z" fill="#262626"/>
-<path fill-rule="evenodd" clip-rule="evenodd" d="M17 12.75H7V11.25H17V12.75Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17 12.75H7V11.25H17V12.75Z" fill="#262626"/>
 </svg>
@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 2C9.79085 2 7.99999 3.79086 7.99999 6C7.99999 6.66187 8.16311 7.29714 8.45828 7.85918C6.00646 9.12956 5.6173 13.1739 8.76271 14.4845L12.7692 16.1538C13.5145 16.4644 14 17.1926 14 18C14 19.1046 13.1046 20 12 20C10.8954 20 9.99999 19.1046 9.99999 18H7.99999C7.99999 20.2091 9.79085 22 12 22C14.2091 22 16 20.2091 16 18C16 17.3381 15.8369 16.7029 15.5417 16.1408C17.9935 14.8704 18.3827 10.8261 15.2373 9.51554L11.2308 7.84615C10.4855 7.53561 9.99999 6.8074 9.99999 6C9.99999 4.89543 10.8954 4 12 4C13.1046 4 14 4.89543 14 6H16C16 3.79086 14.2091 2 12 2ZM13.9738 14.5208C15.6075 14.4232 16.1245 12.0519 14.4681 11.3617L10.4615 9.69231C10.311 9.62957 10.1657 9.55832 10.0262 9.47924C8.39252 9.57681 7.87544 11.9481 9.53194 12.6383L13.5385 14.3077C13.689 14.3704 13.8343 14.4417 13.9738 14.5208Z" fill="#262626"/>
+</svg>
@@ -0,0 +1,13 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.5 19.5L15.5 10.5L19.5 19.5" stroke="#262626" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13 17H18" stroke="#262626" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<mask id="mask0_6814_1365" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="2" y="4" width="15" height="17">
+<path d="M9.90083 18.7893L13.9008 9.78926C14.1817 9.15728 14.8084 8.75 15.5 8.75C16.1193 8.75 16.6865 9.07657 17.0001 9.59861V4H2.00005V21H10.5983C9.85068 20.5519 9.53784 19.606 9.90083 18.7893Z" fill="black"/>
+</mask>
+<g mask="url(#mask0_6814_1365)">
+<path d="M4 7.5H16" stroke="#262626" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10 7.5V5.5" stroke="#262626" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13.5 7.5L13.4116 7.78744C12.2005 11.7232 9.30115 14.9162 5.5 16.5" stroke="#262626" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6.5 7.5L6.58844 7.78744C7.79946 11.7232 10.6989 14.9162 14.5 16.5" stroke="#262626" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>
@@ -1,5 +1,13 @@
 # @navikt/ds-css-internal

+## 2.0.18
+
+## 2.0.17
+
+## 2.0.16
+
+## 2.0.15
+
 ## 2.0.14

 ## 2.0.13
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-css-internal",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "CSS for NAV internal Designsystem-components",
  "author": "Aksel | NAV designsystem team",
  "keywords": [
@@ -1,5 +1,37 @@
 # @navikt/ds-react-internal

+## 2.0.18
+
+### Patch Changes
+
+- Updated dependencies [[`98177d0cd`](https://github.com/navikt/Designsystemet/commit/98177d0cd3802029dcf398ce93c1767d3b0860c5)]:
+  - @navikt/ds-react@2.0.18
+  - @navikt/ds-icons@2.0.18
+
+## 2.0.17
+
+### Patch Changes
+
+- Updated dependencies [[`27e3dfee0`](https://github.com/navikt/Designsystemet/commit/27e3dfee07e135893e9f62cd32f80ed83a3510de)]:
+  - @navikt/ds-icons@2.0.17
+  - @navikt/ds-react@2.0.17
+
+## 2.0.16
+
+### Patch Changes
+
+- Updated dependencies [[`54f8b0795`](https://github.com/navikt/Designsystemet/commit/54f8b07956bbfb7de51f6682a5fc64903bfd1bdf)]:
+  - @navikt/ds-icons@2.0.16
+  - @navikt/ds-react@2.0.16
+
+## 2.0.15
+
+### Patch Changes
+
+- Updated dependencies [[`22dfd8e60`](https://github.com/navikt/Designsystemet/commit/22dfd8e60315c421749394d35e41f412a00a7593)]:
+  - @navikt/ds-react@2.0.15
+  - @navikt/ds-icons@2.0.15
+
 ## 2.0.14

 ### Patch Changes
@@ -1,6 +1,6 @@
 {
  "name": "@navikt/ds-react-internal",
-  "version": "2.0.14",
+  "version": "2.0.18",
  "description": "Aksel react components for internal UIs in NAV",
  "author": "Aksel | NAV designsystem team",
  "license": "MIT",
@@ -35,8 +35,8 @@
    "watch": "tsc --watch -p tsconfig.esm.json"
  },
  "dependencies": {
-    "@navikt/ds-icons": "^2.0.14",
-    "@navikt/ds-react": "^2.0.14",
+    "@navikt/ds-icons": "^2.0.18",
+    "@navikt/ds-react": "^2.0.18",
    "clsx": "^1.1.1",
    "copy-to-clipboard": "^3.3.1"
  },
@@ -15,14 +15,14 @@
    "website"
  ],
  "dependencies": {
-    "@navikt/ds-codemod": "^2.0.14",
-    "@navikt/ds-css": "^2.0.14",
-    "@navikt/ds-css-internal": "^2.0.14",
-    "@navikt/ds-icons": "^2.0.14",
-    "@navikt/ds-react": "^2.0.14",
-    "@navikt/ds-react-internal": "^2.0.14",
-    "@navikt/ds-tailwind": "^2.0.14",
-    "@navikt/ds-tokens": "^2.0.14"
+    "@navikt/ds-codemod": "^2.0.18",
+    "@navikt/ds-css": "^2.0.18",
+    "@navikt/ds-css-internal": "^2.0.18",
+    "@navikt/ds-icons": "^2.0.18",
+    "@navikt/ds-react": "^2.0.18",
+    "@navikt/ds-react-internal": "^2.0.18",
+    "@navikt/ds-tailwind": "^2.0.18",
+    "@navikt/ds-tokens": "^2.0.18"
  },
  "devDependencies": {
    "prettier-plugin-tailwindcss": "^0.1.13"
@@ -54,15 +54,18 @@ const AkselArtikkelTemplate = ({
              : `Relevante artikler`}
          </Heading>
          <div className="card-grid-3-1 mt-6 px-4">
-            {data.relevante_artikler.map((x: any) => (
-              <ArtikkelCard {...x} key={x._id} />
-            ))}
+            {data.relevante_artikler.map((x: any) =>
+              x && x?._id ? <ArtikkelCard {...x} key={x._id} /> : null
+            )}
          </div>
        </div>
      </div>
    </aside>
  );

+  const filteredTema =
+    hasTema && data?.tema?.filter((x: any) => x?.title && x?.slug);
+
  return (
    <>
      <Head>
@@ -136,7 +139,7 @@ const AkselArtikkelTemplate = ({
          </div>
          {hasTema && (
            <div className="mt-8 flex flex-wrap gap-2">
-              {data.tema.map(({ title, slug }: any) => (
+              {filteredTema.map(({ title, slug }: any) => (
                <span key={title}>
                  <NextLink
                    key={title}
@@ -220,6 +220,7 @@ const Feedback = ({
                x === HelpfulArticleEnum.MISC ? null : HelpfulArticleEnum.MISC
              )
            }
+            id="feedback-forbedringer-button"
          >
            <Label as="span">Foreslå forbedring</Label>
          </Button>
@@ -0,0 +1,32 @@
+import { Chat } from "@navikt/ds-react";
+import { withDsExample } from "components/website-modules/examples/withDsExample";
+
+const Example = () => {
+  return (
+    <div className="grid gap-10">
+      <Chat avatar="EVA" name="EVA" timestamp="01.01.21 14:00">
+        <Chat.Bubble>Hei! Mitt navn er Eva.</Chat.Bubble>
+        <Chat.Bubble>Hva kan jeg hjelpe deg med?</Chat.Bubble>
+      </Chat>
+      <Chat
+        avatar="NO"
+        name="Ola Normann"
+        timestamp="01.01.21 14:00"
+        position="right"
+        toptextPosition="left"
+      >
+        <Chat.Bubble>Hei Eva.</Chat.Bubble>
+        <Chat.Bubble>
+          Hvor sjekker jeg statusen på foreldrepengersøknaden min?
+        </Chat.Bubble>
+      </Chat>
+    </div>
+  );
+};
+
+export default withDsExample(Example);
+
+export const args = {
+  index: 3,
+  desc: "Noen ganger ønsker man mer fleksibilitet for plassering av navn + tid i chatboblen.",
+};
@@ -343,6 +343,7 @@ export const getStaticProps = async ({
      komigang,
      slug: "/",
      preview,
+      id: page?._id ?? "",
    },
    revalidate: 60,
  };
@@ -15,7 +15,6 @@ export function FeedbackView(props) {
  const schema = useSchema();

  const schemaType = schema.get("aksel_feedback");
-  console.log(schemaType);

  const client = useClient({ apiVersion: "2021-06-07" });
  const { data, error, isValidating } = useSWR(
@@ -68,17 +67,23 @@ export function FeedbackView(props) {
              <li key={x._id}>
                <Card flex={1}>
                  <IntentButton
+                    key={x._id}
                    intent="edit"
-                    mode="bleed"
+                    mode="ghost"
                    padding={1}
-                    radius={2}
+                    radius={0}
                    params={{
                      type: "aksel_feedback",
                      id: getPublishedId(x._id),
                    }}
                    style={{ width: "100%" }}
                  >
-                    <Preview schemaType={schemaType} value={x} key={x._id} />
+                    <Preview
+                      schemaType={schemaType}
+                      value={x}
+                      key={x._id}
+                      layout="default"
+                    />
                  </IntentButton>
                </Card>
              </li>
@@ -96,12 +101,12 @@ export function FeedbackView(props) {
                      <li key={x._id}>
                        <Card flex={1}>
                          <IntentButton
-                            intent=""
+                            intent="edit"
                            mode="bleed"
                            padding={1}
                            radius={2}
                            params={{
-                              type: schemaType,
+                              type: "aksel_feedback",
                              id: getPublishedId(x._id),
                            }}
                            style={{ width: "100%" }}
@@ -218,6 +218,8 @@ export const EditorPage = () => {
    (query) => client.fetch(query)
  );

+  console.log(data);
+
  const {
    data: fbData,
    error: fbError,
@@ -264,7 +266,7 @@ export const EditorPage = () => {
      {!fbError && !fbValidating && (
        <div className="mt-7">
          <Heading level="2" size="small" spacing>
-            Tilbakemeldinger på artikler du er forfatter i (
+            Tilbakemeldinger på artikler du er satt som forfatter (
            {fbData?.length ?? 0})
          </Heading>
          {fbData?.length > 0 && (
@@ -277,11 +279,8 @@ export const EditorPage = () => {
      )}
      <div className="mt-7">
        <Heading level="2" size="small" spacing>
-          Innhold du jobber med
+          Under arbeid / må re-valideres
        </Heading>
-        <BodyShort spacing>
-          Dette er alle artikler du jobber med eller må godkjenne asap.
-        </BodyShort>
        <Accordion>
          <DraftList data={data} />
          <OutDatedList data={data} />
@@ -16,15 +16,12 @@ const navn = [
  "Blissbukk",
  "Borneoorangutang",
  "Damfrosk",
-  "Dvergsilkeape",
  "Dåhjort",
-  "Edderkoppape",
  "Elandantilope",
  "Elg",
  "Esel",
  "Oter",
  "Fjellrev",
-  "Flodsvin",
  "Fugler",
  "Gaupe",
  "Gepard",
@@ -46,7 +43,6 @@ const navn = [
  "Ringhalelemur",
  "Rødpanda",
  "Sau",
-  "Sjimpanse",
  "Sjiraff",
  "Stråleskilpadde",
  "Slanger",
@@ -57,7 +53,6 @@ const navn = [
  "Surikat",
  "Tiger",
  "Ulv",
-  "Fjordfe",
  "Ekorn",
  "Bever",
  "Lemen",
@@ -67,7 +62,6 @@ const navn = [
  "Småskogmus",
  "Steinkobbe",
  "Røyskatt",
-  "Moskusfe",
 ];

 const adjektiv = [
@@ -81,13 +81,20 @@ export const Feedback = defineType({
      url: "url",
      feedback_type: "feedback_type",
      artikkel_feedback: "artikkel_feedback",
+      title: "doc_ref.heading",
    },
    prepare(selection) {
-      const { melding, url, behandlet, feedback_type, artikkel_feedback } =
-        selection;
+      const {
+        melding,
+        url,
+        behandlet,
+        feedback_type,
+        artikkel_feedback,
+        title,
+      } = selection;

      return {
-        title: melding ? melding : url ? url : "",
+        title: melding ? melding : title ? title : url ? url : "",
        subtitle: `${behandlet ? "Ferdig behandlet" : "Ubehandlet"} | ${
          feedback_type === "footer" ? "footer" : artikkel_feedback
        }`,
@@ -1,4 +1,5 @@
 import { ExternalLink, FileContent, Link } from "@navikt/ds-icons";
+import { BoldIcon, CodeIcon, ItalicIcon, OlistIcon } from "@sanity/icons";
 import { KBD } from "@sanity/ui";
 import React from "react";
 import { allArticleDocsRef } from "../../../config";
@@ -18,16 +19,33 @@ export const block = {
  type: "block",
  styles: [...styles],
  lists: [
-    { title: "Bullet-liste", value: "bullet" },
-    { title: "Nummerert-liste", value: "number" },
+    {
+      title: "Bullet-liste",
+      value: "bullet",
+      blockEditor: { icon: () => <OlistIcon aria-label="Ul-liste" /> },
+    },
+    {
+      title: "Nummerert-liste",
+      value: "number",
+      blockEditor: { icon: () => <OlistIcon aria-label="Ol-liste" /> },
+    },
  ],
  marks: {
    decorators: [
-      { title: "Strong", value: "strong" },
-      { title: "Italic", value: "em" },
+      {
+        title: "Strong",
+        value: "strong",
+        blockEditor: { icon: () => <BoldIcon aria-label="Bold" /> },
+      },
+      {
+        title: "Italic",
+        value: "em",
+        blockEditor: { icon: () => <ItalicIcon aria-label="Italic" /> },
+      },
      {
        title: "Inline-Kode",
        value: "code",
+        blockEditor: { icon: () => <CodeIcon aria-label="Kode" /> },
      },
      {
        title: "KBD",
@@ -15,6 +15,12 @@ export const Tips = defineType({
      validation: (Rule) =>
        Rule.required().error("Tips-modul må ha noe innhold"),
    }),
+    defineField({
+      title: "Hjelp ønskes",
+      name: "eksperiment",
+      type: "boolean",
+      initialValue: false,
+    }),
  ],
  preview: {
    select: {
@@ -10,8 +10,8 @@
    "preview": "vite preview"
  },
  "dependencies": {
-    "@navikt/ds-css": "2.0.14",
-    "@navikt/ds-react": "2.0.14",
+    "@navikt/ds-css": "2.0.18",
+    "@navikt/ds-react": "2.0.18",
    "react": "^18.0.0",
    "react-dom": "^18.0.0"
  },
@@ -3080,7 +3080,7 @@ __metadata:
  languageName: node
  linkType: hard

-"@navikt/ds-codemod@^2.0.13, @navikt/ds-codemod@workspace:@navikt/codemod":
+"@navikt/ds-codemod@^2.0.17, @navikt/ds-codemod@workspace:@navikt/codemod":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-codemod@workspace:@navikt/codemod"
  dependencies:
@@ -3107,7 +3107,7 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-css-internal@^2.0.13, @navikt/ds-css-internal@workspace:@navikt/internal/css":
+"@navikt/ds-css-internal@^2.0.17, @navikt/ds-css-internal@workspace:@navikt/internal/css":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-css-internal@workspace:@navikt/internal/css"
  dependencies:
@@ -3118,11 +3118,11 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-css@2.0.13, @navikt/ds-css@^2.0.13, @navikt/ds-css@workspace:@navikt/core/css":
+"@navikt/ds-css@2.0.17, @navikt/ds-css@^2.0.17, @navikt/ds-css@workspace:@navikt/core/css":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-css@workspace:@navikt/core/css"
  dependencies:
-    "@navikt/ds-tokens": ^2.0.13
+    "@navikt/ds-tokens": ^2.0.17
    normalize.css: ^8.0.1
    postcss: ^8.4.0
    postcss-cli: ^9.0.0
@@ -3131,7 +3131,7 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-icons@^2.0.13, @navikt/ds-icons@workspace:@navikt/icons":
+"@navikt/ds-icons@^2.0.17, @navikt/ds-icons@workspace:@navikt/icons":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-icons@workspace:@navikt/icons"
  dependencies:
@@ -3167,8 +3167,8 @@ __metadata:
    "@babel/preset-env": 7.19.4
    "@babel/preset-react": 7.18.6
    "@babel/preset-typescript": 7.18.6
-    "@navikt/ds-icons": ^2.0.13
-    "@navikt/ds-react": ^2.0.13
+    "@navikt/ds-icons": ^2.0.17
+    "@navikt/ds-react": ^2.0.17
    "@rollup/plugin-babel": 6.0.2
    "@rollup/plugin-commonjs": 23.0.2
    "@rollup/plugin-node-resolve": ^15.0.1
@@ -3193,12 +3193,12 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-react-internal@^2.0.13, @navikt/ds-react-internal@workspace:@navikt/internal/react":
+"@navikt/ds-react-internal@^2.0.17, @navikt/ds-react-internal@workspace:@navikt/internal/react":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-react-internal@workspace:@navikt/internal/react"
  dependencies:
-    "@navikt/ds-icons": ^2.0.13
-    "@navikt/ds-react": ^2.0.13
+    "@navikt/ds-icons": ^2.0.17
+    "@navikt/ds-react": ^2.0.17
    clsx: ^1.1.1
    concurrently: 7.2.1
    copy-to-clipboard: ^3.3.1
@@ -3214,12 +3214,12 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-react@2.0.13, @navikt/ds-react@^2.0.13, @navikt/ds-react@workspace:@navikt/core/react":
+"@navikt/ds-react@2.0.17, @navikt/ds-react@^2.0.17, @navikt/ds-react@workspace:@navikt/core/react":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-react@workspace:@navikt/core/react"
  dependencies:
    "@floating-ui/react": 0.17.0
-    "@navikt/ds-icons": ^2.0.13
+    "@navikt/ds-icons": ^2.0.17
    "@radix-ui/react-tabs": 1.0.0
    "@radix-ui/react-toggle-group": 1.0.0
    "@testing-library/dom": 8.13.0
@@ -3255,11 +3255,11 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-tailwind@^2.0.13, @navikt/ds-tailwind@workspace:@navikt/core/tailwind":
+"@navikt/ds-tailwind@^2.0.17, @navikt/ds-tailwind@workspace:@navikt/core/tailwind":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-tailwind@workspace:@navikt/core/tailwind"
  dependencies:
-    "@navikt/ds-tokens": ^2.0.13
+    "@navikt/ds-tokens": ^2.0.17
    "@types/jest": ^29.0.0
    color: 4.2.3
    jest: ^29.0.0
@@ -3270,7 +3270,7 @@ __metadata:
  languageName: unknown
  linkType: soft

-"@navikt/ds-tokens@^2.0.13, @navikt/ds-tokens@workspace:@navikt/core/tokens":
+"@navikt/ds-tokens@^2.0.17, @navikt/ds-tokens@workspace:@navikt/core/tokens":
  version: 0.0.0-use.local
  resolution: "@navikt/ds-tokens@workspace:@navikt/core/tokens"
  dependencies:
@@ -7763,14 +7763,14 @@ __metadata:
  version: 0.0.0-use.local
  resolution: "aksel.nav.no@workspace:aksel.nav.no"
  dependencies:
-    "@navikt/ds-codemod": ^2.0.13
-    "@navikt/ds-css": ^2.0.13
-    "@navikt/ds-css-internal": ^2.0.13
-    "@navikt/ds-icons": ^2.0.13
-    "@navikt/ds-react": ^2.0.13
-    "@navikt/ds-react-internal": ^2.0.13
-    "@navikt/ds-tailwind": ^2.0.13
-    "@navikt/ds-tokens": ^2.0.13
+    "@navikt/ds-codemod": ^2.0.17
+    "@navikt/ds-css": ^2.0.17
+    "@navikt/ds-css-internal": ^2.0.17
+    "@navikt/ds-icons": ^2.0.17
+    "@navikt/ds-react": ^2.0.17
+    "@navikt/ds-react-internal": ^2.0.17
+    "@navikt/ds-tailwind": ^2.0.17
+    "@navikt/ds-tokens": ^2.0.17
    prettier-plugin-tailwindcss: ^0.1.13
  languageName: unknown
  linkType: soft
@@ -23898,8 +23898,8 @@ __metadata:
  version: 0.0.0-use.local
  resolution: "shadow-dom@workspace:examples/shadow-dom"
  dependencies:
-    "@navikt/ds-css": 2.0.13
-    "@navikt/ds-react": 2.0.13
+    "@navikt/ds-css": 2.0.17
+    "@navikt/ds-react": 2.0.17
    "@types/react": ^18.0.0
    "@types/react-dom": ^18.0.0
    "@vitejs/plugin-react": ^2.1.0
Author	SHA1	Message	Date
github-actions[bot]andgithub-actions[bot]	ffac16cb05	Version Packages (#1756 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2023-01-19 15:53:44 +01:00
Ken	98177d0cd3	📝 changeset	2023-01-19 15:19:46 +01:00
Ken	2c5be718e6	🎨 Fikset hjelp ønskes modul	2023-01-19 10:00:56 +01:00
github-actions[bot]andgithub-actions[bot]	019d92dd7b	Version Packages (#1754 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2023-01-18 15:24:10 +01:00
Ken	5b72afbb93	Merge branch 'master' of https://github.com/navikt/Designsystemet	2023-01-18 15:14:13 +01:00
Ken	56348cdddf	♿ Aria-labels for sanity riktekst-editor	2023-01-18 15:13:58 +01:00
github-actions[bot]andgithub-actions[bot]	973d79ee99	Version Packages (#1753 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2023-01-18 14:56:36 +01:00
Ken	5bfb912531	🎨 Bedre error-handling på akselartikkel templates	2023-01-18 14:55:45 +01:00
Ken	27e3dfee07	📝 Changeset	2023-01-18 13:08:38 +01:00
KenandKenAJoh	20b2bf6f89	Ikonsynk Figma (#1752 ) Co-authored-by: KenAJoh <KenAJoh@users.noreply.github.com>	2023-01-18 13:07:48 +01:00
Ken	4b870986c8	🐛 Fikset intentbutton for feddbackløsning	2023-01-18 12:44:48 +01:00
github-actions[bot]andgithub-actions[bot]	8fcf079359	Version Packages (#1751 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2023-01-17 14:55:06 +01:00
Ken	54f8b07956	📝 changeset	2023-01-17 14:13:50 +01:00
KenandKenAJoh	9bc251e694	Ikonsynk Figma (#1750 ) Co-authored-by: KenAJoh <KenAJoh@users.noreply.github.com>	2023-01-17 14:13:10 +01:00
github-actions[bot]andgithub-actions[bot]	e2a9d027dc	Version Packages (#1749 ) Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>	2023-01-17 10:32:23 +01:00
Ken	22dfd8e603	:sparkled: Prop for posisjonering av toptekst i Chat (#1748 ) * :sparkled: Prop for posisjonering av toptekst i Chat * 📝 changeset * 📝 Docs * 📝 Demo * 🎨 fliptoptext -> toptextPosition	2023-01-17 10:26:14 +01:00
Ken	53d1947311	📝 Tekstendringer sanity profilside	2023-01-17 09:39:38 +01:00
Ken	d4e7c47772	🎨 Sanity feedback preview	2023-01-17 07:37:20 +01:00
Ken	e191dffdf8	🔥 Fjernet dårlige editor-navn	2023-01-16 09:12:05 +01:00
Ken	7e0ee60d47	🔥 Fjernet dårlige editor-navn	2023-01-16 08:57:11 +01:00