@carbon/ibm-products 2.89.0 → 2.90.0

package/es/components/EditUpdateCards/EditUpdateCards.js

@@ -12,7 +12,6 @@ import { getDevtoolsProps } from "../../global/js/utils/devtools.js";
 import { ProductiveCard } from "../ProductiveCard/ProductiveCard.js";
 import React from "react";
 import PropTypes from "prop-types";
-
 //#region src/components/EditUpdateCards/EditUpdateCards.tsx
 /**
 * Copyright IBM Corp. 2022, 2024
@@ -66,36 +65,104 @@ EditUpdateCards.deprecated = {
 };
 EditUpdateCards.displayName = componentName;
 EditUpdateCards.propTypes = {
+	/**
+	* Icons that are displayed on the card. Refer to design documentation for implementation guidelines. Note: href is deprecated. Set link.href for href functionality. If you are setting link object, href is a required property. link object supports all anchor element properties. Precedence: link.href > href. If link.href or href is set => anchor element, else button.
+	*/
+	/**@ts-ignore */
 	actionIcons: PropTypes.arrayOf(PropTypes.shape({
 		id: PropTypes.string,
 		icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
 		onKeyDown: PropTypes.func,
 		onClick: PropTypes.func,
 		iconDescription: PropTypes.string,
+		/**
+		* @deprecated please use the `link.href` instead
+		*/
 		href: PropTypes.string,
 		link: PropTypes.shape({ href: PropTypes.string.isRequired })
 	})),
+	/**
+	* Determines if the action icons are on the top or bottom of the card
+	*/
 	actionsPlacement: PropTypes.oneOf(["top", "bottom"]),
+	/**
+	* Optional label for the top of the card.
+	*/
 	className: PropTypes.string,
+	/**
+	* Optional header description
+	*/
 	description: PropTypes.string,
+	/**
+	* Edit mode children
+	*/
 	editChildren: PropTypes.node,
+	/**
+	* Edit mode
+	*/
 	editMode: PropTypes.bool,
+	/**
+	* Optional label for the top of the card
+	*/
 	label: PropTypes.string,
+	/**
+	* Function that's called from the primary button or action icon
+	*/
 	onPrimaryButtonClick: PropTypes.func,
+	/**
+	* Function that's called from the secondary button or action icon
+	*/
 	onSecondaryButtonClick: PropTypes.func,
+	/**
+	* Preview mode children
+	*/
 	previewChildren: PropTypes.node,
+	/**
+	* Optional prop to allow overriding the icon rendering. Can be a React component class
+	*/
+	/**@ts-ignore */
 	primaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+	/**
+	* Establishes the kind of button displayed for the primary button
+	*/
 	primaryButtonKind: PropTypes.oneOf(["primary", "ghost"]),
+	/**
+	* Determines if the primary button is on the top or bottom of the card
+	*/
 	primaryButtonPlacement: PropTypes.oneOf(["top", "bottom"]),
+	/**
+	* The text that's displayed in the primary button
+	*/
 	primaryButtonText: PropTypes.string,
+	/**
+	* Optionally specify an href for your Button to become an <a> element
+	*/
 	secondaryButtonHref: PropTypes.string,
+	/**
+	* Optional prop to allow overriding the icon rendering. Can be a React component class
+	*/
+	/**@ts-ignore */
 	secondaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+	/**
+	* Establishes the kind of button displayed for the secondary button
+	*/
 	secondaryButtonKind: PropTypes.oneOf(["secondary", "ghost"]),
+	/**
+	* Determines if the secondary button is on the top or bottom of the card
+	*/
 	secondaryButtonPlacement: PropTypes.oneOf(["top", "bottom"]),
+	/**
+	* The text that's displayed in the secondary button
+	*/
 	secondaryButtonText: PropTypes.string,
+	/**
+	* Title that's displayed at the top of the card
+	*/
 	title: PropTypes.string,
+	/**
+	* Determines title size
+	*/
 	titleSize: PropTypes.oneOf(["default", "large"])
 };
-
 //#endregion
-export { EditUpdateCards };
+export { EditUpdateCards };

package/es/components/EmptyStates/EmptyState.js

