Feat/add overlay classname

Changelog.md

@@ -7,6 +7,13 @@ This project does _not_ adhere to
 [Semantic Versioning](https://semver.org/spec/v2.0.0.html) but contrary to it
 every new version is a new major version.
 
+## 235.0.0 - 2025-10-30
+
+### Added
+
+- `Overlay` component now supports a `className` prop for custom styling of the
+  content.
+
 ## 234.0.0 - 2025-10-21
 
 ### Changed

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@nordicsemiconductor/pc-nrfconnect-shared",
-    "version": "234.0.0",
+    "version": "235.0.0",
     "description": "Shared commodities for developing pc-nrfconnect-* packages",
     "repository": {
         "type": "git",

src/Overlay/Overlay.tsx

@@ -8,6 +8,8 @@ import React, { useState } from 'react';
 import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
 import Tooltip from 'react-bootstrap/Tooltip';
 
+import classNames from '../utils/classNames';
+
 import './overlay.scss';
 
 export default ({
@@ -20,6 +22,7 @@ export default ({
     tooltipId,
     placement = 'bottom-start',
     tooltipChildren,
+    className,
 }: {
     keepShowingOnHoverTooltip?: boolean;
     children: React.ReactNode;
@@ -38,6 +41,7 @@ export default ({
         | 'left'
         | 'left-start';
     tooltipChildren: React.ReactNode;
+    className?: string;
 }) => {
     const [show, setShow] = useState<boolean>();
 
@@ -65,7 +69,9 @@ export default ({
                 </Tooltip>
             }
         >
-            <div className="tw-cursor-help">{children}</div>
+            <div className={classNames('tw-cursor-help', className)}>
+                {children}
+            </div>
         </OverlayTrigger>
     );
 };