@carbon/react 1.103.0 → 1.104.0-rc.0

package/es/components/FormGroup/FormGroup.js

@@ -1,78 +1,56 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import PropTypes from 'prop-types';
-import React from 'react';
-import cx from 'classnames';
-import { usePrefix } from '../../internal/usePrefix.js';
+import { usePrefix } from "../../internal/usePrefix.js";
+import classNames from "classnames";
+import React from "react";
+import PropTypes from "prop-types";
+import { jsx, jsxs } from "react/jsx-runtime";
 
-const FormGroup = ({
-  disabled = false,
-  legendId,
-  legendText,
-  invalid = false,
-  children,
-  className,
-  message = false,
-  messageText = '',
-  ...rest
-}) => {
-  const prefix = usePrefix();
-  const classNamesFieldset = cx(`${prefix}--fieldset`, className);
-  return /*#__PURE__*/React.createElement("fieldset", _extends({
-    disabled: disabled
-  }, invalid && {
-    'data-invalid': ''
-  }, {
-    className: classNamesFieldset
-  }, rest, {
-    "aria-labelledby": rest['aria-labelledby'] || legendId
-  }), /*#__PURE__*/React.createElement("legend", {
-    className: `${prefix}--label`,
-    id: legendId || rest['aria-labelledby']
-  }, legendText), children, message ? /*#__PURE__*/React.createElement("div", {
-    className: `${prefix}--form__requirements`
-  }, messageText) : null);
+//#region src/components/FormGroup/FormGroup.tsx
+/**
+* Copyright IBM Corp. 2016, 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.
+*/
+const FormGroup = ({ disabled = false, legendId, legendText, invalid = false, children, className, message = false, messageText = "", ...rest }) => {
+	const prefix = usePrefix();
+	const classNamesFieldset = classNames(`${prefix}--fieldset`, className);
+	return /* @__PURE__ */ jsxs("fieldset", {
+		disabled,
+		...invalid && { "data-invalid": "" },
+		className: classNamesFieldset,
+		...rest,
+		"aria-labelledby": rest["aria-labelledby"] || legendId,
+		children: [
+			/* @__PURE__ */ jsx("legend", {
+				className: `${prefix}--label`,
+				id: legendId || rest["aria-labelledby"],
+				children: legendText
+			}),
+			children,
+			message ? /* @__PURE__ */ jsx("div", {
+				className: `${prefix}--form__requirements`,
+				children: messageText
+			}) : null
+		]
+	});
 };
 FormGroup.propTypes = {
-  /**
-   * Provide the children form elements to be rendered inside of the <fieldset>
-   */
-  children: PropTypes.node,
-  /**
-   * Provide a custom className to be applied to the containing <fieldset> node
-   */
-  className: PropTypes.string,
-  /**
-   * Specify whether the FormGroup should be disabled
-   */
-  disabled: PropTypes.bool,
-  /**
-   * Specify whether the <FormGroup> is invalid
-   */
-  invalid: PropTypes.bool,
-  /**
-   * Provide id for the fieldset <legend> which corresponds to the fieldset
-   * `aria-labelledby`
-   */
-  legendId: PropTypes.node,
-  /**
-   * Provide the text to be rendered inside of the fieldset <legend>
-   */
-  legendText: PropTypes.node.isRequired,
-  /**
-   * Specify whether the message should be displayed in the <FormGroup>
-   */
-  message: PropTypes.bool,
-  /**
-   * Provide the text for the message in the <FormGroup>
-   */
-  messageText: PropTypes.string
+	children: PropTypes.node,
+	className: PropTypes.string,
+	disabled: PropTypes.bool,
+	invalid: PropTypes.bool,
+	legendId: PropTypes.node,
+	legendText: PropTypes.node.isRequired,
+	message: PropTypes.bool,
+	messageText: PropTypes.string
 };
 
-export { FormGroup as default };
+//#endregion
+export { FormGroup as default };

package/es/components/FormItem/FormItem.js

@@ -1,36 +1,34 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import PropTypes from 'prop-types';
-import React from 'react';
-import cx from 'classnames';
-import { usePrefix } from '../../internal/usePrefix.js';
+import { usePrefix } from "../../internal/usePrefix.js";
+import classNames from "classnames";
+import React from "react";
+import PropTypes from "prop-types";
+import { jsx } from "react/jsx-runtime";
 
-function FormItem({
-  className,
-  children,
-  ...rest
-}) {
-  const prefix = usePrefix();
-  const classNames = cx(`${prefix}--form-item`, className);
-  return /*#__PURE__*/React.createElement("div", _extends({
-    className: classNames
-  }, rest), children);
+//#region src/components/FormItem/FormItem.tsx
+/**
+* Copyright IBM Corp. 2016, 2023
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+function FormItem({ className, children, ...rest }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: classNames(`${usePrefix()}--form-item`, className),
+		...rest,
+		children
+	});
 }
 FormItem.propTypes = {
-  /**
-   * Provide content to be rendered in the form item
-   */
-  children: PropTypes.node,
-  /**
-   * Provide a custom className to be applied to the containing node
-   */
-  className: PropTypes.string
+	children: PropTypes.node,
+	className: PropTypes.string
 };
 
-export { FormItem as default };
+//#endregion
+export { FormItem as default };

package/es/components/FormLabel/FormLabel.js

@@ -1,45 +1,39 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import PropTypes from 'prop-types';
-import React from 'react';
-import cx from 'classnames';
-import { usePrefix } from '../../internal/usePrefix.js';
-import { Text } from '../Text/Text.js';
-import '../Text/TextDirection.js';
+import { usePrefix } from "../../internal/usePrefix.js";
+import { Text } from "../Text/Text.js";
+import classNames from "classnames";
+import React from "react";
+import PropTypes from "prop-types";
+import { jsx } from "react/jsx-runtime";
 
-function FormLabel({
-  className: customClassName,
-  children,
-  id,
-  ...rest
-}) {
-  const prefix = usePrefix();
-  const className = cx(`${prefix}--label`, `${prefix}--label--no-margin`, customClassName);
-  return /*#__PURE__*/React.createElement(Text, _extends({
-    as: "label",
-    htmlFor: id,
-    className: className
-  }, rest), children);
+//#region src/components/FormLabel/FormLabel.tsx
+/**
+* Copyright IBM Corp. 2016, 2023
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+function FormLabel({ className: customClassName, children, id, ...rest }) {
+	const prefix = usePrefix();
+	return /* @__PURE__ */ jsx(Text, {
+		as: "label",
+		htmlFor: id,
+		className: classNames(`${prefix}--label`, `${prefix}--label--no-margin`, customClassName),
+		...rest,
+		children
+	});
 }
 FormLabel.propTypes = {
-  /**
-   * Specify the content of the form label
-   */
-  children: PropTypes.node,
-  /**
-   * Provide a custom className to be applied to the containing <label> node
-   */
-  className: PropTypes.string,
-  /**
-   * Provide a unique id for the given <FormLabel>
-   */
-  id: PropTypes.string
+	children: PropTypes.node,
+	className: PropTypes.string,
+	id: PropTypes.string
 };
 
-export { FormLabel as default };
+//#endregion
+export { FormLabel as default };

package/es/components/Grid/CSSGrid.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/es/components/Grid/CSSGrid.js

@@ -1,142 +1,100 @@
 /**
- * Copyright IBM Corp. 2016, 2023
+ * Copyright IBM Corp. 2016, 2026
  *
  * 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 { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import cx from 'classnames';
-import PropTypes from 'prop-types';
-import React from 'react';
-import { usePrefix } from '../../internal/usePrefix.js';
-import { useGridSettings, GridSettings } from './GridContext.js';
+import { usePrefix } from "../../internal/usePrefix.js";
+import { GridSettings, useGridSettings } from "./GridContext.js";
+import classNames from "classnames";
+import React from "react";
+import PropTypes from "prop-types";
+import { jsx } from "react/jsx-runtime";
 
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
-const CSSGrid = /*#__PURE__*/React.forwardRef(({
-  align,
-  as,
-  children,
-  className: customClassName,
-  condensed = false,
-  fullWidth = false,
-  narrow = false,
-  ...rest
-}, ref) => {
-  const prefix = usePrefix();
-  const {
-    subgrid
-  } = useGridSettings();
-  let mode = 'wide';
-  if (narrow) {
-    mode = 'narrow';
-  } else if (condensed) {
-    mode = 'condensed';
-  }
-  if (subgrid) {
-    return /*#__PURE__*/React.createElement(GridSettings, {
-      mode: "css-grid",
-      subgrid: true
-    }, /*#__PURE__*/React.createElement(Subgrid, _extends({
-      ref: ref,
-      as: as,
-      className: customClassName,
-      mode: mode
-    }, rest), children));
-  }
-  const className = cx(customClassName, {
-    [`${prefix}--css-grid`]: true,
-    [`${prefix}--css-grid--condensed`]: mode === 'condensed',
-    [`${prefix}--css-grid--narrow`]: mode === 'narrow',
-    [`${prefix}--css-grid--full-width`]: fullWidth,
-    [`${prefix}--css-grid--start`]: align === 'start',
-    [`${prefix}--css-grid--end`]: align === 'end'
-  });
-
-  // cast as any to let TypeScript allow passing in attributes to base component
-  const BaseComponent = as || 'div';
-  return /*#__PURE__*/React.createElement(GridSettings, {
-    mode: "css-grid",
-    subgrid: true
-  }, /*#__PURE__*/React.createElement(BaseComponent, _extends({
-    className: className,
-    ref: ref
-  }, rest), children));
+//#region src/components/Grid/CSSGrid.tsx
+/**
+* Copyright IBM Corp. 2016, 2026
+*
+* This source code is licensed under the Apache-2.0 license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+const CSSGrid = React.forwardRef(({ align, as, children, className: customClassName, condensed = false, fullWidth = false, narrow = false, ...rest }, ref) => {
+	const prefix = usePrefix();
+	const { subgrid } = useGridSettings();
+	let mode = "wide";
+	if (narrow) mode = "narrow";
+	else if (condensed) mode = "condensed";
+	if (subgrid) return /* @__PURE__ */ jsx(GridSettings, {
+		mode: "css-grid",
+		subgrid: true,
+		children: /* @__PURE__ */ jsx(Subgrid, {
+			ref,
+			as,
+			className: customClassName,
+			mode,
+			...rest,
+			children
+		})
+	});
+	const className = classNames(customClassName, {
+		[`${prefix}--css-grid`]: true,
+		[`${prefix}--css-grid--condensed`]: mode === "condensed",
+		[`${prefix}--css-grid--narrow`]: mode === "narrow",
+		[`${prefix}--css-grid--full-width`]: fullWidth,
+		[`${prefix}--css-grid--start`]: align === "start",
+		[`${prefix}--css-grid--end`]: align === "end"
+	});
+	return /* @__PURE__ */ jsx(GridSettings, {
+		mode: "css-grid",
+		subgrid: true,
+		children: /* @__PURE__ */ jsx(as || "div", {
+			className,
+			ref,
+			...rest,
+			children
+		})
+	});
 });
 CSSGrid.propTypes = {
-  /**
-   * Provide a custom element to render instead of the default <div>
-   */
-  as: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType]),
-  /**
-   * Specify grid alignment. Default is center
-   */
-  align: PropTypes.oneOf(['start', 'center', 'end']),
-  /**
-   * Pass in content that will be rendered within the `Grid`
-   */
-  children: PropTypes.node,
-  /**
-   * Specify a custom className to be applied to the `Grid`
-   */
-  className: PropTypes.string,
-  /**
-   * Collapse the gutter to 1px. Useful for fluid layouts.
-   * Rows have 1px of margin between them to match gutter.
-   */
-  condensed: PropTypes.bool,
-  /**
-   * Remove the default max width that the grid has set
-   */
-  fullWidth: PropTypes.bool,
-  /**
-   * Container hangs 16px into the gutter. Useful for
-   * typographic alignment with and without containers.
-   */
-  narrow: PropTypes.bool
+	as: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType]),
+	align: PropTypes.oneOf([
+		"start",
+		"center",
+		"end"
+	]),
+	children: PropTypes.node,
+	className: PropTypes.string,
+	condensed: PropTypes.bool,
+	fullWidth: PropTypes.bool,
+	narrow: PropTypes.bool
 };