@@ -15,7 +15,6 @@ import { EmptyStateContent } from "./EmptyStateContent.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button } from "@carbon/react";
-
 //#region src/components/EmptyStates/EmptyState.tsx
 /**
 * Copyright IBM Corp. 2020, 2025
@@ -26,14 +25,9 @@ import { Button } from "@carbon/react";
 var import_classnames = /* @__PURE__ */ __toESM(require_classnames());
 const blockClass = `${pkg.prefix}--empty-state`;
 const componentName = "EmptyState";
-var sizes = /* @__PURE__ */ function(sizes) {
-	sizes["lg"] = "lg";
-	sizes["sm"] = "sm";
-	return sizes;
-}(sizes || {});
 const defaults = {
 	position: "top",
-	size: sizes.lg
+	size: "lg"
 };
 /**
 * The `EmptyState` component follows the Carbon guidelines for empty states with some added specifications around illustration usage. For additional usage guidelines and documentation please refer to the links above.
@@ -61,7 +55,11 @@ const EmptyState = React.forwardRef(({ v2 = false, ...props }, ref) => {
 	}));
 });
 EmptyState.propTypes = {
+	/**
+	* Empty state action button
+	*/
 	action: PropTypes.shape({
+		/**@ts-ignore*/
 		...Button.propTypes,
 		kind: PropTypes.oneOf([
 			"primary",
@@ -69,26 +67,60 @@ EmptyState.propTypes = {
 			"tertiary"
 		]),
 		renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+		/**@ts-ignore*/
 		onClick: Button.propTypes.onClick,
 		text: PropTypes.string
 	}),
+	/**
+	* Provide an optional class to be applied to the containing node.
+	*/
 	className: PropTypes.string,
+	/**
+	* Empty state headingAs allows you to customize the type of heading element
+	*/
 	headingAs: PropTypes.elementType,
+	/**
+	* Empty state illustration, specify the `src` for a provided illustration to be displayed. In the case of requiring a light and dark illustration of your own, simply pass the corresponding illustration based on the current theme of your application.
+	* For example: `illustration={appTheme === 'dark' ? darkIllustration : lightIllustration}`
+	*/
 	illustration: PropTypes.string,
+	/**
+	* The alt text for custom provided illustrations
+	*/
+	/**@ts-ignore*/
 	illustrationDescription: PropTypes.string,
+	/**
+	* Designates the position of the illustration relative to the content
+	*/
 	illustrationPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Empty state link object
+	*/
+	/**@ts-ignore*/
 	link: PropTypes.any,
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["lg", "sm"]),
+	/**
+	* Empty state subtext
+	*/
 	subtitle: PropTypes.node,
+	/**
+	* Empty state heading
+	*/
 	title: PropTypes.node.isRequired,
+	/**
+	* **Deprecated:** Designates which version of the EmptyState component is being used. Refer to V2 documentation separately.
+	* @deprecated
+	*/
 	v2: PropTypes.bool
 };
 EmptyState.displayName = componentName;
-
 //#endregion
-export { EmptyState, defaults };
+export { EmptyState, defaults };

package/es/components/EmptyStates/EmptyStateContent.js

@@ -11,7 +11,6 @@ import { pkg } from "../../settings.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button, Heading, Link, Section } from "@carbon/react";
-
 //#region src/components/EmptyStates/EmptyStateContent.tsx
 /**
 * Copyright IBM Corp. 2020, 2021
@@ -40,7 +39,11 @@ const EmptyStateContent = (props) => {
 };
 EmptyStateContent.displayName = componentName;
 EmptyStateContent.propTypes = {
+	/**
+	* Empty state action button
+	*/
 	action: PropTypes.shape({
+		/**@ts-ignore*/
 		...Button.propTypes,
 		iconDescription: PropTypes.string,
 		kind: PropTypes.oneOf([
@@ -49,15 +52,30 @@ EmptyStateContent.propTypes = {
 			"tertiary"
 		]),
 		renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+		/**@ts-ignore*/
 		onClick: Button.propTypes.onClick,
 		text: PropTypes.string
 	}),
+	/**
+	* Empty state headingAs allows you to customize the type of heading element
+	*/
 	headingAs: PropTypes.elementType,
+	/**
+	* Empty state link object
+	*/
 	link: PropTypes.any,
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["lg", "sm"]),
+	/**
+	* Empty state subtitle
+	*/
 	subtitle: PropTypes.node,
