@carbon/react 1.110.0-rc.0 → 1.111.0-rc.0

package/es/components/TextArea/TextArea.js

@@ -297,30 +297,110 @@ const TextArea = forwardRef((props, forwardRef) => {
 });
 TextArea.displayName = "TextArea";
 TextArea.propTypes = {
+	/**
+	* Provide a custom className that is applied to the wrapper node
+	*/
 	className: PropTypes.string,
+	/**
+	* Specify the `cols` attribute for the underlying `<textarea>` node
+	*/
 	cols: PropTypes.number,
+	/**
+	* Specify the method used for calculating the counter number
+	*/
 	counterMode: PropTypes.oneOf(["character", "word"]),
+	/**
+	* **Experimental**: Provide a `decorator` component to be rendered inside the `TextArea` component
+	*/
 	decorator: PropTypes.node,
+	/**
+	* Optionally provide the default value of the `<textarea>`
+	*/
 	defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the control is disabled
+	*/
 	disabled: PropTypes.bool,
+	/**
+	* Specify whether to display the counter
+	*/
 	enableCounter: PropTypes.bool,
+	/**
+	* Provide text that is used alongside the control label for additional help
+	*/
 	helperText: PropTypes.node,
+	/**
+	* Specify whether you want the underlying label to be visually hidden
+	*/
 	hideLabel: PropTypes.bool,
+	/**
+	* Provide a unique identifier for the control
+	*/
 	id: PropTypes.string,
+	/**
+	* Specify whether the control is currently invalid
+	*/
 	invalid: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in an invalid state
+	*/
 	invalidText: PropTypes.node,
+	/**
+	* Provide the text that will be read by a screen reader when visiting this
+	* control
+	*/
 	labelText: PropTypes.node.isRequired,
+	/**
+	* `true` to use the light version. For use on $ui-01 backgrounds only.
+	* Don't use this to make tile background color same as container background color.
+	*/
 	light: deprecate(PropTypes.bool, "The `light` prop for `TextArea` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
+	/**
+	* Max entity count allowed for the textarea. This is needed in order for enableCounter to display
+	*/
 	maxCount: PropTypes.number,
+	/**
+	* Optionally provide an `onChange` handler that is called whenever `<textarea>`
+	* is updated
+	*/
 	onChange: PropTypes.func,
+	/**
+	* Optionally provide an `onClick` handler that is called whenever the
+	* `<textarea>` is clicked
+	*/
 	onClick: PropTypes.func,
+	/**
+	* Optionally provide an `onKeyDown` handler that is called whenever `<textarea>`
+	* is keyed
+	*/
 	onKeyDown: PropTypes.func,
+	/**
+	* Specify the placeholder attribute for the `<textarea>`
+	*/
 	placeholder: PropTypes.string,
+	/**
+	* Whether the textarea should be read-only
+	*/
 	readOnly: PropTypes.bool,
+	/**
+	* Specify the rows attribute for the `<textarea>`
+	*/
 	rows: PropTypes.number,
+	/**
+	* **Experimental**: Provide a `Slug` component to be rendered inside the `TextArea` component
+	*/
 	slug: deprecate(PropTypes.node, "The `slug` prop for `TextArea` has been deprecated in favor of the new `decorator` prop. It will be removed in the next major release."),
+	/**
+	* Provide the current value of the `<textarea>`
+	*/
 	value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the control is currently in warning state
+	*/
 	warn: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in warning state
+	*/
 	warnText: PropTypes.node
 };
 //#endregion

package/es/components/TextInput/ControlledPasswordInput.js

@@ -106,37 +106,101 @@ const ControlledPasswordInput = forwardRef(({ labelText, className, id, placehol
 });
 ControlledPasswordInput.displayName = "ControlledPasswordInput";
 ControlledPasswordInput.propTypes = {
+	/**
+	* Provide a custom className that is applied directly to the underlying
+	* `<input>` node
+	*/
 	className: PropTypes.string,
+	/**
+	* Optionally provide the default value of the `<input>`
+	*/
 	defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the control is disabled
+	*/
 	disabled: PropTypes.bool,
+	/**
+	* Provide text that is used alongside the control label for additional help
+	*/
 	helperText: PropTypes.node,
+	/**
+	* Specify whether or not the underlying label is visually hidden
+	*/
 	hideLabel: PropTypes.bool,
+	/**
+	* "Hide password" tooltip text on password visibility toggle
+	*/
 	hidePasswordLabel: PropTypes.string,
+	/**
+	* Provide a unique identifier for the input field
+	*/
 	id: PropTypes.string.isRequired,
+	/**
+	* Specify whether the control is currently invalid
+	*/
 	invalid: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in an invalid state
+	*/
 	invalidText: PropTypes.node,
+	/**
+	* Provide the text that will be read by a screen reader when visiting this
+	* control
+	*/
 	labelText: PropTypes.node.isRequired,
+	/**
+	* `true` to use the light version. For use on $ui-01 backgrounds only.
+	* Don't use this to make tile background color same as container background color.
+	*/
 	light: deprecate(PropTypes.bool, "The `light` prop for `ControlledPasswordInput` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
+	/**
+	* Optionally provide an `onChange` handler that is called whenever `<input>`
+	* is updated
+	*/
 	onChange: PropTypes.func,
+	/**
+	* Optionally provide an `onClick` handler that is called whenever the
+	* `<input>` is clicked
+	*/
 	onClick: PropTypes.func,
+	/**
+	* Specify the placeholder attribute for the `<input>`
+	*/
 	placeholder: PropTypes.string,
+	/**
+	* "Show password" tooltip text on password visibility toggle
+	*/
 	showPasswordLabel: PropTypes.string,
+	/**
+	* Specify the size of the Text Input.
+	*/
 	size: PropTypes.oneOf([
 		"sm",
 		"md",
 		"lg"
 	]),
+	/**
+	* Specify the alignment of the tooltip to the icon-only button.
+	* Can be one of: start, center, or end.
+	*/
 	tooltipAlignment: PropTypes.oneOf([
 		"start",
 		"center",
 		"end"
 	]),
+	/**
+	* Specify the direction of the tooltip for icon-only buttons.
+	* Can be either top, right, bottom, or left.
+	*/
 	tooltipPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* Provide the current value of the `<input>`
+	*/
 	value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
 };
 //#endregion

package/es/components/TextInput/PasswordInput.js

@@ -173,44 +173,127 @@ const PasswordInput = forwardRef(({ className, disabled = false, helperText, hid
 });
 PasswordInput.displayName = "PasswordInput";
 PasswordInput.propTypes = {
+	/**
+	* Provide a custom className that is applied directly to the underlying
+	* `<input>` node
+	*/
 	className: PropTypes.string,
+	/**
+	* Optionally provide the default value of the `<input>`
+	*/
 	defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the control is disabled
+	*/
 	disabled: PropTypes.bool,
+	/**
+	* Provide text that is used alongside the control label for additional help
+	*/
 	helperText: PropTypes.node,
+	/**
+	* Specify whether or not the underlying label is visually hidden
+	*/
 	hideLabel: PropTypes.bool,
+	/**
+	* "Hide password" tooltip text on password visibility toggle
+	*/
 	hidePasswordLabel: PropTypes.string,
+	/**
+	* Provide a unique identifier for the input field
+	*/
 	id: PropTypes.string.isRequired,
+	/**
+	* `true` to use the inline version.
+	*/
 	inline: PropTypes.bool,
+	/**
+	* Specify whether the control is currently invalid
+	*/
 	invalid: PropTypes.bool,
+	/**
+	* Whether the PasswordInput should be read-only
+	*/
 	readOnly: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in an invalid state
+	*/
 	invalidText: PropTypes.node,
+	/**
+	* Provide the text that will be read by a screen reader when visiting this
+	* control
+	*/
 	labelText: PropTypes.node.isRequired,
+	/**
+	* `true` to use the light version. For use on $ui-01 backgrounds only.
+	* Don't use this to make tile background color same as container background color.
+	*/
 	light: deprecate(PropTypes.bool, "The `light` prop for `PasswordInput` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
+	/**
+	* Optionally provide an `onChange` handler that is called whenever `<input>`
+	* is updated
+	*/
 	onChange: PropTypes.func,
+	/**
+	* Optionally provide an `onClick` handler that is called whenever the
+	* `<input>` is clicked
+	*/
 	onClick: PropTypes.func,
+	/**
+	* Callback function that is called whenever the toggle password visibility
+	* button is clicked
+	*/
 	onTogglePasswordVisibility: PropTypes.func,
+	/**
+	* Specify the placeholder attribute for the `<input>`
+	*/
 	placeholder: PropTypes.string,
+	/**
+	* "Show password" tooltip text on password visibility toggle
+	*/
 	showPasswordLabel: PropTypes.string,
+	/**
+	* Specify the size of the Text Input. Supports `xs`, `sm`, `md`, or `lg`.
+	*/
 	size: PropTypes.oneOf([
 		"xs",
 		"sm",
 		"md",
 		"lg"
 	]),
+	/**
+	* Specify the alignment of the tooltip to the icon-only button.
+	* Can be one of: start, center, or end.
+	*/
 	tooltipAlignment: PropTypes.oneOf([
 		"start",
 		"center",
 		"end"
 	]),
+	/**
+	* Specify the direction of the tooltip for icon-only buttons.
+	* Can be either top, right, bottom, or left.
+	*/
 	tooltipPosition: PropTypes.oneOf([
 		"top",
 		"right",
 		"bottom",
 		"left"
 	]),
+	/**
+	* The input type, either password or text
+	*/
 	type: PropTypes.oneOf(["password", "text"]),
+	/**
+	* Provide the current value of the `<input>`
+	*/
 	value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the control is currently in warning state
+	*/
 	warn: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in warning state
+	*/
 	warnText: PropTypes.node
 };
 //#endregion

package/es/components/TextInput/TextInput.Skeleton.js

@@ -26,8 +26,17 @@ const TextInputSkeleton = ({ hideLabel, className, size, ...rest }) => {
 	});
 };
 TextInputSkeleton.propTypes = {
+	/**
+	* Specify an optional className to add to the form item wrapper.
+	*/
 	className: PropTypes.string,
+	/**
+	* Specify whether the label should be hidden, or not
+	*/
 	hideLabel: PropTypes.bool,
+	/**
+	* Specify the size of the TextInputSkeleton
+	*/
 	size: PropTypes.oneOf([
 		"xs",
 		"sm",

package/es/components/TextInput/TextInput.js

@@ -203,34 +203,110 @@ const TextInput = forwardRef(({ className, decorator, disabled = false, helperTe
 });
 TextInput.displayName = "TextInput";
 TextInput.propTypes = {
+	/**
+	* Specify an optional className to be applied to the `<input>` node
+	*/
 	className: PropTypes.string,
+	/**
+	* **Experimental**: Provide a `decorator` component to be rendered inside the `TextInput` component
+	*/
 	decorator: PropTypes.node,
+	/**
+	* Optionally provide the default value of the `<input>`
+	*/
 	defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the `<input>` should be disabled
+	*/
 	disabled: PropTypes.bool,
+	/**
+	* Specify whether to display the character counter
+	*/
 	enableCounter: PropTypes.bool,
+	/**
+	* Provide text that is used alongside the control label for additional help
+	*/
 	helperText: PropTypes.node,
+	/**
+	* Specify whether you want the underlying label to be visually hidden
+	*/
 	hideLabel: PropTypes.bool,
+	/**
+	* Specify a custom `id` for the `<input>`
+	*/
 	id: PropTypes.string.isRequired,
+	/**
+	* `true` to use the inline version.
+	*/
 	inline: PropTypes.bool,
+	/**
+	* Specify whether the control is currently invalid
+	*/
 	invalid: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in an invalid state
+	*/
 	invalidText: PropTypes.node,
+	/**
+	* Provide the text that will be read by a screen reader when visiting this
+	* control
+	*/
 	labelText: PropTypes.node.isRequired,
+	/**
+	* `true` to use the light version. For use on $ui-01 backgrounds only.
+	* Don't use this to make tile background color same as container background color.
+	*/
 	light: deprecate(PropTypes.bool, "The `light` prop for `TextInput` has been deprecated in favor of the new `Layer` component. It will be removed in the next major release."),
+	/**
+	* Max character count allowed for the input. This is needed in order for enableCounter to display
+	*/
 	maxCount: PropTypes.number,
+	/**
+	* Optionally provide an `onChange` handler that is called whenever `<input>`
+	* is updated
+	*/
 	onChange: PropTypes.func,
+	/**
+	* Optionally provide an `onClick` handler that is called whenever the
+	* `<input>` is clicked
+	*/
 	onClick: PropTypes.func,
+	/**
+	* Specify the placeholder attribute for the `<input>`
+	*/
 	placeholder: PropTypes.string,
+	/**
+	* Whether the input should be read-only
+	*/
 	readOnly: PropTypes.bool,
+	/**
+	* Specify the size of the Text Input. Currently supports the following:
+	*/
 	size: PropTypes.oneOf([
 		"xs",
 		"sm",
 		"md",
 		"lg"
 	]),
+	/**
+	* **Experimental**: Provide a `Slug` component to be rendered inside the `TextInput` component
+	*/
 	slug: deprecate(PropTypes.node, "The `slug` prop for `TextInput` has been deprecated in favor of the new `decorator` prop. It will be removed in the next major release."),
+	/**
+	* Specify the type of the `<input>`
+	*/
 	type: PropTypes.string,
+	/**
+	* Specify the value of the `<input>`
+	*/
 	value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+	/**
+	* Specify whether the control is currently in warning state
+	*/
 	warn: PropTypes.bool,
+	/**
+	* Provide the text that is displayed when the control is in warning state
+	*/
 	warnText: PropTypes.node
 };
 //#endregion

package/es/components/Theme/index.js

@@ -31,7 +31,14 @@ const GlobalTheme = React.forwardRef(({ children, theme }, ref) => {
 	});
 });
 GlobalTheme.propTypes = {
+	/**
+	* Provide child elements to be rendered inside of `GlobalTheme`, this is
+	* typically the root of your app
+	*/
 	children: PropTypes.node,
+	/**
+	* Specify the global theme for your app
+	*/
 	theme: PropTypes.oneOf([
 		"white",
 		"g10",
@@ -70,13 +77,27 @@ function Theme({ as: BaseComponent = "div", className: customClassName, theme, .
 	});
 }
 Theme.propTypes = {
+	/**
+	* Specify a custom component or element to be rendered as the top-level
+	* element in the component
+	*/
 	as: PropTypes.oneOfType([
 		PropTypes.func,
 		PropTypes.string,
 		PropTypes.elementType
 	]),
+	/**
+	* Provide child elements to be rendered inside of `Theme`
+	*/
 	children: PropTypes.node,
+	/**
+	* Provide a custom class name to be used on the outermost element rendered by
+	* the component
+	*/
 	className: PropTypes.string,
+	/**
+	* Specify the theme
+	*/
 	theme: PropTypes.oneOf([
 		"white",
 		"g10",