@navikt/ds-react 7.35.3 → 7.37.0

package/esm/util/link-anchor/LinkAnchor.js

@@ -14,10 +14,10 @@ import { ArrowRightIcon } from "@navikt/aksel-icons";
 import { Slot } from "../../slot/Slot.js";
 import { useRenameCSS } from "../../theme/Theme.js";
 import { composeEventHandlers } from "../composeEventHandlers.js";
-import { createContext } from "../create-context.js";
+import { createStrictContext } from "../create-strict-context.js";
 import { useMergeRefs } from "../hooks/useMergeRefs.js";
 import { ownerWindow } from "../owner.js";
-const [LinkAnchorContextProvider, useLinkAnchorContext] = createContext({
+const { Provider: LinkAnchorContextProvider, useContext: useLinkAnchorContext, } = createStrictContext({
     name: "LinkAnchorOverlayContext",
 });
 const LinkAnchorOverlay = forwardRef((_a, forwardedRef) => {

package/esm/util/link-anchor/LinkAnchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinkAnchor.js","sourceRoot":"","sources":["../../../src/util/link-anchor/LinkAnchor.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"LinkAnchor.js","sourceRoot":"","sources":["../../../src/util/link-anchor/LinkAnchor.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAIZ,UAAU,EACV,MAAM,GACP,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,iBAAiB,CAAC;AACvC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAOvC,MAAM,EACJ,QAAQ,EAAE,yBAAyB,EACnC,UAAU,EAAE,oBAAoB,GACjC,GAAG,mBAAmB,CAAgC;IACrD,IAAI,EAAE,0BAA0B;CACjC,CAAC,CAAC;AAIH,MAAM,iBAAiB,GAAG,UAAU,CAClC,CACE,EAMyB,EACzB,YAAY,EACZ,EAAE;QARF,EACE,QAAQ,EACR,OAAO,EACP,SAAS,EACT,OAAO,OAEgB,EADpB,SAAS,cALd,+CAMC,CADa;IAId,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAC9B,MAAM,SAAS,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAElD,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IAEzC,OAAO,CACL,oBAAC,yBAAyB,IAAC,SAAS,EAAE,SAAS;QAC7C,oBAAC,SAAS,kBACR,GAAG,EAAE,YAAY,IACb,SAAS,IACb,SAAS,EAAE,EAAE,CAAC,4BAA4B,EAAE,SAAS,CAAC,EACtD,OAAO,EAAE,oBAAoB,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;;gBAC3C,IACE,CAAC,CAAC,MAAM,KAAK,SAAS,CAAC,OAAO;oBAC9B,cAAc,CAAC,SAAS,CAAC,OAAO,CAAC,EACjC,CAAC;oBACD,OAAO;gBACT,CAAC;gBAED,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE;oBACpC,OAAO,EAAE,IAAI;oBACb,UAAU,EAAE,IAAI;oBAChB,IAAI,EAAE,MAAM;oBACZ,OAAO,EAAE,CAAC,CAAC,OAAO;oBAClB,QAAQ,EAAE,CAAC,CAAC,QAAQ;oBACpB,MAAM,EAAE,CAAC,CAAC,MAAM;oBAChB,OAAO,EAAE,CAAC,CAAC,OAAO;oBAClB,MAAM,EAAE,CAAC,CAAC,MAAM;oBAChB,OAAO,EAAE,CAAC,CAAC,OAAO;oBAClB,OAAO,EAAE,CAAC,CAAC,OAAO;oBAClB,OAAO,EAAE,CAAC,CAAC,OAAO;oBAClB,OAAO,EAAE,CAAC,CAAC,OAAO;iBACnB,CAAC,CAAC;gBAEH,MAAA,SAAS,CAAC,OAAO,0CAAE,aAAa,CAAC,KAAK,CAAC,CAAC;YAC1C,CAAC,CAAC,KAED,QAAQ,CACC,CACc,CAC7B,CAAC;AACJ,CAAC,CACF,CAAC;AAyBF,MAAM,UAAU,GAAG,UAAU,CAC3B,CACE,EAA+D,EAC/D,YAAY,EACZ,EAAE;QAFF,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,OAAiC,EAA5B,SAAS,cAA5C,oCAA8C,CAAF;IAG5C,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAE9B,MAAM,OAAO,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,UAAU,GAAG,YAAY,CAAC,YAAY,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,CAAC,CAAC;IAElE,MAAM,SAAS,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC;IAEvC,OAAO,CACL,oBAAC,SAAS,kBACR,GAAG,EAAE,UAAU,IACX,SAAS,IACb,SAAS,EAAE,EAAE,CAAC,mBAAmB,EAAE,SAAS,CAAC,KAE5C,QAAQ,CACC,CACb,CAAC;AACJ,CAAC,CACF,CAAC;AAKF,MAAM,eAAe,GAAG,UAAU,CAChC,CAAC,EAAiD,EAAE,YAAY,EAAE,EAAE;QAAnE,EAAE,SAAS,OAAsC,EAAjC,SAAS,cAAzB,aAA2B,CAAF;IACxB,MAAM,EAAE,EAAE,EAAE,GAAG,YAAY,EAAE,CAAC;IAE9B,OAAO,CACL,oBAAC,cAAc,kBACb,GAAG,EAAE,YAAY,uBAEjB,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,SAAS,CAAC,IAChD,SAAS,EACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gFAAgF;AAChF,SAAS,cAAc,CAAC,UAAoC;;IAC1D,OAAO,CAAC,CAAC,CAAA,MAAA,MAAA,WAAW,CAAC,UAAU,CAAC,0CAAE,YAAY,EAAE,0CAAE,QAAQ,EAAE,CAAA,CAAC;AAC/D,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,iBAAiB,EAAE,CAAC"}

package/esm/util/resolveRef.d.ts

@@ -0,0 +1,8 @@
+/**
+ * If the provided argument is a ref object, returns its `current` value.
+ * Otherwise, returns the argument itself.
+ *
+ * Non-generic to safely handle refs whose `.current` may be `null`.
+ */
+declare function resolveRef(maybeRef: HTMLElement | React.RefObject<HTMLElement | null | undefined> | null): HTMLElement | null | undefined;
+export { resolveRef };

package/esm/util/resolveRef.js

@@ -0,0 +1,14 @@
+/**
+ * If the provided argument is a ref object, returns its `current` value.
+ * Otherwise, returns the argument itself.
+ *
+ * Non-generic to safely handle refs whose `.current` may be `null`.
+ */
+function resolveRef(maybeRef) {
+    if (maybeRef === null) {
+        return maybeRef;
+    }
+    return "current" in maybeRef ? maybeRef.current : maybeRef;
+}
+export { resolveRef };
+//# sourceMappingURL=resolveRef.js.map

package/esm/util/resolveRef.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveRef.js","sourceRoot":"","sources":["../../src/util/resolveRef.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,SAAS,UAAU,CACjB,QAGQ;IAER,IAAI,QAAQ,KAAK,IAAI,EAAE,CAAC;QACtB,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED,OAAO,SAAS,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC;AAC7D,CAAC;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}

package/esm/util/virtualfocus/Context.d.ts

@@ -2,7 +2,7 @@ import { Dispatch, SetStateAction } from "react";
 export declare const VirtualFocusDescendantsProvider: import("react").Provider<import("../hooks/descendants/descendant.js").DescendantsManager<HTMLDivElement, {
     handleOnSelect: () => void;
     handleOnActive: () => void;
-}>>, useVirtualFocusDescendantsContext: <S extends boolean = true>(strict?: S) => S extends true ? import("../hooks/descendants/descendant.js").DescendantsManager<HTMLDivElement, {
+}>>, useVirtualFocusDescendantsContext: <S extends boolean = true>(strict?: S | undefined) => S extends true ? import("../hooks/descendants/descendant.js").DescendantsManager<HTMLDivElement, {
     handleOnSelect: () => void;
     handleOnActive: () => void;
 }> : import("../hooks/descendants/descendant.js").DescendantsManager<HTMLDivElement, {
@@ -23,14 +23,15 @@ export declare const VirtualFocusDescendantsProvider: import("react").Provider<i
     enabledIndex: number;
     register: (instance: HTMLDivElement | null) => void;
 };
-export declare const VirtualFocusInternalContextProvider: import("react").ForwardRefExoticComponent<{
+export declare const VirtualFocusInternalContextProvider: import("react").FC<{
     virtualFocusIdx: number;
     setVirtualFocusIdx: Dispatch<SetStateAction<number>>;
     loop: boolean;
     uniqueId: string;
 } & {
     children: React.ReactNode;
-} & import("react").RefAttributes<unknown>>, useVirtualFocusInternalContext: <S extends boolean = true>(strict?: S) => S extends true ? {
+    ref?: never;
+}>, useVirtualFocusInternalContext: <S extends boolean = true>(strict?: S | undefined) => S extends true ? {
     virtualFocusIdx: number;
     setVirtualFocusIdx: Dispatch<SetStateAction<number>>;
     loop: boolean;

package/esm/util/virtualfocus/Context.js

@@ -1,5 +1,7 @@
-import { createContext } from "../create-context.js";
+import { createStrictContext } from "../create-strict-context.js";
 import { createDescendantContext } from "../hooks/descendants/useDescendant.js";
 export const [VirtualFocusDescendantsProvider, useVirtualFocusDescendantsContext, useVirtualFocusDescendantInitializer, useVirtualFocusDescendant,] = createDescendantContext();
-export const [VirtualFocusInternalContextProvider, useVirtualFocusInternalContext,] = createContext();
+export const { Provider: VirtualFocusInternalContextProvider, useContext: useVirtualFocusInternalContext, } = createStrictContext({
+    name: "VirtualFocusInternalContext",
+});
 //# sourceMappingURL=Context.js.map

package/esm/util/virtualfocus/Context.js.map

@@ -1 +1 @@
-{"version":3,"file":"Context.js","sourceRoot":"","sources":["../../../src/util/virtualfocus/Context.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AAG7E,MAAM,CAAC,MAAM,CACX,+BAA+B,EAC/B,iCAAiC,EACjC,oCAAoC,EACpC,yBAAyB,EAC1B,GAAG,uBAAuB,EAMxB,CAAC;AAEJ,MAAM,CAAC,MAAM,CACX,mCAAmC,EACnC,8BAA8B,EAC/B,GAAG,aAAa,EAKb,CAAC"}
+{"version":3,"file":"Context.js","sourceRoot":"","sources":["../../../src/util/virtualfocus/Context.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,uBAAuB,EAAE,MAAM,oCAAoC,CAAC;AAG7E,MAAM,CAAC,MAAM,CACX,+BAA+B,EAC/B,iCAAiC,EACjC,oCAAoC,EACpC,yBAAyB,EAC1B,GAAG,uBAAuB,EAMxB,CAAC;AAEJ,MAAM,CAAC,MAAM,EACX,QAAQ,EAAE,mCAAmC,EAC7C,UAAU,EAAE,8BAA8B,GAC3C,GAAG,mBAAmB,CAKpB;IACD,IAAI,EAAE,6BAA6B;CACpC,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "7.35.3",
+  "version": "7.37.0",
   "description": "React components from the Norwegian Labour and Welfare Administration.",
   "author": "Aksel, a team part of the Norwegian Labour and Welfare Administration.",
   "license": "MIT",
@@ -669,6 +669,16 @@
         "default": "./cjs/alert/local-alert/index.js"
       }
     },
+    "./Dialog": {
+      "import": {
+        "types": "./esm/dialog/index.d.ts",
+        "default": "./esm/dialog/index.js"
+      },
+      "require": {
+        "types": "./cjs/dialog/index.d.ts",
+        "default": "./cjs/dialog/index.js"
+      }
+    },
     "./package.json": "./package.json",
     "./Theme": {
       "import": {
@@ -695,8 +705,8 @@
   "dependencies": {
     "@floating-ui/react": "0.27.8",
     "@floating-ui/react-dom": "^2.1.6",
-    "@navikt/aksel-icons": "^7.35.3",
-    "@navikt/ds-tokens": "^7.35.3",
+    "@navikt/aksel-icons": "^7.37.0",
+    "@navikt/ds-tokens": "^7.37.0",
     "clsx": "^2.1.0",
     "date-fns": "^4.0.0",
     "react-day-picker": "9.7.0"

package/src/accordion/AccordionContent.tsx

@@ -15,7 +15,7 @@ const AccordionContent = forwardRef<HTMLDivElement, AccordionContentProps>(
   ({ children, className, ...rest }, ref) => {
     const context = useContext(AccordionItemContext);
 
-    const themeContext = useThemeInternal(false);
+    const themeContext = useThemeInternal();
     const { cn } = useRenameCSS();
 
     if (context === null) {

package/src/accordion/AccordionHeader.tsx

@@ -19,7 +19,7 @@ const AccordionHeader = forwardRef<HTMLButtonElement, AccordionHeaderProps>(
     const itemContext = useContext(AccordionItemContext);
     const accordionContext = useContext(AccordionContext);
 
-    const themeContext = useThemeInternal(false);
+    const themeContext = useThemeInternal();
     const { cn } = useRenameCSS();
 
     if (itemContext === null) {

package/src/alert/base-alert/content/BaseAlertContent.tsx

@@ -24,7 +24,7 @@ const BaseAlertContent = forwardRef<HTMLDivElement, BaseAlertContentProps>(
     forwardedRef,
   ) => {
     const { cn } = useRenameCSS();
-    const themeContext = useThemeInternal(false);
+    const themeContext = useThemeInternal();
 
     return (
       <div

package/src/alert/base-alert/root/BaseAlertRoot.context.tsx

@@ -1,5 +1,5 @@
 import { AkselColor } from "../../../types";
-import { createContext } from "../../../util/create-context";
+import { createStrictContext } from "../../../util/create-strict-context";
 
 type BaseAlertContextProps = {
   size: "medium" | "small";
@@ -8,10 +8,10 @@ type BaseAlertContextProps = {
   statusId?: string;
 };
 
-const [BaseAlertProvider, useBaseAlert] = createContext<BaseAlertContextProps>({
-  name: "BaseAlert",
-  errorMessage: "useBaseAlert must be used within a BaseAlertProvider",
-});
+const { Provider: BaseAlertProvider, useContext: useBaseAlert } =
+  createStrictContext<BaseAlertContextProps>({
+    name: "BaseAlert",
+  });
 
 export { BaseAlertProvider, useBaseAlert };
 export type { BaseAlertContextProps };

package/src/chips/Removable.tsx

@@ -37,7 +37,7 @@ export const RemovableChips = forwardRef<
     ref,
   ) => {
     const translate = useI18n("Chips");
-    const themeContext = useThemeInternal(false);
+    const themeContext = useThemeInternal();
     const { cn } = useRenameCSS();
 
     let localVariant: ChipsRemovableProps["variant"] | undefined;

package/src/chips/Toggle.tsx

@@ -40,7 +40,7 @@ export const ToggleChips: OverridableComponent<
     ref,
   ) => {
     const { cn } = useRenameCSS();
-    const themeContext = useThemeInternal(false);
+    const themeContext = useThemeInternal();
     let localVariant: ChipsToggleProps["variant"] | undefined;
 
     if (themeContext?.isDarkside) {

package/src/collapsible/Collapsible.context.tsx

@@ -1,4 +1,4 @@
-import { createContext } from "../util/create-context";
+import { createStrictContext } from "../util/create-strict-context";
 import { CollapsibleBaseProps } from "./Collapsible.types";
 
 export type CollapsibleContextProps = Pick<CollapsibleBaseProps, "open"> & {
@@ -24,9 +24,11 @@ export type CollapsibleContextProps = Pick<CollapsibleBaseProps, "open"> & {
   state: "open" | "closed";
 };
 
-export const [CollapsibleContextProvider, useCollapsibleContext] =
-  createContext<CollapsibleContextProps>({
-    name: "CollapsibleContext",
-    errorMessage:
-      "<Collapsible.Trigger> and <Collapsible.Content> must be used within a <Collapsible>",
-  });
+export const {
+  Provider: CollapsibleContextProvider,
+  useContext: useCollapsibleContext,
+} = createStrictContext<CollapsibleContextProps>({
+  name: "CollapsibleContext",
+  errorMessage:
+    "<Collapsible.Trigger> and <Collapsible.Content> must be used within a <Collapsible>",
+});

package/src/copybutton/CopyButton.tsx

@@ -94,7 +94,7 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
 
     const { cn } = useRenameCSS();
 
-    const themeContext = useThemeInternal(false);
+    const themeContext = useThemeInternal();
 
     const handleClick = () => {
       copy(copyText);
@@ -112,7 +112,7 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
     const copyIcon = (
       <LegacyIconWrapper useLegacy={!themeContext?.isDarkside}>
         {active
-          ? activeIcon ?? (
+          ? (activeIcon ?? (
               <CheckmarkIcon
                 aria-hidden={!!text}
                 title={text ? undefined : activeString}
@@ -122,8 +122,8 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
                     : undefined
                 }
               />
-            )
-          : icon ?? (
+            ))
+          : (icon ?? (
               <FilesIcon
                 aria-hidden={!!text}
                 title={text ? undefined : title || translate("title")}
@@ -133,7 +133,7 @@ export const CopyButton = forwardRef<HTMLButtonElement, CopyButtonProps>(
                     : undefined
                 }
               />
-            )}
+            ))}
       </LegacyIconWrapper>
     );
 

package/src/date/Date.Dialog.tsx

@@ -65,7 +65,6 @@ const DateDialog = ({
         className={cn("navds-date__popover", {
           "navds-date": variant === "month",
         })}
-        flip={false}
         {...popoverProps}
       >
         {children}

package/src/date/Date.Input.tsx

@@ -5,7 +5,7 @@ import { FormFieldProps, useFormField } from "../form/useFormField";
 import { useRenameCSS } from "../theme/Theme";
 import { BodyShort, ErrorMessage, Label } from "../typography";
 import { omit } from "../util";
-import { createContext } from "../util/create-context";
+import { createStrictContext } from "../util/create-strict-context";
 import { useDateTranslationContext } from "./Date.locale";
 
 interface DateInputContextProps {
@@ -27,10 +27,13 @@ interface DateInputContextProps {
   defined: boolean;
 }
 
-export const [DateInputContextProvider, useDateInputContext] =
-  createContext<DateInputContextProps>({
-    errorMessage: "useDateInputContext must be used with DateInputContext",
-  });
+export const {
+  Provider: DateInputContextProvider,
+  useContext: useDateInputContext,
+} = createStrictContext<DateInputContextProps>({
+  name: "DateInputContext",
+  errorMessage: "useDateInputContext must be used with DateInputContext",
+});
 
 export interface DateInputProps
   extends FormFieldProps,

package/src/date/Date.locale.ts

@@ -1,5 +1,5 @@
 import { enGB, nb, nn } from "date-fns/locale";
-import { createContext } from "../util/create-context";
+import { createStrictContext } from "../util/create-strict-context";
 import { TFunction } from "../util/i18n/i18n.types";
 import en_translations from "../util/i18n/locales/en";
 import nn_translations from "../util/i18n/locales/nn";
@@ -52,5 +52,9 @@ interface DateTranslationContextProps {
   translate: TFunction<"DatePicker">;
 }
 
-export const [DateTranslationContextProvider, useDateTranslationContext] =
-  createContext<DateTranslationContextProps>();
+export const {
+  Provider: DateTranslationContextProvider,
+  useContext: useDateTranslationContext,
+} = createStrictContext<DateTranslationContextProps>({
+  name: "DateTranslationContext",
+});

package/src/date/datepicker/parts/DatePicker.DayButton.tsx

@@ -24,7 +24,7 @@ const DatePickerDayButton = ({
   }, [modifiers.focused]);
 
   if (modifiers.hidden) {
-    return <></>;
+    return null;
   }
 
   return (

package/src/date/datepicker/parts/DatePicker.RDP.tsx

@@ -84,9 +84,11 @@ const ReactDayPicker = ({
         /**
          * In the case where we have:
          * - Mode: "range"
-         * - selected: { from: undefined, to: Date }
+         * - selected: { from: undefined, to: Date } or
+         * - selected: { from: Date, to: undefined }
          *
-         * RDP returns undefined for newSelection. We need to manually handle this case.
+         *
+         * RDP returns undefined for newSelection. We need to manually handle these cases.
          */
         if (mode !== "range" || newSelection || !isDateRange(selected)) {
           handleSelect(newSelection);
@@ -94,6 +96,14 @@ const ReactDayPicker = ({
         }
 
         if (!selected.to) {
+          /**
+           * If defaultSelected.from is defined, but not "to", and user selects the same date as "from",
+           * we interpret this as user wanting to select a single date range (from === to).
+           */
+          if (selected.from && isSameDay(selected.from, newDate)) {
+            handleSelect({ from: newDate, to: newDate });
+            return;
+          }
           handleSelect({ from: newDate, to: undefined });
           return;
         }

package/src/date/monthpicker/MonthPicker.context.tsx

@@ -1,6 +1,6 @@
 import { Locale, isSameYear } from "date-fns";
 import React from "react";
-import { createContext } from "../../util/create-context";
+import { createStrictContext } from "../../util/create-strict-context";
 import { useControllableState } from "../../util/hooks";
 import { clampDisplayYear } from "../date-utils";
 import { MonthPickerProps } from "./MonthPicker.types";
@@ -33,12 +33,14 @@ type MonthPickerContextProps = {
   toDate?: MonthPickerProps["toDate"];
 };
 
-const [MonthPickerContextProvider, useMonthPickerContext] =
-  createContext<MonthPickerContextProps>({
-    name: "MonthPickerContext",
-    errorMessage:
-      "useMonthPickerContext must be used within an MonthPickerContextProvider",
-  });
+const {
+  Provider: MonthPickerContextProvider,
+  useContext: useMonthPickerContext,
+} = createStrictContext<MonthPickerContextProps>({
+  name: "MonthPickerContext",
+  errorMessage:
+    "useMonthPickerContext must be used within an MonthPickerContextProvider",
+});
 
 const MonthPickerProvider = ({
   children,

package/src/date/monthpicker/MonthPicker.tsx

@@ -1,7 +1,6 @@
 import React, { forwardRef, useState } from "react";
 import { useRenameCSS } from "../../theme/Theme";
-import { useControllableState, useId } from "../../util/hooks";
-import { useMergeRefs } from "../../util/hooks/useMergeRefs";
+import { useControllableState, useId, useMergeRefs } from "../../util/hooks";
 import { useDateLocale, useI18n } from "../../util/i18n/i18n.hooks";
 import { DateDialog } from "../Date.Dialog";
 import { DateInputContextProvider, MonthPickerInput } from "../Date.Input";

package/src/dialog/backdrop/DialogBackdropInternal.tsx

@@ -0,0 +1,29 @@
+import React, { forwardRef } from "react";
+import { useRenameCSS } from "../../theme/Theme";
+import { createTransitionStatusAttribute } from "../../util/hooks/useTransitionStatus";
+import { useDialogContext } from "../root/DialogRoot.context";
+
+type DialogBackdropInternalProps = Omit<
+  React.HTMLAttributes<HTMLDivElement>,
+  "children"
+>;
+
+const DialogBackdropInternal = forwardRef<
+  HTMLDivElement,
+  DialogBackdropInternalProps
+>(({ className, ...restProps }, forwardedRef) => {
+  const { cn } = useRenameCSS();
+  const { transitionStatus } = useDialogContext();
+
+  return (
+    <div
+      {...restProps}
+      ref={forwardedRef}
+      className={cn("navds-dialog__backdrop", className)}
+      {...createTransitionStatusAttribute(transitionStatus)}
+    />
+  );
+});
+
+export { DialogBackdropInternal };
+export type { DialogBackdropInternalProps };

package/src/dialog/body/DialogBody.tsx

@@ -0,0 +1,36 @@
+import React, { forwardRef } from "react";
+import { useRenameCSS } from "../../theme/Theme";
+
+type DialogBodyProps = React.HTMLAttributes<HTMLDivElement>;
+
+/**
+ * @see 🏷️ {@link DialogBodyProps}
+ * @example
+ * ```jsx
+ *  <Dialog>
+ *    <Dialog.Popup>
+ *      <Dialog.Body>
+ *        Dialog body content
+ *      </Dialog.Body>
+ *    </Dialog.Popup>
+ *  </Dialog>
+ * ```
+ */
+const DialogBody = forwardRef<HTMLDivElement, DialogBodyProps>(
+  ({ className, children, ...restProps }, forwardedRef) => {
+    const { cn } = useRenameCSS();
+
+    return (
+      <div
+        {...restProps}
+        ref={forwardedRef}
+        className={cn("navds-dialog__body", className)}
+      >
+        {children}
+      </div>
+    );
+  },
+);
+
+export { DialogBody };
+export type { DialogBodyProps };

package/src/dialog/close-trigger/DialogCloseTrigger.tsx

@@ -0,0 +1,51 @@
+import React, { forwardRef } from "react";
+import { Slot } from "../../slot/Slot";
+import { composeEventHandlers } from "../../util/composeEventHandlers";
+import { useDialogContext } from "../root/DialogRoot.context";
+
+interface DialogCloseTriggerProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  children: React.ReactElement;
+}
+
+/**
+ * @see 🏷️ {@link DialogCloseTriggerProps}
+ * @example
+ * ```jsx
+ *  <Dialog>
+ *    <Dialog.Popup>
+ *      <Dialog.CloseTrigger>
+ *        <Button>Close dialog</Button>
+ *      </Dialog.CloseTrigger>
+ *    </Dialog.Popup>
+ *  </Dialog>
+ * ```
+ */
+const DialogCloseTrigger = forwardRef<
+  HTMLButtonElement,
+  DialogCloseTriggerProps
+>(({ children, onClick, ...restProps }, forwardedRef) => {
+  const { open, setOpen } = useDialogContext();
+
+  const handleClick = (
+    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+  ) => {
+    if (open) {
+      setOpen(false, event.nativeEvent);
+    }
+  };
+
+  return (
+    <Slot
+      type="button"
+      {...restProps}
+      ref={forwardedRef}
+      onClick={composeEventHandlers(onClick, handleClick)}
+    >
+      {children}
+    </Slot>
+  );
+});
+
+export { DialogCloseTrigger };
+export type { DialogCloseTriggerProps };

package/src/dialog/description/DialogDescription.tsx

@@ -0,0 +1,44 @@
+import React, { forwardRef } from "react";
+import { useRenameCSS } from "../../theme/Theme";
+import { BodyShort } from "../../typography";
+import { useDialogContext } from "../root/DialogRoot.context";
+
+type DialogDescriptionProps = React.HTMLAttributes<HTMLParagraphElement>;
+
+/**
+ * @see 🏷️ {@link DialogDescriptionProps}
+ * @example
+ * ```jsx
+ *  <Dialog>
+ *    <Dialog.Popup>
+ *      <Dialog.Header>
+ *        <Dialog.Title>Dialog title</Dialog.Title>
+ *        <Dialog.Description>Dialog description</Dialog.Description>
+ *      </Dialog.Header>
+ *    </Dialog.Popup>
+ *  </Dialog>
+ * ```
+ */
+const DialogDescription = forwardRef<
+  HTMLParagraphElement,
+  DialogDescriptionProps
+>(({ className, children, ...restProps }, forwardedRef) => {
+  const { cn } = useRenameCSS();
+  const { size } = useDialogContext();
+
+  return (
+    <BodyShort
+      {...restProps}
+      ref={forwardedRef}
+      className={cn("navds-dialog__description", className)}
+      size={size}
+      data-color="neutral"
+      textColor="subtle"
+    >
+      {children}
+    </BodyShort>
+  );
+});
+
+export { DialogDescription };
+export type { DialogDescriptionProps };

package/src/dialog/footer/DialogFooter.tsx

@@ -0,0 +1,38 @@
+import React, { forwardRef } from "react";
+import { useRenameCSS } from "../../theme/Theme";
+
+type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;
+
+/**
+ * @see 🏷️ {@link DialogFooterProps}
+ * @example
+ * ```jsx
+ *  <Dialog>
+ *    <Dialog.Popup>
+ *      <Dialog.Footer>
+ *        <Dialog.CloseTrigger>
+ *          <Button>Close dialog</Button>
+ *        </Dialog.CloseTrigger>
+ *      </Dialog.Footer>
+ *    </Dialog.Popup>
+ *  </Dialog>
+ * ```
+ */
+const DialogFooter = forwardRef<HTMLDivElement, DialogFooterProps>(
+  ({ className, children, ...restProps }, forwardedRef) => {
+    const { cn } = useRenameCSS();
+
+    return (
+      <div
+        {...restProps}
+        ref={forwardedRef}
+        className={cn("navds-dialog__footer", className)}
+      >
+        {children}
+      </div>
+    );
+  },
+);
+
+export { DialogFooter };
+export type { DialogFooterProps };