+	/**
+	* Empty state title
+	*/
 	title: PropTypes.node.isRequired
 };
-
 //#endregion
-export { EmptyStateContent };
+export { EmptyStateContent };

package/es/components/EmptyStates/EmptyStateIllustration.deprecated.js

@@ -7,7 +7,6 @@
 
 import React, { Suspense, lazy } from "react";
 import PropTypes from "prop-types";
-
 //#region src/components/EmptyStates/EmptyStateIllustration.deprecated.jsx
 /**
 * Copyright IBM Corp. 2024
@@ -40,6 +39,5 @@ const EmptyStateIllustration = ({ kind, ...rest }) => {
 	}));
 };
 EmptyStateIllustration.propTypes = { kind: PropTypes.string };
-
 //#endregion
-export { EmptyStateIllustration as default };
+export { EmptyStateIllustration as default };

package/es/components/EmptyStates/EmptyStateV2.deprecated.js

@@ -14,7 +14,6 @@ import EmptyStateIllustration from "./EmptyStateIllustration.deprecated.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button, Link } from "@carbon/react";
-
 //#region src/components/EmptyStates/EmptyStateV2.deprecated.tsx
 /**
 * Copyright IBM Corp. 2023, 2024
@@ -67,17 +66,42 @@ EmptyStateV2.deprecated = {
 	details: "For more information, please refer to the Carbon docs https://carbondesignsystem.com/patterns/empty-states-pattern/"
 };
 EmptyStateV2.propTypes = {
+	/**
+	* Props for the action button. Refer to the Carbon Components button documentation for full list of props.
+	*/
+	/**@ts-ignore*/
 	action: PropTypes.PropTypes.shape({ text: PropTypes.string }),
+	/**
+	* Provide an optional class to be applied to the containing node.
+	*/
 	className: PropTypes.string,
+	/**
+	* Source for the illustration image if you choose to use your own custom image. Passing an illustration prop will supersede the kind option.
+	*/
 	illustration: PropTypes.string,
+	/**
+	* The alt text for the illustration
+	*/
 	illustrationDescription: PropTypes.string,
+	/**
+	* Designates the position of the illustration relative to the content
+	*/
 	illustrationPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Empty state illustration theme variations.
+	* To ensure you use the correct themed illustrations, you can conditionally specify light or dark
+	* based on your app's current theme value. Example:
+	* `illustrationTheme={appTheme === ('carbon--g100' || 'carbon--g90') ? 'dark' : 'light'}`
+	*/
 	illustrationTheme: PropTypes.oneOf(["light", "dark"]),
+	/**
+	* Determines which predefined illustration will be displayed
+	*/
 	kind: PropTypes.oneOf([
 		"error",
 		"noData",
@@ -86,12 +110,24 @@ EmptyStateV2.propTypes = {
 		"notifications",
 		"unauthorized"
 	]),
+	/**
+	* Props for the link. Refer to the Carbon Components link documentation for full list of props.
+	*/
+	/**@ts-ignore*/
 	link: PropTypes.shape({ text: PropTypes.oneOfType([PropTypes.string, PropTypes.node]) }),
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["sm", "lg"]),
+	/**
+	* Empty state subtext
+	*/
 	subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+	/**
+	* Empty state heading
+	*/
 	title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
 };
 EmptyStateV2.displayName = componentName;
-
 //#endregion
-export { EmptyStateV2 };
+export { EmptyStateV2 };

package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js

