@carbon/react 1.103.0-rc.0 → 1.104.0-rc.0

package/lib/components/StructuredList/StructuredList.js

@@ -1,356 +1,219 @@
 /**
- * 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.
  */
 
-'use strict';
+const require_runtime = require('../../_virtual/_rolldown/runtime.js');
+const require_usePrefix = require('../../internal/usePrefix.js');
+const require_Text = require('../Text/Text.js');
+const require_useId = require('../../internal/useId.js');
+const require_deprecate = require('../../prop-types/deprecate.js');
+const require_useOutsideClick = require('../../internal/useOutsideClick.js');
+let classnames = require("classnames");
+classnames = require_runtime.__toESM(classnames);
+let react = require("react");
+react = require_runtime.__toESM(react);
+let prop_types = require("prop-types");
+prop_types = require_runtime.__toESM(prop_types);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _carbon_icons_react = require("@carbon/icons-react");
 
-var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
-var React = require('react');
-var PropTypes = require('prop-types');
-var cx = require('classnames');
-var useId = require('../../internal/useId.js');
-var deprecate = require('../../prop-types/deprecate.js');
-var usePrefix = require('../../internal/usePrefix.js');
-var Text = require('../Text/Text.js');
-require('../Text/TextDirection.js');
-var iconsReact = require('@carbon/icons-react');
-var useOutsideClick = require('../../internal/useOutsideClick.js');
-
-var _StructuredListCell;
-const GridSelectedRowStateContext = /*#__PURE__*/React.createContext(null);
-const GridSelectedRowDispatchContext = /*#__PURE__*/React.createContext(null);
+//#region src/components/StructuredList/StructuredList.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 GridSelectedRowStateContext = react.default.createContext(null);
+const GridSelectedRowDispatchContext = react.default.createContext(null);
 function StructuredListWrapper(props) {
-  const {
-    children,
-    selection,
-    className,
-    ['aria-label']: ariaLabel = 'Structured list section',
-    // @ts-expect-error: Deprecated prop
-    ariaLabel: deprecatedAriaLabel,
-    isCondensed,
-    isFlush,
-    selectedInitialRow,
-    ...other
-  } = props;
-  const prefix = usePrefix.usePrefix();
-  const classes = cx(`${prefix}--structured-list`, {
-    [`${prefix}--structured-list--selection`]: selection,
-    [`${prefix}--structured-list--condensed`]: isCondensed,
-    [`${prefix}--structured-list--flush`]: isFlush && !selection
-  }, className);
-  const [selectedRow, setSelectedRow] = React.useState(selectedInitialRow ?? null);
-  return /*#__PURE__*/React.createElement(GridSelectedRowStateContext.Provider, {
-    value: selectedRow
-  }, /*#__PURE__*/React.createElement(GridSelectedRowDispatchContext.Provider, {
-    value: setSelectedRow
-  }, /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
-    role: "table",
-    className: classes
-  }, other, {
-    "aria-label": deprecatedAriaLabel || ariaLabel
-  }), children)));
+	const { children, selection, className, ["aria-label"]: ariaLabel = "Structured list section", ariaLabel: deprecatedAriaLabel, isCondensed, isFlush, selectedInitialRow, ...other } = props;
+	const prefix = require_usePrefix.usePrefix();
+	const classes = (0, classnames.default)(`${prefix}--structured-list`, {
+		[`${prefix}--structured-list--selection`]: selection,
+		[`${prefix}--structured-list--condensed`]: isCondensed,
+		[`${prefix}--structured-list--flush`]: isFlush && !selection
+	}, className);
+	const [selectedRow, setSelectedRow] = react.default.useState(selectedInitialRow ?? null);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GridSelectedRowStateContext.Provider, {
+		value: selectedRow,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(GridSelectedRowDispatchContext.Provider, {
+			value: setSelectedRow,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				role: "table",
+				className: classes,
+				...other,
+				"aria-label": deprecatedAriaLabel || ariaLabel,
+				children
+			})
+		})
+	});
 }
 StructuredListWrapper.propTypes = {
-  /**
-   * Specify a label to be read by screen readers on the container node
-   */
-  ['aria-label']: PropTypes.string,
-  /**
-   * Deprecated, please use `aria-label` instead.
-   * Specify a label to be read by screen readers on the container note.
-   */
-  ariaLabel: deprecate.deprecate(PropTypes.string, 'This prop syntax has been deprecated. Please use the new `aria-label`.'),
-  /**
-   * Provide the contents of your StructuredListWrapper
-   */
-  children: PropTypes.node,
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-  /**
-   * Specify if structured list is condensed, default is false
-   */
-  isCondensed: PropTypes.bool,
-  /**
-   * Specify if structured list is flush, not valid for selection variant, default is false
-   */
-  isFlush: PropTypes.bool,
-  /**
-   * Specify whether your StructuredListWrapper should have selections
-   */
-  selection: PropTypes.bool,
-  /**
-   * Specify which row will be selected initially
-   */
-  selectedInitialRow: PropTypes.string
+	["aria-label"]: prop_types.default.string,
+	ariaLabel: require_deprecate.deprecate(prop_types.default.string, "This prop syntax has been deprecated. Please use the new `aria-label`."),
+	children: prop_types.default.node,
+	className: prop_types.default.string,
+	isCondensed: prop_types.default.bool,
+	isFlush: prop_types.default.bool,
+	selection: prop_types.default.bool,
+	selectedInitialRow: prop_types.default.string
 };
 function StructuredListHead(props) {
-  const {
-    children,
-    className,
-    ...other
-  } = props;
-  const prefix = usePrefix.usePrefix();
-  const classes = cx(`${prefix}--structured-list-thead`, className);
-  return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
-    role: "rowgroup",
-    className: classes
-  }, other), children);
+	const { children, className, ...other } = props;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		role: "rowgroup",
+		className: (0, classnames.default)(`${require_usePrefix.usePrefix()}--structured-list-thead`, className),
+		...other,
+		children
+	});
 }
 StructuredListHead.propTypes = {
-  /**
-   * Provide the contents of your StructuredListHead
-   */
-  children: PropTypes.node,
-  /**
-   * Specify an optional className to be applied to the node
-   */
-  className: PropTypes.string
+	children: prop_types.default.node,
+	className: prop_types.default.string
 };
 function StructuredListBody(props) {
-  const {
-    children,
-    className,
-    ...other
-  } = props;
-  const prefix = usePrefix.usePrefix();
-  const classes = cx(`${prefix}--structured-list-tbody`, className);
-  return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
-    className: classes,
-    role: "rowgroup"
-  }, other), children);
+	const { children, className, ...other } = props;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: (0, classnames.default)(`${require_usePrefix.usePrefix()}--structured-list-tbody`, className),
+		role: "rowgroup",
+		...other,
+		children
+	});
 }
 StructuredListBody.propTypes = {
-  /**
-   * Provide the contents of your StructuredListBody
-   */
-  children: PropTypes.node,
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-  head: PropTypes.bool,
-  /**
-   * Provide a handler that is invoked on the key down event for the control
-   */
-  onKeyDown: PropTypes.func
+	children: prop_types.default.node,
+	className: prop_types.default.string,
+	head: prop_types.default.bool,
+	onKeyDown: prop_types.default.func
 };
