@carbon/react 1.66.0-rc.0 → 1.67.0-rc.0

package/es/components/Tag/DismissibleTag.d.ts

@@ -43,6 +43,10 @@ export interface DismissibleTagBaseProps {
      * Provide text to be rendered inside of a the tag.
      */
     text?: string;
+    /**
+     * Provide a custom `title` to be inserted in the tag.
+     */
+    tagTitle?: string;
     /**
      * Text to show on clear filters
      */
@@ -54,7 +58,7 @@ export interface DismissibleTagBaseProps {
 }
 export type DismissibleTagProps<T extends React.ElementType> = PolymorphicProps<T, DismissibleTagBaseProps>;
 declare const DismissibleTag: {
-    <T extends React.ElementType<any, keyof React.JSX.IntrinsicElements>>({ className, disabled, id, renderIcon, title, onClose, slug, size, text, type, ...other }: DismissibleTagProps<T>): import("react/jsx-runtime").JSX.Element;
+    <T extends React.ElementType<any, keyof React.JSX.IntrinsicElements>>({ className, disabled, id, renderIcon, title, onClose, slug, size, text, tagTitle, type, ...other }: DismissibleTagProps<T>): import("react/jsx-runtime").JSX.Element;
     propTypes: {
         /**
          * Provide a custom className that is applied to the containing <span>
@@ -90,6 +94,10 @@ declare const DismissibleTag: {
          * Provide text to be rendered inside of a the tag.
          */
         text: PropTypes.Requireable<string>;
+        /**
+         * Provide a custom `title` to be inserted in the tag.
+         */
+        tagTitle: PropTypes.Requireable<string>;
         /**
          * Text to show on clear filters
          */

package/es/components/Tag/DismissibleTag.js

@@ -31,6 +31,7 @@ const DismissibleTag = _ref => {
     slug,
     size,
     text,
+    tagTitle,
     type,
     ...other
   } = _ref;
@@ -76,7 +77,7 @@ const DismissibleTag = _ref => {
   }, otherProps), /*#__PURE__*/React__default.createElement("div", {
     className: `${prefix}--interactive--tag-children`
   }, /*#__PURE__*/React__default.createElement(Text, {
-    title: text,
+    title: tagTitle ? tagTitle : text,
     className: `${prefix}--tag__label`
   }, text), /*#__PURE__*/React__default.createElement(Tooltip, {
     label: isEllipsisApplied ? dismissLabel : title,
@@ -89,8 +90,7 @@ const DismissibleTag = _ref => {
     className: `${prefix}--tag__close-icon`,
     onClick: handleClose,
     disabled: disabled,
-    "aria-label": title,
-    title: title
+    "aria-label": title
   }, _Close || (_Close = /*#__PURE__*/React__default.createElement(Close, null)))), normalizedSlug));
 };
 DismissibleTag.propTypes = {
@@ -128,6 +128,10 @@ DismissibleTag.propTypes = {
    * Provide text to be rendered inside of a the tag.
    */
   text: PropTypes.string,
+  /**
+   * Provide a custom `title` to be inserted in the tag.
+   */
+  tagTitle: PropTypes.string,
   /**
    * Text to show on clear filters
    */

package/es/components/Tag/Tag.js

@@ -131,10 +131,10 @@ const Tag = /*#__PURE__*/React__default.forwardRef(function Tag(_ref, forwardRef
     definition: children !== null && children !== undefined ? children : typeText,
     className: `${prefix}--definition--tooltip--tag`
   }, /*#__PURE__*/React__default.createElement(Text, {
-    title: children !== null && children !== undefined ? children : typeText,
+    title: children !== null && children !== undefined && typeof children === 'string' ? children : typeText,
     className: labelClasses
   }, children !== null && children !== undefined ? children : typeText)) : /*#__PURE__*/React__default.createElement(Text, {
-    title: children !== null && children !== undefined ? children : typeText,
+    title: children !== null && children !== undefined && typeof children === 'string' ? children : typeText,
     className: labelClasses
   }, children !== null && children !== undefined ? children : typeText), normalizedSlug);
 });

package/es/components/Toggletip/index.js