@@ -15,7 +15,6 @@ import { ErrorIllustration } from "../assets/ErrorIllustration.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button } from "@carbon/react";
-
 //#region src/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.tsx
 /**
 * Copyright IBM Corp. 2020, 2024
@@ -50,7 +49,11 @@ const ErrorEmptyState = React.forwardRef(({ action, className, illustrationPosit
 });
 ErrorEmptyState.displayName = componentName;
 ErrorEmptyState.propTypes = {
+	/**
+	* Empty state action button
+	*/
 	action: PropTypes.shape({
+		/**@ts-ignore*/
 		...Button.propTypes,
 		kind: PropTypes.oneOf([
 			"primary",
@@ -58,24 +61,55 @@ ErrorEmptyState.propTypes = {
 			"tertiary"
 		]),
 		renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+		/**@ts-ignore*/
 		onClick: Button.propTypes.onClick,
 		text: PropTypes.string
 	}),
+	/**
+	* Provide an optional class to be applied to the containing node.
+	*/
 	className: PropTypes.string,
+	/**
+	* Empty state headingAs allows you to customize the type of heading element
+	*/
 	headingAs: PropTypes.elementType,
+	/**
+	* The alt text for empty state svg images. If not provided , title will be used.
+	*/
 	illustrationDescription: PropTypes.string,
+	/**
+	* Designates the position of the illustration relative to the content
+	*/
 	illustrationPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Empty state illustration theme variations.
+	* To ensure you use the correct themed illustrations, you can conditionally specify light or dark
+	* based on your app's current theme value. Example:
+	* `illustrationTheme={appTheme === ('carbon--g100' || 'carbon--g90') ? 'dark' : 'light'}`
+	*/
 	illustrationTheme: PropTypes.oneOf(["light", "dark"]),
+	/**
+	* Empty state link object
+	*/
+	/**@ts-ignore*/
 	link: PropTypes.any,
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["lg", "sm"]),
+	/**
+	* Empty state subtitle
+	*/
 	subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+	/**
+	* Empty state title
+	*/
 	title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
 };
-
 //#endregion
-export { ErrorEmptyState };
+export { ErrorEmptyState };

package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js

@@ -15,7 +15,6 @@ import { NoDataIllustration } from "../assets/NoDataIllustration.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button } from "@carbon/react";
-
 //#region src/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.tsx
 /**
 * Copyright IBM Corp. 2020, 2021
@@ -50,7 +49,11 @@ const NoDataEmptyState = React.forwardRef(({ action, className, illustrationPosi
 });
 NoDataEmptyState.displayName = componentName;
 NoDataEmptyState.propTypes = {
+	/**
+	* Empty state action button
+	*/
 	action: PropTypes.shape({
+		/**@ts-ignore */
 		...Button.propTypes,
 		kind: PropTypes.oneOf([
 			"primary",
@@ -58,24 +61,55 @@ NoDataEmptyState.propTypes = {
 			"tertiary"
 		]),
 		renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+		/**@ts-ignore */
 		onClick: Button.propTypes.onClick,
 		text: PropTypes.string
 	}),
+	/**
+	* Provide an optional class to be applied to the containing node.
+	*/
 	className: PropTypes.string,
+	/**
+	* Empty state headingAs allows you to customize the type of heading element
+	*/
 	headingAs: PropTypes.elementType,
+	/**
+	* The alt text for empty state svg images. If not provided , title will be used.
+	*/
 	illustrationDescription: PropTypes.string,
+	/**
+	* Designates the position of the illustration relative to the content
+	*/
 	illustrationPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Empty state illustration theme variations.
+	* To ensure you use the correct themed illustrations, you can conditionally specify light or dark
+	* based on your app's current theme value. Example:
+	* `illustrationTheme={appTheme === ('carbon--g100' || 'carbon--g90') ? 'dark' : 'light'}`
+	*/
 	illustrationTheme: PropTypes.oneOf(["light", "dark"]),
+	/**
+	* Empty state link object
+	*/
+	/**@ts-ignore */
 	link: PropTypes.any,
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["lg", "sm"]),
+	/**
+	* Empty state subtitle
+	*/
 	subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+	/**
+	* Empty state title
+	*/
 	title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
 };
-
 //#endregion
-export { NoDataEmptyState };
+export { NoDataEmptyState };

package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js

