@carbon-labs/react-ui-shell 0.69.0 → 0.70.0

package/README.md

@@ -41,6 +41,7 @@ components are provided by `@carbon-labs/react-ui-shell`:
 - `SideNavMenu`
 - `SideNavMenuItem`
 - `SideNavSlot`
+- `SideNavTitle`
 - `TrialCountdown`
 
 ```jsx

package/es/components/SideNavTitle.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+export interface SideNavTitleProps {
+    /**
+     * Provide the contents of the SideNavTitle.
+     */
+    children?: React.ReactNode;
+    /**
+     * Provide an optional class to be applied to the containing node
+     */
+    className?: string;
+}
+export declare const SideNavTitle: React.FC<SideNavTitleProps>;

package/es/components/SideNavTitle.js

@@ -0,0 +1,36 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import React__default from 'react';
+import { usePrefix } from '../internal/usePrefix.js';
+import { SideNavDivider } from '@carbon/react';
+
+var _SideNavDivider;
+const SideNavTitle = ({
+  children,
+  className: customClassName
+}) => {
+  const prefix = usePrefix();
+  const className = cx(`${prefix}--side-nav__title`, customClassName);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", {
+    className: className
+  }, children), _SideNavDivider || (_SideNavDivider = /*#__PURE__*/React__default.createElement(SideNavDivider, null)));
+};
+SideNavTitle.propTypes = {
+  /**
+   * Provide the contents of the SideNavTitle.
+   */
+  children: PropTypes.node,
+  /**
+   * Provide an optional class to be applied to the containing node
+   */
+  className: PropTypes.string
+};
+
+export { SideNavTitle };

package/es/index.d.ts

@@ -19,3 +19,4 @@ export { HeaderDivider } from './components/HeaderDivider';
 export { TrialCountdown } from './components/TrialCountdown';
 export * as Profile from './components/Profile';
 export { SideNavSlot } from './components/SideNavSlot';
+export { SideNavTitle } from './components/SideNavTitle';

package/es/index.js

@@ -19,3 +19,4 @@ export { TrialCountdown } from './components/TrialCountdown.js';
 import * as Profile from './components/Profile.js';
 export { Profile };
 export { SideNavSlot } from './components/SideNavSlot.js';
+export { SideNavTitle } from './components/SideNavTitle.js';

package/lib/components/SideNavTitle.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright IBM Corp. 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+export interface SideNavTitleProps {
+    /**
+     * Provide the contents of the SideNavTitle.
+     */
+    children?: React.ReactNode;
+    /**
+     * Provide an optional class to be applied to the containing node
+     */
+    className?: string;
+}
+export declare const SideNavTitle: React.FC<SideNavTitleProps>;

package/lib/components/SideNavTitle.js

@@ -0,0 +1,38 @@
+/**
+ * Copyright IBM Corp. 2024
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+'use strict';
+
+var cx = require('classnames');
+var PropTypes = require('prop-types');
+var React__default = require('react');
+var usePrefix = require('../internal/usePrefix.js');
+var react = require('@carbon/react');
+
+var _SideNavDivider;
+const SideNavTitle = ({
+  children,
+  className: customClassName
+}) => {
+  const prefix = usePrefix.usePrefix();
+  const className = cx(`${prefix}--side-nav__title`, customClassName);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", {
+    className: className
+  }, children), _SideNavDivider || (_SideNavDivider = /*#__PURE__*/React__default.createElement(react.SideNavDivider, null)));
+};
+SideNavTitle.propTypes = {
+  /**
+   * Provide the contents of the SideNavTitle.
+   */
+  children: PropTypes.node,
+  /**
+   * Provide an optional class to be applied to the containing node
+   */
+  className: PropTypes.string
+};
+
+exports.SideNavTitle = SideNavTitle;

package/lib/index.d.ts

@@ -19,3 +19,4 @@ export { HeaderDivider } from './components/HeaderDivider';
 export { TrialCountdown } from './components/TrialCountdown';
 export * as Profile from './components/Profile';
 export { SideNavSlot } from './components/SideNavSlot';
+export { SideNavTitle } from './components/SideNavTitle';

package/lib/index.js

@@ -20,6 +20,7 @@ var HeaderDivider = require('./components/HeaderDivider.js');
 var TrialCountdown = require('./components/TrialCountdown.js');
 var Profile = require('./components/Profile.js');
 var SideNavSlot = require('./components/SideNavSlot.js');
+var SideNavTitle = require('./components/SideNavTitle.js');
 
 
 
@@ -40,3 +41,4 @@ exports.HeaderDivider = HeaderDivider.HeaderDivider;
 exports.TrialCountdown = TrialCountdown.TrialCountdown;
 exports.Profile = Profile;
 exports.SideNavSlot = SideNavSlot.SideNavSlot;
+exports.SideNavTitle = SideNavTitle.SideNavTitle;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carbon-labs/react-ui-shell",
-  "version": "0.69.0",
+  "version": "0.70.0",
   "publishConfig": {
     "access": "public",
     "provenance": true
@@ -42,5 +42,5 @@
   "dependencies": {
     "@ibm/telemetry-js": "^1.9.1"
   },
-  "gitHead": "cc7ea86ffe90b25c4a73caf93502ee36f1c0b05d"
+  "gitHead": "7ee50abce7452bb5bc94f5de474ffb7f72a0f234"
 }

package/scss/styles/_side-nav.scss

@@ -139,6 +139,21 @@ div:has(.#{$prefix}--header)
   }
 }
 
+// SideNavTitle
+.#{$prefix}--side-nav__title {
+  @include type-style('label-01');
+
+  display: none;
+  color: $text-secondary;
+  padding-block-start: $spacing-05;
+  padding-inline-start: $spacing-05;
+  white-space: nowrap;
+}
+
+.#{$prefix}--side-nav--expanded .#{$prefix}--side-nav__title {
+  display: block;
+}
+
 // SideNavMenu
 // Level 2 / Doublewide Level 3
 // without icon