@@ -74,7 +74,8 @@ function Toggletip(_ref2) {
   const prefix = usePrefix();
   const id = useId();
   const className = cx(`${prefix}--toggletip`, customClassName, {
-    [`${prefix}--toggletip--open`]: open
+    [`${prefix}--toggletip--open`]: open,
+    [`${prefix}--autoalign`]: autoAlign
   });
   const actions = {
     toggle: () => {

package/es/components/UIShell/HeaderPanel.js

@@ -40,7 +40,7 @@ const HeaderPanel = /*#__PURE__*/React__default.forwardRef(function HeaderPanel(
   const eventHandlers = {};
   if (addFocusListeners) {
     eventHandlers.onBlur = event => {
-      if (!event.currentTarget.contains(event.relatedTarget) && !lastClickedElement?.classList?.contains('cds--switcher__item-link')) {
+      if (!event.currentTarget.contains(event.relatedTarget) && !lastClickedElement?.classList?.contains(`${prefix}--switcher__item-link`)) {
         setExpandedState(false);
         setLastClickedElement(null);
         if (expanded) {

package/es/index.js

@@ -159,6 +159,18 @@ export { default as SideNavMenuItem } from './components/UIShell/SideNavMenuItem
 export { default as SideNavSwitcher } from './components/UIShell/SideNavSwitcher.js';
 export { default as UnorderedList } from './components/UnorderedList/UnorderedList.js';
 export { FeatureFlags as unstable_FeatureFlags, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags } from './components/FeatureFlags/index.js';
+export { default as unstable__FluidSelect } from './components/FluidSelect/FluidSelect.js';
+export { default as unstable__FluidSelectSkeleton } from './components/FluidSelect/FluidSelect.Skeleton.js';
+export { default as unstable__FluidSearch } from './components/FluidSearch/FluidSearch.js';
+export { default as unstable__FluidSearchSkeleton } from './components/FluidSearch/FluidSearch.Skeleton.js';
+export { default as unstable__FluidTextArea } from './components/FluidTextArea/FluidTextArea.js';
+export { default as unstable__FluidTextAreaSkeleton } from './components/FluidTextArea/FluidTextArea.Skeleton.js';
+export { default as unstable__FluidTextInput } from './components/FluidTextInput/FluidTextInput.js';
+import './components/FluidTextInput/FluidPasswordInput.js';
+export { default as unstable__FluidTextInputSkeleton } from './components/FluidTextInput/FluidTextInput.Skeleton.js';
+export { default as unstable__FluidTimePicker } from './components/FluidTimePicker/FluidTimePicker.js';
+export { default as unstable__FluidTimePickerSkeleton } from './components/FluidTimePicker/FluidTimePicker.Skeleton.js';
+export { default as unstable__FluidTimePickerSelect } from './components/FluidTimePickerSelect/FluidTimePickerSelect.js';
 export { Heading, Section } from './components/Heading/index.js';
 export { IconButton, IconButtonKinds } from './components/IconButton/index.js';
 export { Layer, useLayer } from './components/Layer/index.js';
@@ -179,11 +191,6 @@ export { GlobalTheme, Theme, ThemeContext, usePrefersDarkScheme, useTheme } from
 export { PrefixContext, usePrefix } from './internal/usePrefix.js';
 export { useIdPrefix } from './internal/useIdPrefix.js';
 export { default as unstable__FluidDatePickerSkeleton } from './components/FluidDatePicker/FluidDatePicker.Skeleton.js';
-export { default as unstable__FluidSearchSkeleton } from './components/FluidSearch/FluidSearch.Skeleton.js';
-export { default as unstable__FluidTextArea } from './components/FluidTextArea/FluidTextArea.js';
-export { default as unstable__FluidTextAreaSkeleton } from './components/FluidTextArea/FluidTextArea.Skeleton.js';
-export { default as unstable__FluidTextInput } from './components/FluidTextInput/FluidTextInput.js';
-export { default as unstable__FluidTextInputSkeleton } from './components/FluidTextInput/FluidTextInput.Skeleton.js';
 export { default as unstable_PageSelector } from './components/Pagination/experimental/PageSelector.js';
 export { default as unstable_Pagination } from './components/Pagination/experimental/Pagination.js';
 export { default as ContainedListItem } from './components/ContainedList/ContainedListItem/ContainedListItem.js';
@@ -200,12 +207,6 @@ export { default as unstable__FluidDropdown } from './components/FluidDropdown/F
 export { default as unstable__FluidDropdownSkeleton } from './components/FluidDropdown/FluidDropdown.Skeleton.js';
 export { default as unstable__FluidMultiSelect } from './components/FluidMultiSelect/FluidMultiSelect.js';
 export { default as unstable__FluidMultiSelectSkeleton } from './components/FluidMultiSelect/FluidMultiSelect.Skeleton.js';
-export { default as unstable__FluidSelect } from './components/FluidSelect/FluidSelect.js';
-export { default as unstable__FluidSelectSkeleton } from './components/FluidSelect/FluidSelect.Skeleton.js';
-export { default as unstable__FluidSearch } from './components/FluidSearch/FluidSearch.js';
-export { default as unstable__FluidTimePicker } from './components/FluidTimePicker/FluidTimePicker.js';
-export { default as unstable__FluidTimePickerSkeleton } from './components/FluidTimePicker/FluidTimePicker.Skeleton.js';
-export { default as unstable__FluidTimePickerSelect } from './components/FluidTimePickerSelect/FluidTimePickerSelect.js';
 export { LayoutDirection as unstable_LayoutDirection } from './components/LayoutDirection/LayoutDirection.js';
 export { useLayoutDirection as unstable_useLayoutDirection } from './components/LayoutDirection/useLayoutDirection.js';
 export { Text as unstable_Text } from './components/Text/Text.js';