@@ -15,7 +15,6 @@ import { NoTagsIllustration } from "../assets/NoTagsIllustration.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button } from "@carbon/react";
-
 //#region src/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.tsx
 /**
 * Copyright IBM Corp. 2020, 2021
@@ -50,7 +49,11 @@ const NoTagsEmptyState = React.forwardRef(({ action, className, illustrationPosi
 });
 NoTagsEmptyState.displayName = componentName;
 NoTagsEmptyState.propTypes = {
+	/**
+	* Empty state action button
+	*/
 	action: PropTypes.shape({
+		/**@ts-ignore*/
 		...Button.propTypes,
 		kind: PropTypes.oneOf([
 			"primary",
@@ -58,24 +61,55 @@ NoTagsEmptyState.propTypes = {
 			"tertiary"
 		]),
 		renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+		/**@ts-ignore*/
 		onClick: Button.propTypes.onClick,
 		text: PropTypes.string
 	}),
+	/**
+	* Provide an optional class to be applied to the containing node.
+	*/
 	className: PropTypes.string,
+	/**
+	* Empty state headingAs allows you to customize the type of heading element
+	*/
 	headingAs: PropTypes.elementType,
+	/**
+	* The alt text for empty state svg images. If not provided , title will be used.
+	*/
 	illustrationDescription: PropTypes.string,
+	/**
+	* Designates the position of the illustration relative to the content
+	*/
 	illustrationPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Empty state illustration theme variations.
+	* To ensure you use the correct themed illustrations, you can conditionally specify light or dark
+	* based on your app's current theme value. Example:
+	* `illustrationTheme={appTheme === ('carbon--g100' || 'carbon--g90') ? 'dark' : 'light'}`
+	*/
 	illustrationTheme: PropTypes.oneOf(["light", "dark"]),
+	/**
+	* Empty state link object
+	*/
+	/**@ts-ignore*/
 	link: PropTypes.any,
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["lg", "sm"]),
+	/**
+	* Empty state subtitle
+	*/
 	subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+	/**
+	* Empty state title
+	*/
 	title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
 };
-
 //#endregion
-export { NoTagsEmptyState };
+export { NoTagsEmptyState };

package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js

@@ -15,7 +15,6 @@ import { NotFoundIllustration } from "../assets/NotFoundIllustration.js";
 import React from "react";
 import PropTypes from "prop-types";
 import { Button } from "@carbon/react";
-
 //#region src/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.tsx
 /**
 * Copyright IBM Corp. 2020, 2024
@@ -50,7 +49,11 @@ const NotFoundEmptyState = React.forwardRef(({ action, className, illustrationPo
 });
 NotFoundEmptyState.displayName = componentName;
 NotFoundEmptyState.propTypes = {
+	/**
+	* Empty state action button
+	*/
 	action: PropTypes.shape({
+		/**@ts-ignore*/
 		...Button.propTypes,
 		kind: PropTypes.oneOf([
 			"primary",
@@ -58,24 +61,55 @@ NotFoundEmptyState.propTypes = {
 			"tertiary"
 		]),
 		renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+		/**@ts-ignore*/
 		onClick: Button.propTypes.onClick,
 		text: PropTypes.string
 	}),
+	/**
+	* Provide an optional class to be applied to the containing node.
+	*/
 	className: PropTypes.string,
+	/**
+	* Empty state headingAs allows you to customize the type of heading element
+	*/
 	headingAs: PropTypes.elementType,
+	/**
+	* The alt text for empty state svg images. If not provided , title will be used.
+	*/
 	illustrationDescription: PropTypes.string,
+	/**
+	* Designates the position of the illustration relative to the content
+	*/
 	illustrationPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Empty state illustration theme variations.
+	* To ensure you use the correct themed illustrations, you can conditionally specify light or dark
+	* based on your app's current theme value. Example:
+	* `illustrationTheme={appTheme === ('carbon--g100' || 'carbon--g90') ? 'dark' : 'light'}`
+	*/
 	illustrationTheme: PropTypes.oneOf(["light", "dark"]),
+	/**
+	* Empty state link object
+	*/
+	/**@ts-ignore*/
 	link: PropTypes.any,
+	/**
+	* Empty state size
+	*/
 	size: PropTypes.oneOf(["lg", "sm"]),
+	/**
+	* Empty state subtitle
+	*/
 	subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
+	/**
+	* Empty state title
+	*/
 	title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
 };
-
 //#endregion
-export { NotFoundEmptyState };
+export { NotFoundEmptyState };