@norges-domstoler/dds-components 0.0.0-dev-20250702125907 → 0.0.0-dev-20250715084850

package/dist/index.d.mts

@@ -173,9 +173,7 @@ interface PrimitiveDisplayProps {
     /** Viser komponenten kun under det angitte brekkpunktet. */
     showBelow?: Breakpoint;
 }
-type BreakpointBasedProp<T> = {
-    [k in Breakpoint]?: T;
-};
+type BreakpointBasedProp<T> = Partial<Record<Breakpoint, T>>;
 type ResponsiveProp<T> = T | BreakpointBasedProp<T>;
 interface PrimitiveLayoutProps {
     /** CSS `width`. Støtter verdi per brekkpunkt eller samme for alle skjermstørrelser. */
@@ -4035,9 +4033,11 @@ type TooltipProps = BaseComponentProps<HTMLDivElement, {
     delay?: number;
     /**`id` for tooltip. */
     tooltipId?: string;
+    /**Om tooltip skal alltid være i DOM, eller bli rendret først når den skal vises. */
+    keepMounted?: boolean;
 } & PickedHTMLAttributes, Omit<HTMLAttributes<HTMLDivElement>, 'children' | keyof PickedHTMLAttributes>>;
 declare const Tooltip: {
-    ({ text, placement, children, tooltipId, delay, style, onMouseLeave, onMouseOver, id, ref, className, htmlProps, ...rest }: TooltipProps): react_jsx_runtime.JSX.Element;
+    ({ text, placement, children, tooltipId, delay, style, onMouseLeave, onMouseOver, keepMounted, id, ref, className, htmlProps, ...rest }: TooltipProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 

package/dist/index.d.ts

@@ -173,9 +173,7 @@ interface PrimitiveDisplayProps {
     /** Viser komponenten kun under det angitte brekkpunktet. */
     showBelow?: Breakpoint;
 }
-type BreakpointBasedProp<T> = {
-    [k in Breakpoint]?: T;
-};
+type BreakpointBasedProp<T> = Partial<Record<Breakpoint, T>>;
 type ResponsiveProp<T> = T | BreakpointBasedProp<T>;
 interface PrimitiveLayoutProps {
     /** CSS `width`. Støtter verdi per brekkpunkt eller samme for alle skjermstørrelser. */
@@ -4035,9 +4033,11 @@ type TooltipProps = BaseComponentProps<HTMLDivElement, {
     delay?: number;
     /**`id` for tooltip. */
     tooltipId?: string;
+    /**Om tooltip skal alltid være i DOM, eller bli rendret først når den skal vises. */
+    keepMounted?: boolean;
 } & PickedHTMLAttributes, Omit<HTMLAttributes<HTMLDivElement>, 'children' | keyof PickedHTMLAttributes>>;
 declare const Tooltip: {
-    ({ text, placement, children, tooltipId, delay, style, onMouseLeave, onMouseOver, id, ref, className, htmlProps, ...rest }: TooltipProps): react_jsx_runtime.JSX.Element;
+    ({ text, placement, children, tooltipId, delay, style, onMouseLeave, onMouseOver, keepMounted, id, ref, className, htmlProps, ...rest }: TooltipProps): react_jsx_runtime.JSX.Element;
     displayName: string;
 };
 

package/dist/index.js

@@ -608,8 +608,8 @@ var getTextColor = (color) => {
 // src/utils/combineHandlers.tsx
 var combineHandlers = (handler1, handler2) => {
   const callback = (event) => {
-    handler1 && handler1(event);
-    handler2 && handler2(event);
+    handler1 == null ? void 0 : handler1(event);
+    handler2 == null ? void 0 : handler2(event);
   };
   return callback;
 };
@@ -657,7 +657,7 @@ var readOnlyMouseDownHandler = (readOnly, onMouseDown) => {
     if (readOnly) {
       evt.preventDefault();
       evt.target.focus();
-    } else onMouseDown && onMouseDown(evt);
+    } else onMouseDown == null ? void 0 : onMouseDown(evt);
   };
 };
 var readOnlyKeyDownHandler = (type, readOnly, onKeyDown) => {
@@ -670,7 +670,7 @@ var readOnlyKeyDownHandler = (type, readOnly, onKeyDown) => {
       } else if (type === "selectionControl" && evt.key === " ") {
         evt.preventDefault();
       }
-    } else onKeyDown && onKeyDown(evt);
+    } else onKeyDown == null ? void 0 : onKeyDown(evt);
   };
 };
 var readOnlyChangeHandler = (readOnly, onChange) => {
@@ -678,7 +678,7 @@ var readOnlyChangeHandler = (readOnly, onChange) => {
     if (readOnly) {
       return;
     }
-    onChange && onChange(evt);
+    onChange == null ? void 0 : onChange(evt);
   };
 };
 var readOnlyClickHandler = (readOnly, onClick) => {
@@ -687,7 +687,7 @@ var readOnlyClickHandler = (readOnly, onClick) => {
       evt.preventDefault();
       return;
     }
-    onClick && onClick(evt);
+    onClick == null ? void 0 : onClick(evt);
   };
 };
 