-const GridRowContext = /*#__PURE__*/React.createContext(null);
+const GridRowContext = react.default.createContext(null);
 function StructuredListRow(props) {
-  const {
-    onKeyDown,
-    children,
-    className,
-    head,
-    onClick,
-    selection,
-    id,
-    ...other
-  } = props;
-  const [hasFocusWithin, setHasFocusWithin] = React.useState(false);
-  const generatedRowId = useId.useId('grid-input');
-  const rowId = id ?? generatedRowId;
-  const selectedRow = React.useContext(GridSelectedRowStateContext);
-  const setSelectedRow = React.useContext(GridSelectedRowDispatchContext);
-  const prefix = usePrefix.usePrefix();
-  const value = {
-    id: rowId
-  };
-  const classes = cx(`${prefix}--structured-list-row`, {
-    [`${prefix}--structured-list-row--header-row`]: head,
-    [`${prefix}--structured-list-row--focused-within`]: hasFocusWithin && !selection || hasFocusWithin && selection && (selectedRow === rowId || selectedRow === null),
-    // Ensure focus on the first item when navigating through Tab keys and no row is selected (selectedRow === null)
-    [`${prefix}--structured-list-row--selected`]: selectedRow === rowId
-  }, className);
-  const itemRef = React.useRef(null);
-  const handleClick = () => {
-    setHasFocusWithin(false);
-  };
-  useOutsideClick.useOutsideClick(itemRef, handleClick);
-  return head ? /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
-    role: "row"
-  }, other, {
-    className: classes
-  }), selection && (_StructuredListCell || (_StructuredListCell = /*#__PURE__*/React.createElement(StructuredListCell, {
-    head: true
-  }))), children) :
-  /*#__PURE__*/
-  // eslint-disable-next-line jsx-a11y/interactive-supports-focus
-  React.createElement("div", _rollupPluginBabelHelpers.extends({}, other, {
-    role: "row",
-    className: classes,
-    ref: itemRef,
-    onClick: event => {
-      setSelectedRow?.(rowId);
-      onClick?.(event);
-      if (selection) {
-        // focus items only when selection is enabled
-        setHasFocusWithin(true);
-      }
-    },
-    onFocus: event => {
-      if (selection || event.currentTarget === event.target) {
-        setHasFocusWithin(true);
-      }
-    },
-    onBlur: () => {
-      setHasFocusWithin(false);
-    },
-    onKeyDown: onKeyDown
-  }), /*#__PURE__*/React.createElement(GridRowContext.Provider, {
-    value: value
-  }, selection && /*#__PURE__*/React.createElement(StructuredListCell, null, selectedRow === rowId ? /*#__PURE__*/React.createElement(iconsReact.RadioButtonChecked, {
-    className: `${prefix}--structured-list__icon`
-  }) : /*#__PURE__*/React.createElement(iconsReact.RadioButton, {
-    className: `${prefix}--structured-list__icon`
-  })), children));
+	const { onKeyDown, children, className, head, onClick, selection, id, ...other } = props;
+	const [hasFocusWithin, setHasFocusWithin] = (0, react.useState)(false);
+	const generatedRowId = require_useId.useId("grid-input");
+	const rowId = id ?? generatedRowId;
+	const selectedRow = react.default.useContext(GridSelectedRowStateContext);
+	const setSelectedRow = react.default.useContext(GridSelectedRowDispatchContext);
+	const prefix = require_usePrefix.usePrefix();
+	const value = { id: rowId };
+	const classes = (0, classnames.default)(`${prefix}--structured-list-row`, {
+		[`${prefix}--structured-list-row--header-row`]: head,
+		[`${prefix}--structured-list-row--focused-within`]: hasFocusWithin && !selection || hasFocusWithin && selection && (selectedRow === rowId || selectedRow === null),
+		[`${prefix}--structured-list-row--selected`]: selectedRow === rowId
+	}, className);
+	const itemRef = (0, react.useRef)(null);
+	const handleClick = () => {
+		setHasFocusWithin(false);
+	};
+	require_useOutsideClick.useOutsideClick(itemRef, handleClick);
+	return head ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "row",
+		...other,
+		className: classes,
+		children: [selection && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StructuredListCell, { head: true }), children]
+	}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		...other,
+		role: "row",
+		className: classes,
+		ref: itemRef,
+		onClick: (event) => {
+			setSelectedRow?.(rowId);
+			onClick?.(event);
+			if (selection) setHasFocusWithin(true);
+		},
+		onFocus: (event) => {
+			if (selection || event.currentTarget === event.target) setHasFocusWithin(true);
+		},
+		onBlur: () => {
+			setHasFocusWithin(false);
+		},
+		onKeyDown,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(GridRowContext.Provider, {
+			value,
+			children: [selection && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(StructuredListCell, { children: selectedRow === rowId ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_carbon_icons_react.RadioButtonChecked, { className: `${prefix}--structured-list__icon` }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_carbon_icons_react.RadioButton, { className: `${prefix}--structured-list__icon` }) }), children]
+		})
+	});
 }
 StructuredListRow.propTypes = {
-  /**
-   * Provide the contents of your StructuredListRow
-   */
-  children: PropTypes.node,
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-  /**
-   * Specify whether your StructuredListRow should be used as a header row
-   */
-  head: PropTypes.bool,
-  /**
-   * Specify whether a `<label>` should be used
-   */
-  label: deprecate.deprecate(PropTypes.bool, `\nThe \`label\` prop is no longer needed and will be removed in the next major version of Carbon.`),
-  /**
-   * Provide a handler that is invoked on the click
-   */
-  onClick: PropTypes.func,
-  /**
-   * Provide a handler that is invoked on the key down event for the control,
-   */
-  onKeyDown: PropTypes.func,
-  /**
-   * Mark if this row should be selectable
-   */
-  selection: PropTypes.bool,
-  /**
-   * Specify row id so that it can be used for initial selection
-   */
-  id: PropTypes.string
+	children: prop_types.default.node,
+	className: prop_types.default.string,
+	head: prop_types.default.bool,
+	label: require_deprecate.deprecate(prop_types.default.bool, `\nThe \`label\` prop is no longer needed and will be removed in the next major version of Carbon.`),
+	onClick: prop_types.default.func,
+	onKeyDown: prop_types.default.func,
+	selection: prop_types.default.bool,
+	id: prop_types.default.string
 };
 function StructuredListInput(props) {
-  const defaultId = useId.useId('structureListInput');
-  const {
-    className,
-    name = `structured-list-input-${defaultId}`,
-    title,
-    id,
-    onChange,
-    ...other
-  } = props;
-  const prefix = usePrefix.usePrefix();
-  const classes = cx(`${prefix}--structured-list-input`, `${prefix}--visually-hidden`, className);
-  const row = React.useContext(GridRowContext);
-  const selectedRow = React.useContext(GridSelectedRowStateContext);
-  const setSelectedRow = React.useContext(GridSelectedRowDispatchContext);
-  return /*#__PURE__*/React.createElement("input", _rollupPluginBabelHelpers.extends({}, other, {
-    type: "radio",
-    tabIndex: 0,
-    checked: !!row && row.id === selectedRow,
-    value: row?.id ?? '',
-    onChange: event => {
-      setSelectedRow?.(event.target.value);
-      onChange?.(event);
-    },
-    id: id ?? defaultId,
-    className: classes,
-    name: name,
-    title: title
-  }));
+	const defaultId = require_useId.useId("structureListInput");
+	const { className, name = `structured-list-input-${defaultId}`, title, id, onChange, ...other } = props;
+	const prefix = require_usePrefix.usePrefix();
+	const classes = (0, classnames.default)(`${prefix}--structured-list-input`, `${prefix}--visually-hidden`, className);
+	const row = react.default.useContext(GridRowContext);
+	const selectedRow = react.default.useContext(GridSelectedRowStateContext);
+	const setSelectedRow = react.default.useContext(GridSelectedRowDispatchContext);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+		...other,
+		type: "radio",
+		tabIndex: 0,
+		checked: !!row && row.id === selectedRow,
+		value: row?.id ?? "",
+		onChange: (event) => {
+			setSelectedRow?.(event.target.value);
+			onChange?.(event);
+		},
+		id: id ?? defaultId,
+		className: classes,
+		name,
+		title
+	});
 }
 StructuredListInput.propTypes = {
-  /**
-   * Specify an optional className to be applied to the input
-   */
-  className: PropTypes.string,
-  /**
-   * Specify whether the underlying input should be checked by default
-   */
-  defaultChecked: deprecate.deprecate(PropTypes.bool, `\nThe prop \`defaultChecked\` is no longer needed and will be removed in the next major version of Carbon.`),
-  /**
-   * Specify a custom `id` for the input
-   */
-  id: PropTypes.string,
-  /**
-   * Provide a `name` for the input
-   */
-  name: PropTypes.string,
-  /**
-   * Provide an optional hook that is called each time the input is updated
-   */
-  onChange: PropTypes.func,
-  /**
-   * Provide a `title` for the input
-   */
-  title: PropTypes.string,
-  /**
-   * Specify the value of the input
-   */
-  value: deprecate.deprecate(PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired, `\nThe prop \`value\` will be removed in the next major version of Carbon.`)
+	className: prop_types.default.string,
+	defaultChecked: require_deprecate.deprecate(prop_types.default.bool, `\nThe prop \`defaultChecked\` is no longer needed and will be removed in the next major version of Carbon.`),
+	id: prop_types.default.string,
+	name: prop_types.default.string,
+	onChange: prop_types.default.func,
+	title: prop_types.default.string,
+	value: require_deprecate.deprecate(prop_types.default.oneOfType([prop_types.default.string, prop_types.default.number]).isRequired, `\nThe prop \`value\` will be removed in the next major version of Carbon.`)
 };
 function StructuredListCell(props) {
-  const {
-    children,
-    className,
-    head,
-    noWrap,
-    ...other
-  } = props;
-  const prefix = usePrefix.usePrefix();
-  const classes = cx({
-    [`${prefix}--structured-list-th`]: head,
-    [`${prefix}--structured-list-td`]: !head,
-    [`${prefix}--structured-list-content--nowrap`]: noWrap
-  }, className);
-  if (head) {
-    return /*#__PURE__*/React.createElement(Text.Text, _rollupPluginBabelHelpers.extends({
-      className: classes,
-      role: "columnheader"
-    }, other), children);
-  }
-  return /*#__PURE__*/React.createElement(Text.Text, _rollupPluginBabelHelpers.extends({
-    as: "div",
-    className: classes,
-    role: "cell"
-  }, other), children);
+	const { children, className, head, noWrap, ...other } = props;
+	const prefix = require_usePrefix.usePrefix();
+	const classes = (0, classnames.default)({
+		[`${prefix}--structured-list-th`]: head,
+		[`${prefix}--structured-list-td`]: !head,
+		[`${prefix}--structured-list-content--nowrap`]: noWrap
+	}, className);
+	if (head) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Text.Text, {
+		className: classes,
+		role: "columnheader",
+		...other,
+		children
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Text.Text, {
+		as: "div",
+		className: classes,
+		role: "cell",
+		...other,
+		children
+	});
 }
 StructuredListCell.propTypes = {
-  /**
-   * Provide the contents of your StructuredListCell
-   */
-  children: PropTypes.node,
-  /**
-   * Specify an optional className to be applied to the container node
-   */
-  className: PropTypes.string,
-  /**
-   * Specify whether your StructuredListCell should be used as a header cell
-   */
-  head: PropTypes.bool,
-  /**
-   * Specify whether your StructuredListCell should have text wrapping
-   */
-  noWrap: PropTypes.bool
+	children: prop_types.default.node,
+	className: prop_types.default.string,
+	head: prop_types.default.bool,
+	noWrap: prop_types.default.bool
 };
 
+//#endregion
 exports.StructuredListBody = StructuredListBody;
 exports.StructuredListCell = StructuredListCell;
 exports.StructuredListHead = StructuredListHead;
 exports.StructuredListInput = StructuredListInput;
 exports.StructuredListRow = StructuredListRow;
-exports.StructuredListWrapper = StructuredListWrapper;
+exports.StructuredListWrapper = StructuredListWrapper;