-
-// eslint-disable-next-line @typescript-eslint/no-unused-vars -- https://github.com/carbon-design-system/carbon/issues/20452
-
-// eslint-disable-next-line react/display-name -- https://github.com/carbon-design-system/carbon/issues/20452
-const Subgrid = /*#__PURE__*/React.forwardRef(({
-  as,
-  className: customClassName,
-  children,
-  mode,
-  ...rest
-}, ref) => {
-  const prefix = usePrefix();
-  const className = cx(customClassName, {
-    [`${prefix}--subgrid`]: true,
-    [`${prefix}--subgrid--condensed`]: mode === 'condensed',
-    [`${prefix}--subgrid--narrow`]: mode === 'narrow',
-    [`${prefix}--subgrid--wide`]: mode === 'wide'
-  });
-  const BaseComponent = as || 'div';
-  return /*#__PURE__*/React.createElement(BaseComponent, _extends({}, rest, {
-    ref: ref,
-    className: className
-  }), children);
+const Subgrid = React.forwardRef(({ as, className: customClassName, children, mode, ...rest }, ref) => {
+	const prefix = usePrefix();
+	const className = classNames(customClassName, {
+		[`${prefix}--subgrid`]: true,
+		[`${prefix}--subgrid--condensed`]: mode === "condensed",
+		[`${prefix}--subgrid--narrow`]: mode === "narrow",
+		[`${prefix}--subgrid--wide`]: mode === "wide"
+	});
+	return /* @__PURE__ */ jsx(as || "div", {
+		...rest,
+		ref,
+		className,
+		children
+	});
 });
 Subgrid.propTypes = {
-  /**
-   * Provide a custom element to render instead of the default <div>
-   */
-  as: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType]),
-  /**
-   * Pass in content that will be rendered within the `Subgrid`
-   */
-  children: PropTypes.node,
-  /**
-   * Specify a custom className to be applied to the `Subgrid`
-   */
-  className: PropTypes.string,
-  /**
-   * Specify the gutter mode for the subgrid
-   */
-  mode: PropTypes.oneOf(['wide', 'narrow', 'condensed'])
+	as: PropTypes.oneOfType([PropTypes.string, PropTypes.elementType]),
+	children: PropTypes.node,
+	className: PropTypes.string,
+	mode: PropTypes.oneOf([
+		"wide",
+		"narrow",
+		"condensed"
+	])
 };
 const CSSGridComponent = CSSGrid;
 
-export { CSSGridComponent as CSSGrid };
+//#endregion
+export { CSSGridComponent };