@@ -4691,13 +4691,13 @@ var OverflowMenuGroup = ({
   const combinedMenuRef = useCombinedRef(menuRef, floatingRef);
   const handleClose = () => {
     if (isOpen) {
-      onClose && onClose();
+      onClose == null ? void 0 : onClose();
       close();
     }
   };
   const handleToggle = () => {
-    !isOpen && (onOpen == null ? void 0 : onOpen());
-    isOpen && (onClose == null ? void 0 : onClose());
+    if (!isOpen) onOpen == null ? void 0 : onOpen();
+    if (isOpen) onClose == null ? void 0 : onClose();
     toggle();
   };
   useOnClickOutside([menuRef.current, buttonRef.current], () => {
@@ -4706,7 +4706,7 @@ var OverflowMenuGroup = ({
   useOnKeyDown(["Esc", "Escape"], () => {
     var _a;
     if (isOpen) {
-      onClose && onClose();
+      onClose == null ? void 0 : onClose();
       close();
       (_a = buttonRef.current) == null ? void 0 : _a.focus();
     }
@@ -5487,7 +5487,7 @@ var RadioButton = ({
   const radioButtonGroup = useRadioButtonGroup();
   const handleChange = (event) => {
     var _a;
-    onChange && onChange(event);
+    onChange == null ? void 0 : onChange(event);
     (_a = radioButtonGroup == null ? void 0 : radioButtonGroup.onChange) == null ? void 0 : _a.call(radioButtonGroup, event, event.target.value);
   };
   const describedByIds = [];
@@ -5863,7 +5863,7 @@ var Chip = ({
   const [isOpen, setIsOpen] = (0, import_react35.useState)(true);
   const onClick = () => {
     setIsOpen(false);
-    onClose && onClose();
+    onClose == null ? void 0 : onClose();
   };
   return isOpen ? /* @__PURE__ */ (0, import_jsx_runtime221.jsxs)(
     "div",
@@ -7775,6 +7775,7 @@ var Tooltip = ({
   style,
   onMouseLeave,
   onMouseOver,
+  keepMounted = true,
   id,
   ref,
   className,
@@ -7784,7 +7785,7 @@ var Tooltip = ({
   const generatedId = (0, import_react56.useId)();
   const uniqueTooltipId = tooltipId != null ? tooltipId : `${generatedId}-tooltip`;
   const [open, setOpen] = (0, import_react56.useState)(false);
-  const [inView, setInView] = (0, import_react56.useState)(false);
+  const [inView, setInView] = (0, import_react56.useState)(keepMounted ? false : true);
   const [arrowElement, setArrowElement] = (0, import_react56.useState)(null);
   const { refs, styles: positionStyles } = useFloatPosition(arrowElement, {
     placement
@@ -7793,19 +7794,23 @@ var Tooltip = ({
   const combinedRef = useCombinedRef(ref, refs.setFloating, tooltipRef);
   const closeWhenNotInView = (entries) => {
     const [entry] = entries;
-    entry.isIntersecting ? setInView(true) : setInView(false);
+    if (entry.isIntersecting) {
+      setInView(true);
+    } else setInView(false);
   };
   (0, import_react56.useEffect)(() => {
-    const options = {
-      root: null,
-      rootMargin: "0px"
-    };
-    const ref2 = tooltipRef.current;
-    const observer = new IntersectionObserver(closeWhenNotInView, options);
-    if (ref2) observer.observe(ref2);
-    return () => {
-      if (ref2) observer.unobserve(ref2);
-    };
+    if (keepMounted) {
+      const options = {
+        root: null,
+        rootMargin: "0px"
+      };
+      const ref2 = tooltipRef.current;
+      const observer = new IntersectionObserver(closeWhenNotInView, options);
+      if (ref2) observer.observe(ref2);
+      return () => {
+        if (ref2) observer.unobserve(ref2);
+      };
+    }
   }, [tooltipRef]);
   (0, import_react56.useEffect)(() => {
     if (tooltipRef.current) {
@@ -7838,15 +7843,19 @@ var Tooltip = ({
       timer = setTimeout(() => setOpen(true), delay);
     }
   };
+  const hasTransitionedIn = useMountTransition(open, 500);
+  const isMounted = hasTransitionedIn && open;
+  const isTransientlyMounted = !keepMounted && isMounted;
   const anchorElement = import_react56.Children.only(
     (0, import_react56.cloneElement)(children, {
       ref: refs.setReference,
       onFocus: combineHandlers(openTooltip, children.props.onFocus),
       onBlur: combineHandlers(closeTooltip, children.props.onBlur),
-      "aria-describedby": uniqueTooltipId
+      "aria-describedby": isTransientlyMounted || keepMounted ? uniqueTooltipId : void 0
     })
   );
-  const openCn = open && inView ? "open" : "closed";
+  const openCn = keepMounted && open && inView || isTransientlyMounted ? "open" : "closed";
+  const ariaHidden = keepMounted ? !open : void 0;
   return /* @__PURE__ */ (0, import_jsx_runtime251.jsxs)(
     "div",
     {
@@ -7861,13 +7870,13 @@ var Tooltip = ({
       onMouseOver: combineHandlers(openTooltip, onMouseOver),
       children: [
         anchorElement,
-        /* @__PURE__ */ (0, import_jsx_runtime251.jsxs)(
+        !keepMounted && (open || hasTransitionedIn) || keepMounted ? /* @__PURE__ */ (0, import_jsx_runtime251.jsxs)(
           Paper,
           {
             id: uniqueTooltipId,
             ref: combinedRef,
             role: "tooltip",
-            "aria-hidden": !open,
+            "aria-hidden": ariaHidden,
             style: { ...positionStyles.floating },
             elevation: 1,
             border: "border-subtle",
@@ -7899,7 +7908,7 @@ var Tooltip = ({
               ] }) })
             ]
           }
-        )
+        ) : null
       ]
     }
   );
@@ -7987,26 +7996,26 @@ var Feedback = ({
   const tThumbUpTooltip = thumbUpTooltip != null ? thumbUpTooltip : t(texts11.good);
   const tThumbDownTooltip = thumbDownTooltip != null ? thumbDownTooltip : t(texts11.bad);
   (0, import_react57.useEffect)(() => {
-    ratingProp !== void 0 && setRating(ratingProp);
+    if (ratingProp !== void 0) setRating(ratingProp);
   }, [ratingProp]);
   (0, import_react57.useEffect)(() => {
-    feedbackTextProp !== void 0 && setFeedbackText(feedbackTextProp);
+    if (feedbackTextProp !== void 0) setFeedbackText(feedbackTextProp);
   }, [feedbackTextProp]);
   (0, import_react57.useEffect)(() => {
-    isSubmittedProp !== void 0 && setIsFeedbackSubmitted(isSubmittedProp);
+    if (isSubmittedProp !== void 0) setIsFeedbackSubmitted(isSubmittedProp);
   }, [isSubmittedProp]);
   const handleRatingChange = (newRating) => {
-    onRating && onRating(newRating);
-    onSubmit && feedbackTextAreaExcluded && onSubmit(newRating, "");
-    ratingProp === void 0 && setRating(newRating);
+    onRating == null ? void 0 : onRating(newRating);
+    if (onSubmit && feedbackTextAreaExcluded) onSubmit(newRating, "");
+    if (ratingProp === void 0) setRating(newRating);
   };
   const handleFeedbackTextChange = (newFeedbackText) => {
-    onFeedbackTextChange && onFeedbackTextChange(newFeedbackText);
-    feedbackTextProp === void 0 && setFeedbackText(newFeedbackText);
+    onFeedbackTextChange == null ? void 0 : onFeedbackTextChange(newFeedbackText);
+    if (feedbackTextProp === void 0) setFeedbackText(newFeedbackText);
   };
   const handleSubmit = () => {
-    onSubmit && onSubmit(rating, feedbackText != null ? feedbackText : "");
-    isSubmittedProp === void 0 && setIsFeedbackSubmitted(true);
+    onSubmit == null ? void 0 : onSubmit(rating, feedbackText != null ? feedbackText : "");
+    if (isSubmittedProp === void 0) setIsFeedbackSubmitted(true);
   };
   if (rating === null && !isFeedbackSubmitted) {
     return /* @__PURE__ */ (0, import_jsx_runtime253.jsx)(
@@ -8466,11 +8475,9 @@ var useFileUploader = (props) => {
     () => ({
       onBlur: onRootBlur,
       onFocus: onRootFocus,
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onDragEnter: onRootDragEnter,
       onDragOver: onRootDragOver,
       onDragLeave: onRootDragLeave,
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onDrop: setFiles,
       ref: rootRef
     }),
@@ -8497,7 +8504,6 @@ var useFileUploader = (props) => {
       style: { display: "none" },
       tabIndex: -1,
       ref: inputRef,
-      // eslint-disable-next-line @typescript-eslint/no-misused-promises
       onChange: setFiles,
       multiple: !maxFiles || maxFiles > 1,
       ...accept ? { accept: accept.join(",") } : {}
@@ -8806,7 +8812,7 @@ var GlobalMessage = ({
             purpose: "tertiary",
             onClick: () => {
               setClosed(true);
-              onClose && onClose();
+              onClose == null ? void 0 : onClose();
             },
             size: "small",
             "aria-label": t(commonTexts.closeMessage)
@@ -9511,7 +9517,7 @@ var LocalMessage = ({
             purpose: "tertiary",
             onClick: () => {
               setClosed(true);
-              onClose && onClose();
+              onClose == null ? void 0 : onClose();
             },
             size: "xsmall",
             "aria-label": t(commonTexts.closeMessage),
@@ -10388,7 +10394,7 @@ var Pagination = ({
   const pagesLength = Math.ceil(itemsAmount / itemsPerPage);
   const items = PaginationGenerator(pagesLength, activePage);
   const onPageChange = (event, page) => {
-    page && setActivePage(page);
+    if (page) setActivePage(page);
     if (event && onChange) {
       onChange(event, page);
     }
@@ -11433,7 +11439,7 @@ var Popover = ({
   );
   const multiRef = useCombinedRef(ref, popoverRef, floatingRef);
   (0, import_react75.useEffect)(() => {
-    setFloatOptions && setFloatOptions({ placement, offset });
+    setFloatOptions == null ? void 0 : setFloatOptions({ placement, offset });
   }, [placement, offset]);
   useOnClickOutside([popoverRef.current, anchorEl], () => {
     if (isOpen && !hasContext) onClose == null ? void 0 : onClose();
@@ -11522,11 +11528,11 @@ var PopoverGroup = ({
   const { refs, styles: positionStyles } = useFloatPosition(null, floatOptions);
   const handleClose = () => {
     setOpen(false);
-    onClose && onClose();
+    onClose == null ? void 0 : onClose();
   };
   const handleOpen = () => {
     setOpen(true);
-    onOpen && onOpen();
+    onOpen == null ? void 0 : onOpen();
   };
   const handleToggle = () => {
     if (open) {
@@ -11655,8 +11661,8 @@ var ProgressTrackerItem = (props) => {
   const itemState = toItemState(active, completed, disabled);
   const handleClick = () => {
     if (!disabled) {
-      onClick && onClick(index);
-      handleStepChange && handleStepChange(index);
+      onClick == null ? void 0 : onClick(index);
+      handleStepChange == null ? void 0 : handleStepChange(index);
     }
   };
   const stepNumberContent = (0, import_react78.useMemo)(() => {
@@ -11774,7 +11780,7 @@ var ProgressTracker = (() => {
     const [thisActiveStep, setActiveStep] = (0, import_react79.useState)(activeStep);
     const handleChange = (step) => {
       setActiveStep(step);
-      onStepChange && onStepChange(step);
+      onStepChange == null ? void 0 : onStepChange(step);
     };
     (0, import_react79.useEffect)(() => {
       if (activeStep !== void 0 && activeStep != thisActiveStep) {
@@ -12136,9 +12142,10 @@ var Search = ({
   const context = useAutocompleteSearch();
   const combinedRef = context.inputRef ? useCombinedRef(context.inputRef, ref) : ref;
   const handleChange = (e) => {
+    var _a2;
     setHasValue(e.target.value !== "");
-    context.onValueChange && context.onValueChange(e);
-    onChange && onChange(e);
+    (_a2 = context == null ? void 0 : context.onValueChange) == null ? void 0 : _a2.call(context, e);
+    onChange == null ? void 0 : onChange(e);
   };
   const clearInput = () => {
     const clearChangeEvent = createClearChangeEvent(uniqueId);
@@ -12325,12 +12332,12 @@ var SearchAutocompleteWrapper = (props) => {
     } else {
       setSuggestions([]);
     }
-    onChange && onChange(e);
+    onChange == null ? void 0 : onChange(e);
   };
   const handleSuggestionClick = (e) => {
     setSuggestions([]);
     handleSetInputValue(e.target.innerText);
-    onSuggestionSelection && onSuggestionSelection();
+    onSuggestionSelection == null ? void 0 : onSuggestionSelection();
     closeSuggestions();
   };
   const handleSetInputValue = (value2) => {
@@ -12752,7 +12759,7 @@ var CollapsibleRow = ({
   const { isCollapsed, headerValues, definingColumnIndex } = useCollapsibleTableContext();
   const [childrenCollapsed, setChildrenCollapsed] = (0, import_react89.useState)(true);
   (0, import_react89.useEffect)(() => {
-    !isCollapsed && setChildrenCollapsed(true);
+    if (!isCollapsed) setChildrenCollapsed(true);
   }, [isCollapsed]);
   const rowProps = (isOpenCollapsibleHeader) => {
     return {
@@ -13006,7 +13013,7 @@ var Tabs = ({
   const tabPanelsRef = (0, import_react93.useRef)(null);
   const handleTabChange = (index) => {
     setActiveTab(index);
-    onChange && onChange(index);
+    onChange == null ? void 0 : onChange(index);
   };
   (0, import_react93.useEffect)(() => {
     if (activeTab !== void 0 && activeTab !== thisActiveTab) {
@@ -13167,7 +13174,7 @@ var TabList = ({
   const [widths, setWidths] = (0, import_react95.useState)([]);
   const handleOnFocus = (event) => {
     setHasTabFocus(true);
-    onFocus && onFocus(event);
+    onFocus == null ? void 0 : onFocus(event);
   };
   const handleOnBlur = (event) => {
     var _a;
@@ -13780,8 +13787,9 @@ var ToggleRadio = ({
   const uniqueId = id != null ? id : `${generatedId}-ToggleRadio`;
   const group = useToggleBarContext();
   const handleChange = (event) => {
-    onChange && onChange(event);
-    (group == null ? void 0 : group.onChange) && group.onChange(event);
+    var _a;
+    onChange == null ? void 0 : onChange(event);
+    (_a = group == null ? void 0 : group.onChange) == null ? void 0 : _a.call(group, event);
   };
   const contentTypeCn = label ? "with-text" : "just-icon";
   return /* @__PURE__ */ (0, import_jsx_runtime321.jsxs)("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [